/* Inter (SIL OFL 1.1), see /assets/fonts/Inter-LICENSE.txt */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/fonts/InterVariable.woff2?v=71c5befd6a") format("woff2");
}

:root {
  --accent: #000;
  --accent-soft: #eceef1;
  --gradient-tag: linear-gradient(180deg, #4a4b52 0%, #17181e 50%, #000 100%);
  --t2: #7f838a;
  --t3: #a1a5ab;
  --ease: .2s ease;
  --dark-tile: #0c0d10;
  --ink: #121214;
  --ink-h1: #1d1d1f;
  --muted: #6a6e73;
  --line: #e6e8eb;
  --tile: #f0f0f0;
  --board: #f5f7fa;
  --section-alt: #f3f5f8;
  --up: #20b26c;
  --down: #ef454a;
  --container: 1200px;
  --hd-h: 56px;
  --g-ink: linear-gradient(180deg, #34363d 0%, #000 100%);
  --g-ink-hover: linear-gradient(180deg, #4a4c54 0%, #111216 100%);
  --g-glass: linear-gradient(180deg, rgba(17,18,22,.94) 0%, rgba(24,25,30,.78) 100%);
  --dark: #111216;
  --text-2: #3d4148;
  --h-dim: #8e9298;
  --line-strong: #c9cdd3;
  --up-text: #0f7a47;
  --down-text: #c8282e;
  --up-on-dark: #3ed08b;
  --down-on-dark: #ff6b70;
  --warn-bg: #fff8eb;
  --warn-line: #fde4b8;
  --r-card: 24px;
  --r-panel: 16px;
  --r-ctl: 12px;
  --r-tile-sm: 10px;
  --r-sm: 8px;
  --r-chg: 6px;
  --sh-card: 0 1px 2px rgba(16,24,40,.04), 0 16px 40px -24px rgba(16,24,40,.12);
  --sh-lift: 0 1px 2px rgba(16,24,40,.04), 0 28px 44px -18px rgba(16,24,40,.2);
  --sh-main: 0 28px 64px -32px rgba(16,24,40,.24);
  --sh-float: 0 1px 2px rgba(16,24,40,.06), 0 18px 36px -18px rgba(16,24,40,.28);
  --sh-pop: 0 16px 32px -8px rgba(16,24,40,.18), 0 4px 8px -4px rgba(16,24,40,.06);
  --sh-dark: 0 32px 64px -32px rgba(12,13,16,.6), inset 0 1px 0 rgba(255,255,255,.08);
  --ring: 0 0 0 3px rgba(16,24,40,.08);
  --card-bg: linear-gradient(180deg, #fff 0%, #fafbfc 100%) padding-box, linear-gradient(180deg, rgba(16,24,40,.12) 0%, rgba(16,24,40,.04) 100%) border-box;
  --tint-bg: linear-gradient(135deg, #f5f7fa 0%, #eef2f6 100%);
  --tint-line: rgba(16,24,40,.04);
  --g-dark: radial-gradient(120% 80% at 100% 0%, #2b2d35 0%, #111216 50%, #0c0d10 100%);
  --ico-bg: linear-gradient(180deg, #fff 0%, #eef1f5 100%);
  --ico-line: rgba(16,24,40,.08);
  --ico-dark-bg: linear-gradient(180deg, rgba(255,255,255,.16) 0%, rgba(255,255,255,.04) 100%);
  --ico-dark-line: rgba(255,255,255,.14);
  --sec-y: 96px;
  --head-gap: 40px;
  --g-line: linear-gradient(90deg, transparent 0%, rgba(16,24,40,.24) 50%, transparent 100%);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--hd-h) + 16px); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0; background: #fff; color: var(--ink);
  font-family: "Inter", system-ui, BlinkMacSystemFont, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 14px; line-height: 1.4; -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; }
h1, h2, h3, p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.v2-skip { position: absolute; left: 16px; top: -48px; z-index: 100; padding: 8px 14px; background: var(--accent); color: #fff; border-radius: 100px; }
.v2-skip:focus { top: 8px; }
.accent { color: var(--accent); }

/* Buttons (Bybit: pill, 600) */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  height: 48px; padding: 0 24px; border: 0; border-radius: 100px;
  font-size: 16px; font-weight: 600; line-height: 21px; white-space: nowrap;
  transition: background var(--ease), transform var(--ease);
}
.btn svg { width: 20px; height: 20px; flex: none; }
.btn--accent, .btn--accent:active { background: var(--g-ink); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.14); }
@media (hover: hover) and (pointer: fine) { .btn--accent:hover { background: var(--g-ink-hover); } }
.btn--accent svg [opacity="0.4"] { opacity: .6; }
.btn--accent:active { transform: scale(.98); }
.btn--soft { background: var(--board); color: var(--ink); }
.btn--lg { padding: 14px 32px; font-size: 18px; line-height: 26px; }
.btn--xl { height: 56px; padding: 14px 32px; font-size: 18px; line-height: 26px; }

/* Icon tiles: one light and one dark style. Sizes: 40px / r12 / 20px icon in cards, 32px / r10 / 16px in illustrations, 28px / r8 in compact headers.
   Circles are diagram nodes only: brand (Coinfra) is dark, every other node is light. Green and red mark status, never a plain icon. */
.stats__icon, .split__fact-ico, .corp__icon, .cycle__wallet i, .board__trend-tag i, .board__mini-title i, .px-method__ico, .px-lock__ico, .px-bento__ico, .ab-card__ico, .ab-aud__ico, .ab-doc__head i, .ab-pair__head i, .ab-tk__file > i, .app__float i, .dep__ico, .nt-status__ico, .nt-files__ico, .fe-sum__ico { color: var(--ink); background: var(--ico-bg); border: 1px solid var(--ico-line); }
.ab-tile__ico, .ab-aud__card--dark .ab-aud__ico, .ab-lic .ab-card__ico, .px-lock--dark .px-lock__ico, .px-bento__card--hero .px-bento__ico, .px-plat__ico, .ab-hero .board__trend-tag i, .ab-hero .board__mini-title i, .wd__icon { color: #fff; background: var(--ico-dark-bg); border: 1px solid var(--ico-dark-line); }
.ab-flow__rub, .ab-pair__node i, .ab-pair__link i, .ab-tk__vis i, .ab-tk__avatar { color: var(--ink); background: #fff; border: 1px solid var(--line); }
.ab-pair__node--co i, .ab-tk__vis i.is-co { color: #fff; background: var(--g-ink); border-color: var(--dark); }
.board__trend-tag i svg, .board__mini-title i svg, .ab-tk__file > i svg, .ab-pair__head i svg { width: 16px; height: 16px; }
.px-bento__ico svg, .ab-flow__rub svg { width: 20px; height: 20px; }

/* Header */
.hd { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; gap: 8px; height: var(--hd-h); padding: 0 24px; color: #fff; transition: box-shadow .25s ease; }
.hd::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(17,18,22,.94); -webkit-backdrop-filter: saturate(160%) blur(16px); backdrop-filter: saturate(160%) blur(16px); pointer-events: none; }
.hd.is-scrolled { box-shadow: 0 10px 30px rgba(0,0,0,.18); }
.hd__logo { flex: none; margin-right: 16px; }
.hd__logo img { width: 112px; height: auto; }
.hd__nav { display: flex; align-items: center; gap: 2px; height: 100%; }
.hd__item { position: relative; display: flex; align-items: center; height: 100%; }
.hd__item > a { display: flex; align-items: center; gap: 4px; height: 100%; padding: 0 12px; font-size: 14px; font-weight: 500; white-space: nowrap; color: rgba(255,255,255,.76); transition: color .2s; }
.hd__item > a:hover, .hd__item--drop.is-open > a { color: #fff; }
.hd__item--drop > a::after {
  content: ""; width: 6px; height: 6px; margin: -3px 0 0 4px;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; opacity: .6; transform: rotate(45deg); transition: transform .2s, margin .2s;
}
.hd__item--drop.is-open > a::after { margin-top: 3px; transform: rotate(225deg); }
.hd__menu {
  position: absolute; left: 0; top: calc(100% - 1px); width: 320px; padding: 8px 8px 12px; color: #fff;
  background: var(--g-glass); -webkit-backdrop-filter: saturate(160%) blur(20px); backdrop-filter: saturate(160%) blur(20px);
  border-radius: 0 0 12px 12px; box-shadow: 0 18px 36px rgba(0,0,0,.32);
  clip-path: inset(0 100% -48px -48px); opacity: 0; visibility: hidden;
}
.hd__menu a { display: flex; align-items: flex-start; gap: 12px; padding: 12px; color: #fff; border-radius: var(--r-sm); transition: background-color .15s; }
.hd__menu a:hover { background: rgba(255,255,255,.06); }
.hd__nav > .hd__item:last-child .hd__menu { left: auto; right: 0; clip-path: inset(0 -48px -48px 100%); }
.hd__nav > .hd__item--drop.is-open .hd__menu { clip-path: inset(0 -48px -48px -48px); opacity: 1; visibility: visible; transition: clip-path .3s cubic-bezier(.2,.7,.2,1), opacity .2s; }
.hd__mi { display: flex; flex: 1; flex-direction: column; gap: 4px; min-width: 0; }
.hd__mi b { font-size: 14px; line-height: 20px; font-weight: 600; color: #fff; }
.hd__mi small { font-size: 12px; line-height: 17px; color: rgba(255,255,255,.45); }
.hd__menu--trade { width: 280px; padding: 0 8px 8px; }
.hd__tabs { position: relative; display: flex; gap: 20px; padding: 0 10px; border-bottom: 1px solid rgba(255,255,255,.08); }
.hd__tabs button { position: relative; height: 40px; padding: 0; font: inherit; font-size: 14px; font-weight: 600; color: rgba(255,255,255,.5); background: none; border: 0; cursor: pointer; transition: color .15s; }
.hd__tabs-bar { position: absolute; left: 0; bottom: -1px; width: var(--tab-w, 0); height: 2px; background: #fff; border-radius: 2px; transform: translateX(var(--tab-x, 0)); }
.hd__tabs-bar.is-ready { transition: transform .28s cubic-bezier(.2,.7,.2,1), width .28s cubic-bezier(.2,.7,.2,1); }
.hd__tabs button:hover, .hd__tabs button[aria-selected="true"] { color: #fff; }
.hd__trade-panel { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding-top: 8px; }
.hd__search { display: flex; align-items: center; gap: 8px; height: 34px; padding: 0 10px; color: rgba(255,255,255,.45); background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: 10px; transition: border-color .15s; }
.hd__search:focus-within { border-color: rgba(255,255,255,.32); }
.hd__search svg { flex: none; width: 16px; height: 16px; }
.hd__search input { flex: 1; min-width: 0; font: inherit; font-size: 13px; color: #fff; background: none; border: 0; outline: none; }
.hd__search input::placeholder { color: rgba(255,255,255,.4); }
.hd__search input::-webkit-search-cancel-button { filter: invert(1) grayscale(1); opacity: .5; }
.hd__menu a.hd__pair { display: grid; flex: none; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; align-items: center; height: 36px; padding: 0 10px; }
.hd__pairs { display: flex; flex-direction: column; min-height: 180px; max-height: 288px; margin-right: -4px; padding-right: 4px; overflow-y: auto; overscroll-behavior: contain; }
.hd__pairs::-webkit-scrollbar, .pick-dark .trade__asset-list::-webkit-scrollbar { width: 4px; }
.hd__pairs::-webkit-scrollbar-track, .pick-dark .trade__asset-list::-webkit-scrollbar-track { background: transparent; }
.hd__pairs::-webkit-scrollbar-thumb, .pick-dark .trade__asset-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius: 4px; }
.hd__pairs::-webkit-scrollbar-thumb:hover, .pick-dark .trade__asset-list::-webkit-scrollbar-thumb:hover { background: rgba(255,255,255,.4); }
.hd__pairs::-webkit-scrollbar-button, .pick-dark .trade__asset-list::-webkit-scrollbar-button { display: none; height: 0; }
@supports not selector(::-webkit-scrollbar) { .hd__pairs, .pick-dark .trade__asset-list { scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.22) transparent; } }
.hd__trade-panel .hd__pair img { width: 20px; height: 20px; border-radius: 50%; }
.hd__pair-name { font-size: 13px; font-weight: 600; color: #fff; }
.hd__pair-name small { font-size: 12px; font-weight: 500; color: rgba(255,255,255,.45); }
.hd__pairs-empty { margin: 0; padding: 16px 12px; font-size: 13px; color: rgba(255,255,255,.5); }
.hd__ico { display: grid; flex: none; place-items: center; width: 20px; height: 20px; color: #fff; }
.hd__ico svg { width: 20px; height: 20px; }
.hd__right { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.hd__login { display: inline-flex; align-items: center; height: 36px; padding: 0 16px; font-size: 14px; font-weight: 600; border: 1px solid rgba(255,255,255,.18); border-radius: 100px; transition: background-color .2s, border-color .2s; }
.hd__login:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.3); }
.hd__reg { height: 36px; padding: 0 18px; font-size: 14px; }
.hd__login, .hd__reg { gap: 6px; }
.hd__login svg, .hd__reg svg { flex: none; width: 16px; height: 16px; }
.hd :focus-visible { outline-color: #fff; }
.hd__burger { display: none; width: 36px; height: 36px; padding: 7px; color: #fff; background: rgba(255,255,255,.07); border: 0; border-radius: var(--r-tile-sm); }
.hd__burger[aria-expanded="true"] { background: rgba(255,255,255,.14); }
@media (prefers-reduced-motion: reduce) { .hd, .hd__item > a, .hd__item--drop > a::after, .hd__menu, .hd__menu a, .hd__tabs button, .hd__tabs-bar.is-ready, .hd__search, .hd__login { transition: none; } .hd__nav > .hd__item--drop.is-open .hd__menu { transition: none; } }
.mnav { position: fixed; inset: var(--hd-h) 0 0 0; display: flex; flex-direction: column; padding: 8px 20px 24px; background: #fff; color: var(--ink); overflow: auto; }
.mnav[hidden] { display: none; }
.mnav__link, .mnav__group > summary { display: flex; align-items: center; justify-content: space-between; padding: 16px 0; font-size: 16px; font-weight: 600; cursor: pointer; list-style: none; }
.mnav__link, .mnav__group { border-bottom: 1px solid var(--line); }
.mnav__group > summary::-webkit-details-marker { display: none; }
.mnav__link::after, .mnav__group > summary::after { content: ""; width: 7px; height: 7px; margin-right: 4px; border-top: 1.5px solid var(--t3); border-right: 1.5px solid var(--t3); transform: rotate(45deg); transition: transform .2s; }
.mnav__group > summary::after { transform: rotate(135deg); }
.mnav__group[open] > summary::after { transform: rotate(-45deg); }
.mnav__group[open] { padding-bottom: 8px; }
.mnav__group > a { display: block; padding: 10px 0 10px 12px; font-size: 15px; font-weight: 500; color: var(--ink); }
.mnav__cta { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 24px; }

/* Hero */
.hero { padding: 40px 0 64px; background: #fff; }
.hero__wrap { display: flex; justify-content: space-between; align-items: center; gap: 40px; max-width: var(--container); margin: 0 auto; }
.hero__left { flex: 0 1 520px; min-width: 0; }
.board { flex: none; width: 600px; padding: 12px; background: var(--board); border-radius: var(--r-card); display: flex; flex-direction: column; gap: 12px; }
.hero__badge { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 20px; padding: 0 0 0 2px; font-size: 13px; line-height: 20px; font-weight: 600; color: var(--ink); }
.hero__badge i { position: relative; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
.hero__badge i::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--accent); animation: hero-ping 2s ease-out infinite; }
@keyframes hero-ping { from { transform: scale(1); opacity: .55; } to { transform: scale(2.8); opacity: 0; } }
.hero__title { font-size: 52px; line-height: 58px; font-weight: 700; letter-spacing: -0.035em; color: var(--ink-h1); text-wrap: balance; }
.hero__steps { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 24px; }
.hero__steps li { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px 0 9px; font-size: 13px; line-height: 18px; font-weight: 500; color: var(--ink); background: #fff; border: 1px solid var(--line); border-radius: 100px; }
.hero__steps svg { flex: none; color: var(--muted); }
.hero__steps [opacity] { display: none; }
.hero__form {
  display: flex; align-items: center; height: 64px; margin-top: 32px; padding: 8px 8px 8px 22px;
  background: #fff; border: 1px solid var(--line-strong); border-radius: 100px;
  transition: border-color .2s, box-shadow .2s;
}
.hero__form:hover { border-color: var(--t3); }
.hero__form:focus-within { border-color: var(--ink); box-shadow: var(--ring); }
.hero__form.is-invalid { border-color: var(--down); box-shadow: 0 0 0 4px rgba(239,69,74,.12); }
.hero__input { flex: 1; min-width: 0; height: 20px; border: 0; background: transparent; font: inherit; font-size: 16px; line-height: 16px; color: var(--ink-h1); outline: none; }
.hero__input::placeholder { color: var(--t2); }
.hero__btn { flex: none; border-radius: 100px; }
.hero__err { margin-top: 8px; padding-left: 24px; color: var(--down); }
@media (prefers-reduced-motion: reduce) { .hero__badge i::after { animation: none; } }
@media (min-width: 1081px) and (max-width: 1260px) {
  .hero__steps li { padding: 0 12px; }
  .hero__steps svg { display: none; }
}
.board__top { display: grid; grid-template-columns: 275px minmax(0, 1fr); gap: 12px; }
.board__trend { display: flex; flex-direction: column; min-width: 0; padding: 24px 24px 20px; background: #fff; border-radius: var(--r-panel); overflow: hidden; }
.board__trend-tag, .board__mini-title { display: flex; align-items: center; gap: 10px; font-size: 18px; line-height: 26px; font-weight: 600; color: #000; }
.board__trend-tag i, .board__mini-title i { display: grid; place-items: center; flex: none; width: 28px; height: 28px; border-radius: var(--r-sm); }
.board__trend-asset { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.board__trend-asset img { flex: none; width: 36px; height: 36px; border-radius: 50%; }
.board__trend-asset b { display: block; font-size: 16px; line-height: 22px; font-weight: 600; color: #000; }
.board__trend-asset small { display: block; font-size: 13px; line-height: 18px; color: var(--muted); }
.board__trend-chart { position: relative; flex: 1; min-height: 110px; margin: 8px -24px 0; color: #b8bec8; }
.board__trend-chart.is-up { color: var(--up); }
.board__trend-chart.is-down { color: var(--down); }
.board__trend-chart svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.board__trend-chart:not(.is-ready) circle { display: none; }
.board__trend-chart [data-trend-guide] { opacity: 0; transition: opacity .15s; }
.board__trend-chart.is-hover [data-trend-guide] { opacity: .45; }
.board__trend-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; margin-top: 8px; }
.board__trend-price { min-width: 0; }
.board__trend-price strong { display: block; font-size: 22px; line-height: 28px; letter-spacing: -.01em; font-weight: 600; color: #000; font-variant-numeric: tabular-nums; white-space: nowrap; }
.board__trend-price > span { display: block; font-size: 13px; line-height: 18px; color: var(--muted); }
.board__trend-price .chg { display: inline-block; margin-right: 2px; padding: 1px 6px; font-style: normal; font-weight: 600; background: var(--board); border-radius: var(--r-chg); }
.board__trend-price .chg.is-up { background: rgba(32,178,108,.1); }
.board__trend-price .chg.is-down { background: rgba(239,69,74,.1); }
.board__mini { display: flex; flex-direction: column; padding: 24px 24px 12px; background: #fff; border-radius: var(--r-panel); }
.board__mini ul { margin-top: 8px; }
.board__mini a { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 12px; margin: 0 -12px; padding: 10px 12px; border-radius: var(--r-ctl); transition: background-color var(--ease); }
.board__mini img { width: 28px; height: 28px; border-radius: 50%; }
.board__mini b, .board__mini small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.board__mini b { display: block; font-size: 14px; line-height: 20px; font-weight: 600; }
.board__mini small { display: block; font-size: 11px; line-height: 16px; color: var(--muted); }
.board__mini-val { text-align: right; font-size: 14px; line-height: 20px; font-weight: 600; font-variant-numeric: tabular-nums; }
.board__mini-val .chg { display: block; font-size: 11px; line-height: 16px; }
.board__list { padding: 24px 24px 8px; background: #fff; border-radius: var(--r-panel); }
.board__tabs { display: flex; align-items: center; gap: 4px; margin: -6px 0 0 -10px; }
.board__tablist { display: flex; align-items: center; gap: 4px; }
.board__tab { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 0; border-radius: 100px; background: none; font-size: 16px; line-height: 22px; font-weight: 600; color: var(--muted); transition: background-color var(--ease), color var(--ease); }
.board__tab, .board__all { white-space: nowrap; }
.board__tab:hover { color: #000; }
.board__tab.is-active { color: #000; background: var(--accent-soft); }
.board__tab svg { flex: none; }
.board__tab.is-active[data-board-tab=gainers] svg { color: var(--up); }
.board__tab.is-active[data-board-tab=losers] svg { color: var(--down); }
.board__all { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font-size: 14px; line-height: 20px; font-weight: 500; color: #000; }
.board__all svg { flex: none; transition: transform var(--ease); }
.board__all:hover svg, .board__all:focus-visible svg { transform: translateX(3px); }
.board__head, .board__rows a { display: grid; align-items: center; gap: 10px; }
.board__head { grid-template-columns: minmax(0, 1fr) 128px 72px; margin-top: 14px; padding: 0 0 8px; font-size: 12px; line-height: 16px; font-weight: 500; color: var(--muted); border-bottom: 1px solid var(--line); }
.board__head span:not(:first-child) { text-align: right; }
.board__rows { display: flex; flex-direction: column; min-height: calc(var(--rows, 3) * 39px); margin-top: 4px; }
.board__rows a { grid-template-columns: 24px minmax(0, 1fr) 64px 118px 72px; height: 39px; margin: 0 -12px; padding: 0 12px; font-size: 14px; border-radius: var(--r-sm); transition: background-color var(--ease); }
.board__rows img { width: 24px; height: 24px; border-radius: 50%; }
.board__rows b { font-weight: 600; line-height: 20px; color: #000; white-space: nowrap; }
.board__rows b span { font-weight: 500; color: var(--muted); }
.board__rows-spark { width: 64px; height: 22px; overflow: visible; }
.board__rows-price { font-weight: 500; font-variant-numeric: tabular-nums; color: #000; text-align: right; white-space: nowrap; }
.board__rows .chg { justify-self: end; }
.board__rows-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1; gap: 12px; padding: 16px 0; font-size: 14px; line-height: 20px; color: var(--muted); text-align: center; }
.board__rows-empty svg { width: 40px; height: 40px; color: var(--t3); }
.board__mini a:hover, .board__rows a:hover, .board__mini a:focus-visible, .board__rows a:focus-visible { background: var(--board); }
.chg { font-style: normal; font-weight: 500; font-variant-numeric: tabular-nums; color: var(--muted); }
.chg.is-up { color: var(--up-text); }
.chg.is-down { color: var(--down-text); }
.chg--pill { display: inline-block; min-width: 64px; padding: 2px 8px; font-size: 13px; line-height: 18px; font-weight: 600; text-align: center; background: var(--board); border-radius: var(--r-chg); }
.chg--pill.is-up { background: rgba(32,178,108,.1); }
.chg--pill.is-down { background: rgba(239,69,74,.1); }
.sk { display: block; height: 14px; border-radius: 6px; background: linear-gradient(90deg, var(--board), #e6e9ee, var(--board)); background-size: 200% 100%; animation: sk 1.4s infinite; }
@keyframes sk { to { background-position: -200% 0; } }
.sk-row { padding: 12px 0; }

.mcards { display: none; }

.stats { display: grid; grid-template-columns: repeat(4, 1fr); width: min(var(--container), calc(100% - 48px)); margin: 48px auto 0; border: 1px solid transparent; background: var(--card-bg); border-radius: var(--r-card); box-shadow: var(--sh-card); }
.stats__item { position: relative; display: flex; flex-direction: column; min-width: 0; padding: 28px 32px 30px; }
.stats__item + .stats__item::before { content: ""; position: absolute; left: 0; top: 28px; bottom: 28px; width: 1px; background: var(--line); }
.stats__icon, .stats__coins { display: flex; align-items: center; height: 40px; margin-bottom: 24px; }
.stats__icon { justify-content: center; width: 40px; border-radius: var(--r-ctl); }
.stats__coins img { flex: none; width: 28px; height: 28px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 2px #fff; }
.stats__coins img + img { margin-left: -8px; }
.stats strong { font-size: 36px; line-height: 44px; font-weight: 700; letter-spacing: -0.02em; background: linear-gradient(180deg, #121214 30%, #4b4f58 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.stats__lbl { margin-top: 4px; font-size: 14px; line-height: 20px; color: var(--muted); }

/* Section heads */
.sec-head { display: flex; flex-direction: column; align-items: center; text-align: center; }
.h2 { font-size: 40px; line-height: 48px; font-weight: 700; letter-spacing: -0.03em; color: var(--ink-h1); text-wrap: balance; }
.sec-sub { margin-top: 8px; font-size: 20px; line-height: 28px; color: #000; }
.sec-head .btn { margin-top: 24px; }
.lbl { display: inline-flex; align-items: center; gap: 8px; font-size: 16px; line-height: 24px; color: #000; }
/* Mosaic */
.plat { padding: 48px 0 96px; background: var(--section-alt); }
.plat .tile { background-color: #fff; }
.plat .sec-head { padding: 0 24px; }
.hrow-view { overflow-x: auto; scrollbar-width: none; }
.hrow-view::-webkit-scrollbar { display: none; }
.hrow { display: flex; gap: 24px; width: max-content; margin-top: var(--head-gap); padding: 0 max(24px, calc((100vw - var(--container)) / 2)); }
.hrow > .tile { flex: 0 0 auto; height: 480px; aspect-ratio: 2 / 3; }
.tile__num { position: absolute; right: 20px; bottom: 16px; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--muted); font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.hrow .tile__title { margin-top: 4px; font-size: 22px; line-height: 30px; font-weight: 600; letter-spacing: -0.01em; }
.hrow .tile__title br { display: none; }
@media (min-width: 768px) and (prefers-reduced-motion: no-preference) {
  .hrow-track.is-pinned .hrow-view { position: sticky; top: var(--hd-h); display: flex; flex-direction: column; justify-content: center; height: calc(100vh - var(--hd-h)); padding: 24px 0; overflow: clip; }
  .hrow-track.is-pinned .hrow { flex: 0 1 480px; min-height: 340px; will-change: transform; }
  .hrow-track.is-pinned .hrow > .tile { height: 100%; }
}
.tile { position: relative; display: flex; flex-direction: column; align-items: center; height: 480px; padding: 32px 24px 0; text-align: center; background: var(--tile); border-radius: var(--r-card); overflow: hidden; }
.tile--link { transition: transform var(--ease), box-shadow var(--ease); }
.tile--link:hover { transform: translateY(-2px); box-shadow: var(--sh-lift); }
.tile__title { margin-top: 16px; font-size: 22px; line-height: 30px; font-weight: 600; letter-spacing: -0.01em; color: var(--ink-h1); }
.tile__art { flex: 1; display: flex; align-items: center; justify-content: center; width: 100%; }
/* Deposit card: balance with an incoming credit and the two deposit methods. Sizes follow the stage's shorter side (--u). */
.dep { --u: min(100cqw, 100cqh); position: absolute; inset: 0; display: grid; place-items: center; container-type: size; }
.dep__stack { display: flex; flex-direction: column; gap: calc(var(--u) * .045); width: calc(var(--u) * .86); }
.dep__bal, .dep__list { background: #fff; border-radius: calc(var(--u) * .06); box-shadow: 0 0 0 1px rgba(16,24,40,.05), 0 calc(var(--u) * .04) calc(var(--u) * .1) calc(var(--u) * -.04) rgba(16,24,40,.22); }
.dep__bal { position: relative; padding: calc(var(--u) * .055) calc(var(--u) * .06); }
.dep__bal-top { display: flex; align-items: center; justify-content: space-between; }
.dep__bal small { font-size: calc(var(--u) * .045); line-height: 1.3; font-weight: 500; color: var(--muted); }
.dep__cur { padding: calc(var(--u) * .008) calc(var(--u) * .025); font-size: calc(var(--u) * .036); line-height: 1.3; font-weight: 700; color: #fff; background: var(--accent); border-radius: 100px; }
.dep__bal strong { display: block; margin-top: calc(var(--u) * .015); font-size: calc(var(--u) * .092); line-height: 1.2; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dep__toast { position: absolute; right: calc(var(--u) * -.03); top: calc(var(--u) * -.075); display: inline-flex; align-items: center; gap: calc(var(--u) * .018); padding: calc(var(--u) * .016) calc(var(--u) * .032) calc(var(--u) * .016) calc(var(--u) * .016); font-size: calc(var(--u) * .042); line-height: 1.2; font-weight: 700; color: var(--ink); white-space: nowrap; background: #fff; border-radius: 100px; box-shadow: 0 0 0 1px rgba(16,24,40,.05), 0 calc(var(--u) * .015) calc(var(--u) * .045) rgba(16,24,40,.16); transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.dep__toast i { display: grid; place-items: center; width: calc(var(--u) * .06); height: calc(var(--u) * .06); color: #fff; background: var(--up); border-radius: 50%; }
.dep__toast svg { width: 60%; height: 60%; }
.dep__list { margin: 0; padding: calc(var(--u) * .015); list-style: none; }
.dep__list li { position: relative; display: flex; align-items: center; gap: calc(var(--u) * .035); padding: calc(var(--u) * .03) calc(var(--u) * .035); border-radius: calc(var(--u) * .045); transition: background-color .3s; }
.dep__list .dep__cap { display: block; padding: calc(var(--u) * .025) calc(var(--u) * .035) calc(var(--u) * .01); font-size: calc(var(--u) * .038); line-height: 1.3; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.dep__list li:not(.dep__cap) + li::before { content: ""; position: absolute; top: 0; left: calc(var(--u) * .035); right: calc(var(--u) * .035); height: 1px; background: var(--line); }
.dep__ico { display: grid; place-items: center; flex: none; width: calc(var(--u) * .12); height: calc(var(--u) * .12); border-radius: calc(var(--u) * .035); }
.dep__ico svg { width: 50%; height: 50%; }
.dep__txt { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.dep__txt b { font-size: calc(var(--u) * .05); line-height: 1.3; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dep__txt small { font-size: calc(var(--u) * .042); line-height: 1.3; color: var(--muted); white-space: nowrap; }
.dep__chev { display: grid; flex: none; color: var(--t3); transition: transform .3s; }
.dep__chev svg { width: calc(var(--u) * .06); height: calc(var(--u) * .06); }
.tile--deposit:hover .dep__toast { transform: translateY(calc(var(--u) * -.025)); }
.tile--deposit:hover .dep__list .dep__cap + li { background: #f5f7fa; }
.tile--deposit:hover .dep__list .dep__cap + li .dep__chev { transform: translateX(calc(var(--u) * .012)); }
@media (prefers-reduced-motion: reduce) { .dep__toast, .dep__list li, .dep__chev { transition: none; } }
.tile__art--docs { position: relative; }
.doc { position: absolute; left: 50%; top: 50%; width: 120px; height: 150px; background: #fff; border-radius: var(--r-ctl); box-shadow: 0 12px 30px rgba(0,0,0,.08); }
.doc--b { transform: translate(-50%, -50%) translateX(-36px) rotate(-10deg); }
.doc--m { transform: translate(-50%, -50%) translateX(36px) rotate(9deg); }
.doc--b, .doc--m { display: flex; flex-direction: column; gap: 8px; padding: 18px 14px; background: linear-gradient(180deg, #fbfcfe, #f3f5f9); }
.doc--b i, .doc--m i { height: 6px; border-radius: 3px; background: #e3e7ee; }
.doc--b i:first-child, .doc--m i:first-child { width: 45%; height: 8px; margin-bottom: 4px; background: #d3d9e4; }
.doc--b i:nth-child(3), .doc--m i:nth-child(3) { width: 70%; }
.doc--f { transform: translate(-50%, -50%); display: flex; flex-direction: column; gap: 10px; padding: 24px 16px; overflow: hidden; }
.doc--f::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 35%, rgba(255,255,255,.85) 50%, transparent 65%); transform: translateX(-120%); animation: doc-sheen 5s ease-in-out infinite; pointer-events: none; }
@keyframes doc-sheen { 0%, 55% { transform: translateX(-120%); } 85%, 100% { transform: translateX(120%); } }
@media (prefers-reduced-motion: reduce) { .doc--f::after { display: none; animation: none; } }
.doc--f i { height: 6px; border-radius: 3px; background: #e7eaf0; }
.doc--f i + i { width: 65%; }
.doc__head { display: flex; align-items: center; gap: 6px; padding-bottom: 8px; border-bottom: 1px dashed #e1e5ec; }
.doc__pair { align-self: flex-start; padding: 3px 7px; font-size: 10px; line-height: 13px; font-weight: 700; color: var(--accent); background: var(--accent-soft); border-radius: 6px; white-space: nowrap; }
.trade__tabs { display: grid; grid-template-columns: 1fr 1fr; padding: 4px; background: var(--board); border-radius: var(--r-ctl); }
.trade__tab { padding: 10px 0; border: 0; border-radius: var(--r-sm); font: inherit; font-size: 15px; font-weight: 600; color: var(--muted); background: transparent; cursor: pointer; transition: background-color var(--ease), color var(--ease); }
.trade__tab[aria-selected="true"] { color: #fff; background: var(--up); box-shadow: 0 1px 2px rgba(16,24,40,.08), 0 6px 14px -6px rgba(32,178,108,.7); }
.trade__tab[data-trade-tab="sell"][aria-selected="true"], .trade__tab[data-cv-tab="sell"][aria-selected="true"] { color: #fff; background: var(--down); box-shadow: 0 1px 2px rgba(16,24,40,.08), 0 6px 14px -6px rgba(239,69,74,.7); }
.trade__tab:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.trade__field { margin-top: 12px; padding: 14px 16px; background: var(--board); border-radius: var(--r-panel); }
.trade__field small { display: block; font-size: 13px; line-height: 18px; color: var(--muted); }
.trade__field strong { display: block; margin-top: 4px; font-size: 22px; line-height: 30px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.trade__btn { display: block; margin-top: 16px; padding: 14px; text-align: center; font-weight: 600; color: #fff; border-radius: 100px; transition: background-color var(--ease); background: var(--up); }
[data-trade-mode="sell"] .trade__btn { background: var(--down); }

/* Platform cards: left-aligned anatomy, white and dark cards alternate */
.hrow > .tile { align-items: stretch; text-align: left; border: 1px solid transparent; background: var(--card-bg); border-radius: var(--r-card); box-shadow: var(--sh-card); transition: transform var(--ease), box-shadow var(--ease); }
.hrow > .tile:hover { transform: translateY(-4px); box-shadow: var(--sh-lift); }
.hrow > .tile--link, .hrow > .tile--dark { padding: 20px; }
.tile__head { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.hrow .lbl { gap: 0; font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
/* Illustrations sit on a soft dotted stage inside the card. */
.hrow .tile__art { position: relative; flex: 1 1 auto; min-height: 0; width: auto; margin: 16px 0 0; overflow: hidden; border-radius: var(--r-panel); box-shadow: inset 0 0 0 1px rgba(16,24,40,.04); background: radial-gradient(60% 50% at 50% 50%, var(--glow), transparent 75%), linear-gradient(160deg, var(--stage-a) 0%, var(--stage-b) 100%); transition: --glow .5s; }
.hrow .tile__num { position: static; flex: none; padding: 2px 7px; font-size: 12px; line-height: 16px; letter-spacing: .04em; color: var(--muted); background: rgba(16,24,40,.05); border-radius: 100px; }
.hrow > .tile--dark { color: #fff; background: var(--dark-tile); border-color: rgba(255,255,255,.08); box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }
.hrow > .tile--dark:hover { box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 28px 44px -18px rgba(0,0,0,.55); }
.tile--dark .lbl { color: rgba(255,255,255,.6); }
.hrow .tile--dark .tile__num { color: rgba(255,255,255,.6); background: rgba(255,255,255,.08); }
.hrow > .tile--swap, .hrow > .tile--payout { isolation: isolate; }
.hrow .doc { width: 140px; height: 176px; box-shadow: 0 1px 0 rgba(16,24,40,.04), 0 18px 36px -12px rgba(16,24,40,.18); transition: transform .45s cubic-bezier(.2,.8,.2,1); }
.hrow .doc--f { gap: 8px; padding: 14px 14px 12px; box-shadow: 0 0 0 1px rgba(16,24,40,.05), 0 24px 44px -14px rgba(16,24,40,.26); }
.doc__title { min-width: 0; font-size: 11px; line-height: 14px; font-weight: 700; color: var(--ink); }
.doc__stamp { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; margin-top: auto; padding: 4px 8px; font-size: 10px; line-height: 14px; font-weight: 700; color: var(--up); background: rgba(32,178,108,.1); border-radius: 100px; }
.hrow > .tile--trade-widget { align-items: stretch; padding: 20px 14px 14px; text-align: left; }
.tile--trade-widget .tile__head { padding-left: 6px; }
.tile--trade-widget .trade__field { padding: 10px 14px; }
.tile--trade-widget .trade__rows { margin-bottom: 12px; }
.tile--trade-widget .trade__field strong { font-size: 20px; line-height: 28px; }
.tile--trade-widget .trade__btn { padding: 12px; margin-top: auto; }
.trade__swap { position: relative; z-index: 1; display: grid; place-items: center; width: 36px; height: 36px; margin: -14px auto; color: #000; background: #fff; border-radius: 50%; box-shadow: 0 0 0 4px #fff, 0 0 0 5px var(--line); }
.trade__swap + .trade__field { margin-top: 0; }
.tile--trade-widget .trade__swap { margin-right: 14px; margin-left: auto; }
.doc__stamp svg { flex: none; width: 12px; height: 12px; }
.trade__rows { display: grid; gap: 6px; margin-top: 12px; padding: 12px 4px 0; border-top: 1px solid var(--line); }
.trade__row { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 13px; line-height: 18px; color: var(--muted); }
.trade__row b { font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
.trade__asset { position: relative; margin-bottom: 8px; }
.trade__asset-btn { display: flex; align-items: center; gap: 10px; width: 100%; padding: 6px 12px 6px 6px; font: inherit; color: var(--ink); text-align: left; background: #fff; border: 1px solid var(--line); border-radius: var(--r-ctl); box-shadow: 0 1px 2px rgba(16,24,40,.05); cursor: pointer; transition: border-color var(--ease), box-shadow var(--ease); }
.trade__asset-btn:hover { border-color: var(--line-strong); }
.trade__asset-btn[aria-expanded="true"] { border-color: var(--ink); box-shadow: var(--ring); }
.trade__asset-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.trade__asset img { flex: none; width: 28px; height: 28px; border-radius: 50%; background: #fff; }
.trade__asset b { font-size: 15px; line-height: 20px; font-weight: 700; }
.trade__asset span { flex: 1; min-width: 0; font-size: 14px; line-height: 20px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.trade__asset-chev { flex: none; color: var(--muted); transition: transform var(--ease); }
.trade__asset-btn[aria-expanded="true"] .trade__asset-chev { transform: rotate(180deg); }
.trade__asset-list { position: absolute; z-index: 5; top: calc(100% + 6px); left: 0; right: 0; display: grid; gap: 2px; margin: 0; padding: 4px; list-style: none; background: #fff; border: 1px solid var(--line); border-radius: var(--r-ctl); box-shadow: var(--sh-pop); }
.trade__asset-list[hidden] { display: none; }
.trade__asset-opt { display: flex; align-items: center; gap: 10px; padding: 6px; border-radius: var(--r-sm); cursor: pointer; outline: none; transition: background-color var(--ease); }
.trade__asset-opt:hover, .trade__asset-opt:focus-visible { background: #eef1f5; }
.trade__asset-opt:focus-visible { box-shadow: inset 0 0 0 2px var(--accent); }
.trade__asset-opt svg { flex: none; color: var(--accent); visibility: hidden; }
.trade__asset-opt[aria-selected="true"] svg { visibility: visible; }
.trade__asset-opt[hidden] { display: none; }
.trade__asset-pop { position: absolute; z-index: 5; top: calc(100% + 6px); left: 0; right: 0; padding: 4px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-ctl); box-shadow: var(--sh-pop); }
.trade__asset-pop[hidden] { display: none; }
.trade__asset-pop .trade__asset-list { position: static; max-height: 296px; padding: 4px 0 0; overflow-y: auto; overscroll-behavior: contain; background: none; border: 0; border-radius: 0; box-shadow: none; }
.trade__asset-search { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px; color: var(--muted); background: var(--board); border: 1px solid transparent; border-radius: var(--r-sm); transition: border-color var(--ease), box-shadow var(--ease); }
.trade__asset-search:focus-within { border-color: var(--line-strong); box-shadow: var(--ring); }
.trade__asset-search svg { flex: none; }
.trade__asset-search input { flex: 1; min-width: 0; height: 100%; padding: 0; font: inherit; font-size: 14px; color: var(--ink); background: none; border: 0; outline: none; }
.trade__asset-search input::placeholder { color: var(--t3); }
.trade__asset-empty { padding: 16px 8px 12px; font-size: 13px; line-height: 18px; text-align: center; color: var(--muted); }
/* Card polish: gradient hairline, tinted stages, micro-motion */
@property --glow { syntax: "<color>"; inherits: true; initial-value: transparent; }
.hrow .tile__art::before { content: ""; position: absolute; inset: 0; background: linear-gradient(rgba(16,24,40,.05) 1px, transparent 1px) 50% 50% / 24px 24px, linear-gradient(90deg, rgba(16,24,40,.05) 1px, transparent 1px) 50% 50% / 24px 24px; -webkit-mask: radial-gradient(ellipse closest-side, #000 10%, transparent 100%); mask: radial-gradient(ellipse closest-side, #000 10%, transparent 100%); pointer-events: none; }
.tile--deposit { --glow: rgba(255,255,255,.9); --stage-a: #f5f6f8; --stage-b: #eceef1; }
.tile--docs { --glow: rgba(255,255,255,.9); --stage-a: #f5f6f8; --stage-b: #eceef1; }
.hrow .tile--docs .tile__art::before { background: linear-gradient(rgba(16,24,40,.07) 1px, transparent 1px) 0 50% / 100% 18px; }
.tile--docs:hover .doc--b { transform: translate(-50%, -50%) translateX(-52px) rotate(-15deg); }
.tile--docs:hover .doc--m { transform: translate(-50%, -50%) translateX(52px) rotate(14deg); }
.tile--docs:hover .doc--f { transform: translate(-50%, -56%); }
@media (prefers-reduced-motion: reduce) {
  .hrow .doc, .trade__asset-chev { transition: none; }
}

/* Platform: header extras, deal ticket (03) and payout status (05) */
.tile__go { display: grid; place-items: center; flex: none; width: 28px; height: 28px; margin-left: auto; color: var(--ink); background: rgba(16,24,40,.05); border-radius: 50%; transition: background-color var(--ease), color var(--ease), transform var(--ease); }
.tile--link:hover .tile__go { color: #fff; background: #000; transform: translate(1px, -1px); }
.tile__status { display: inline-flex; align-items: center; gap: 6px; flex: none; margin-left: auto; padding: 3px 9px 3px 7px; font-size: 11px; line-height: 16px; font-weight: 600; color: var(--up); background: rgba(32,178,108,.14); border-radius: 100px; }
.tile__status i { position: relative; width: 6px; height: 6px; border-radius: 50%; background: var(--up); }
.tile__status i::after { content: ""; position: absolute; inset: -3px; border-radius: 50%; border: 1px solid var(--up); animation: status-ping 2.4s ease-out infinite; }
@keyframes status-ping { 0% { opacity: .8; transform: scale(.6); } 70%, 100% { opacity: 0; transform: scale(1.8); } }
.doc__pdf { margin-left: auto; padding: 1px 5px; font-size: 8px; line-height: 12px; font-weight: 800; letter-spacing: .04em; color: #fff; background: var(--down); border-radius: 4px; }

.hrow > .tile--deal, .hrow > .tile--payout { isolation: isolate; }
.tile--deal::after, .tile--payout::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.tile--deal::after { background: radial-gradient(80% 36% at 50% 58%, rgba(255,255,255,.07), transparent 72%); }
.tile--payout::after { background: radial-gradient(70% 34% at 85% 4%, rgba(255,255,255,.07), transparent 70%); }

.deal { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.deal__pair { display: flex; align-items: center; gap: 10px; }
.deal__no { white-space: nowrap; }
.deal__icons { display: flex; flex: none; }
.deal__icons i, .deal__icons img { width: 28px; height: 28px; border-radius: 50%; box-shadow: 0 0 0 2px #121317; }
.deal__icons i { display: grid; place-items: center; font-size: 14px; font-style: normal; font-weight: 800; color: #000; background: #fff; }
.deal__icons img { margin-left: -8px; background: #fff; }
[data-trade-mode="sell"] .deal__icons { flex-direction: row-reverse; }
[data-trade-mode="sell"] .deal__icons img { margin-left: 0; }
[data-trade-mode="sell"] .deal__icons i { margin-left: -8px; }
.deal__pair-txt { min-width: 0; }
.deal__pair-txt b { display: block; font-size: 15px; line-height: 20px; font-weight: 600; white-space: nowrap; }
.deal__pair-txt small { display: block; font-size: 12px; line-height: 16px; color: rgba(255,255,255,.55); }
.deal__price { margin-top: 14px; }
.deal__price small { display: block; font-size: 12px; line-height: 16px; color: rgba(255,255,255,.55); }
.deal__price strong { display: block; margin-top: 2px; font-size: 24px; line-height: 30px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.deal__chart { position: relative; flex: 1 1 auto; min-height: 40px; margin: 8px -20px 0; }
.deal__chart svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.deal__grid { fill: none; stroke: rgba(255,255,255,.06); stroke-width: 1; vector-effect: non-scaling-stroke; }
.deal__level { fill: none; stroke: rgba(255,255,255,.3); stroke-width: 1; stroke-dasharray: 3 4; vector-effect: non-scaling-stroke; }
.deal__line { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.deal__dot { position: absolute; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; background: var(--up); box-shadow: 0 0 0 3px #0c0d10, 0 0 0 6px rgba(32,178,108,.3), 0 0 18px rgba(32,178,108,.8); }
.deal__rows { display: grid; gap: 6px; margin: 8px 0 0; padding: 12px 14px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: var(--r-panel); }
.deal__rows div { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; font-size: 13px; line-height: 18px; }
.deal__rows dt { color: rgba(255,255,255,.55); }
.deal__rows dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.deal__rows dd.is-up { color: var(--up); }
.wd__rows { gap: 8px; margin: 0; padding: 2px 2px 0; background: none; border: 0; }

.wd { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
.wd__sum small { display: block; font-size: 12px; line-height: 16px; color: rgba(255,255,255,.55); }
.wd__sum strong { display: block; margin-top: 4px; font-size: 26px; line-height: 32px; font-weight: 700; letter-spacing: -.02em; color: var(--up); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wd__dest { display: flex; align-items: center; gap: 10px; margin: 16px 0 12px; padding: 10px 12px; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: var(--r-panel); }
.wd__icon { display: grid; flex: none; width: 32px; height: 32px; border-radius: var(--r-tile-sm); }
.wd__icon svg { width: 16px; height: 16px; }
.wd__ico { grid-area: 1 / 1; display: grid; place-items: center; transition: opacity .3s, transform .3s; }
.wd__ico--bank, [data-trade-mode="sell"] .wd__ico--wallet { opacity: 0; transform: scale(.7); }
[data-trade-mode="sell"] .wd__ico--bank { opacity: 1; transform: none; }
.wd__dest-txt { flex: 1; min-width: 0; }
.wd__dest-txt small { display: block; font-size: 11px; line-height: 14px; color: rgba(255,255,255,.55); }
.wd__dest-txt b { display: block; font-size: 14px; line-height: 20px; font-weight: 600; letter-spacing: .02em; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wd__code { flex: none; padding: 3px 8px; font-size: 11px; line-height: 16px; font-weight: 700; background: rgba(255,255,255,.1); border-radius: 6px; }
.wd__steps { position: relative; display: flex; flex-direction: column; gap: 12px; margin: auto 0 0; padding: 14px; list-style: none; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: var(--r-panel); }
.wd__steps::before { content: ""; position: absolute; left: 23.5px; top: 24px; bottom: 40px; width: 1px; background: linear-gradient(180deg, rgba(32,178,108,.25), rgba(32,178,108,.7)); }
.wd__steps li { position: relative; display: flex; align-items: flex-start; gap: 12px; font-size: 13px; line-height: 18px; color: rgba(255,255,255,.72); }
.wd__steps li b { display: block; font-weight: 500; }
.wd__steps li small { display: block; margin-top: 2px; font-size: 12px; line-height: 16px; color: rgba(255,255,255,.45); white-space: nowrap; }
.wd__steps i { position: relative; z-index: 1; display: grid; place-items: center; flex: none; width: 20px; height: 20px; color: var(--up); background: #183027; border-radius: 50%; }
.wd__steps .is-last { color: #fff; }
.wd__steps .is-last b { font-weight: 600; }
.wd__steps .is-last i { color: #fff; background: var(--up); box-shadow: 0 0 0 4px #18332a; }
@media (prefers-reduced-motion: reduce) { .tile__status i::after { animation: none; display: none; } .wd__ico, .tile__go { transition: none; } }

/* Split (Bybit card section: 786px) */
.split { padding: var(--sec-y) 0; background: #fff; }
.split__wrap { display: flex; align-items: center; justify-content: space-between; gap: 56px; max-width: var(--container); margin: 0 auto; }
.split__copy { flex: 0 1 506px; min-width: 0; }
.split__copy .h2 { margin-top: 0; }
.split__facts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 32px 0 40px; padding: 8px; background: var(--tint-bg); border: 1px solid var(--tint-line); border-radius: var(--r-card); }
.split__facts > div { display: flex; flex-direction: column; padding: 18px 20px; background: #fff; border-radius: var(--r-panel); box-shadow: 0 1px 2px rgba(16,24,40,.04); }
.split__fact-ico { display: grid; place-items: center; flex: none; width: 40px; height: 40px; margin-bottom: 16px; border-radius: var(--r-ctl); }
.split__facts .split__fact-wide .split__fact-ico { margin: 0 2px 0 0; align-self: center; }
.split__facts .split__fact-wide { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 12px; }
.split__facts strong { font-size: 32px; line-height: 40px; font-weight: 700; letter-spacing: -0.02em; color: #000; white-space: nowrap; }
.split__facts .split__fact-text { font-size: 20px; line-height: 28px; }
.split__facts span { margin-top: 4px; font-size: 14px; line-height: 20px; color: var(--muted); }
.split__facts .split__fact-wide span { margin: 0 0 0 auto; text-align: right; }
.split__art { position: relative; flex: 0 0 560px; height: 560px; }
/* Corporate flow: settlement account -> Coinfra -> executed deal, on a dark stage like the platform tiles. */
.corp { position: relative; isolation: isolate; display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; padding: 40px; overflow: hidden; background: var(--g-dark); border-radius: var(--r-card); box-shadow: var(--sh-dark); }
.corp::after { content: ""; position: absolute; z-index: -1; right: -25%; bottom: -35%; width: 80%; height: 80%; background: radial-gradient(closest-side, rgba(255,255,255,.08), transparent); pointer-events: none; }
.corp::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px) 50% 50% / 28px 28px, linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px) 50% 50% / 28px 28px; -webkit-mask: radial-gradient(ellipse closest-side, #000 20%, transparent 100%); mask: radial-gradient(ellipse closest-side, #000 20%, transparent 100%); }
.corp__icon { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: var(--r-ctl); }
.corp__text { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.corp__text small { font-size: 13px; line-height: 18px; color: var(--muted); }
.corp__text b { font-size: 16px; line-height: 22px; font-weight: 600; letter-spacing: .02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.corp__tag { flex: none; padding: 4px 10px; font-size: 12px; line-height: 16px; font-weight: 700; color: #fff; background: var(--accent); border-radius: 100px; }
/* Two arcs between the RUB account and the client's wallet: buying runs down the left (white), selling back up the right (green). */
.cycle { position: relative; width: 100%; max-width: 400px; aspect-ratio: 400 / 440; --cyc: 6s; }
.cycle__track { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.cycle__arc { fill: none; stroke: rgba(255,255,255,.35); stroke-width: 1.5; stroke-dasharray: 3 5; stroke-linejoin: miter; }
.cycle__arc--sell { stroke: rgba(32,178,108,.6); }
.cycle__lit { fill: none; stroke: rgba(255,255,255,.9); stroke-width: 2; stroke-linejoin: miter; stroke-dasharray: 100 100; stroke-dashoffset: 100; opacity: 0; animation: cyc-lit-buy var(--cyc) cubic-bezier(.45,0,.55,1) infinite; }
.cycle__lit--sell { stroke: var(--up); animation-name: cyc-lit-sell; }
.cycle__pulse { fill: none; stroke: #fff; stroke-width: 9; stroke-linecap: round; stroke-dasharray: .1 100; stroke-dashoffset: 100.1; opacity: 0; filter: drop-shadow(0 0 6px rgba(255,255,255,.8)); animation: cyc-pulse-buy var(--cyc) cubic-bezier(.45,0,.55,1) infinite; }
.cycle__pulse--sell { stroke: var(--up); filter: drop-shadow(0 0 6px rgba(32,178,108,.9)); animation-name: cyc-pulse-sell; }
@keyframes cyc-pulse-buy { 0% { stroke-dashoffset: 100.1; opacity: 0; } 3%, 37% { opacity: 1; } 40%, 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes cyc-pulse-sell { 0%, 50% { stroke-dashoffset: 100.1; opacity: 0; } 53%, 87% { opacity: 1; } 90%, 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes cyc-lit-buy { 0% { stroke-dashoffset: 100; opacity: 1; } 40% { stroke-dashoffset: 0; opacity: 1; } 50%, 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes cyc-lit-sell { 0%, 49.9% { stroke-dashoffset: 100; opacity: 0; } 50% { stroke-dashoffset: 100; opacity: 1; } 90% { stroke-dashoffset: 0; opacity: 1; } 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes cyc-tag-buy { 0%, 40% { background-color: #2c2d33; border-color: rgba(255,255,255,.6); box-shadow: 0 0 0 4px rgba(255,255,255,.08); } 50%, 100% { background-color: #1c1d22; border-color: rgba(255,255,255,.14); box-shadow: 0 0 0 0 rgba(255,255,255,0); } }
@keyframes cyc-tag-sell { 0%, 40%, 100% { background-color: #1c1d22; border-color: rgba(255,255,255,.14); box-shadow: 0 0 0 0 rgba(32,178,108,0); } 50%, 90% { background-color: #142a1f; border-color: rgba(32,178,108,.75); box-shadow: 0 0 0 4px rgba(32,178,108,.14); } }
@keyframes cyc-evt { 0%, 3% { opacity: 0; transform: translate(-50%, calc(-50% + 6px)); } 8%, 26% { opacity: 1; transform: translate(-50%, -50%); } 32%, 100% { opacity: 0; transform: translate(-50%, -50%); } }
@keyframes cyc-evt-credit { 0%, 85% { opacity: 0; transform: translate(-50%, calc(-50% + 6px)); } 89%, 96% { opacity: 1; transform: translate(-50%, -50%); } 100% { opacity: 0; transform: translate(-50%, -50%); } }
.cycle__evt { position: absolute; top: 27%; z-index: 2; display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; font-size: 13px; line-height: 18px; font-weight: 600; color: #fff; white-space: nowrap; background: rgba(28,29,34,.94); border: 1px solid rgba(255,255,255,.2); border-radius: 100px; box-shadow: 0 8px 20px rgba(0,0,0,.4); opacity: 0; transform: translate(-50%, -50%); pointer-events: none; animation: cyc-evt var(--cyc) ease infinite; }
.cycle__evt i { display: grid; place-items: center; width: 18px; height: 18px; margin-left: -6px; color: var(--ink); background: #fff; border-radius: 50%; }
.cycle__evt--debit { left: 18%; }
.cycle__evt--wallet { left: 50%; top: 78%; animation-delay: calc(var(--cyc) * .4); }
.cycle__evt--credit { left: 82%; background: rgba(18,44,31,.96); border-color: rgba(32,178,108,.65); animation-name: cyc-evt-credit; }
.cycle__evt--credit i { color: #fff; background: var(--up); }
.cycle__evt--debit i { color: #fff; background: rgba(255,255,255,.16); }
.cycle__acct, .cycle__tag, .cycle__hub, .cycle__wallet { position: absolute; transform: translate(-50%, -50%); }
.cycle__tag { top: 50%; display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 6px; font-size: 14px; line-height: 20px; font-weight: 600; color: #fff; white-space: nowrap; background: rgba(28,29,34,.92); border: 1px solid rgba(255,255,255,.14); border-radius: 100px; box-shadow: 0 10px 24px rgba(0,0,0,.35); }
.cycle__tag i { display: grid; place-items: center; flex: none; width: 28px; height: 28px; color: var(--ink); background: #fff; border-radius: 50%; }
.cycle__tag-txt { display: flex; flex-direction: column; line-height: 18px; }
.cycle__tag-txt small { font-size: 11px; line-height: 14px; font-weight: 500; color: rgba(255,255,255,.55); }
.cycle__tag--buy { left: 17%; animation: cyc-tag-buy var(--cyc) ease infinite; }
.cycle__tag--sell { left: 83%; animation: cyc-tag-sell var(--cyc) ease infinite; }
.cycle__acct { left: 50%; top: 10%; display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 16px; color: var(--ink); background: linear-gradient(180deg, #fff 0%, #f4f6f8 100%); border-radius: var(--r-panel); box-shadow: 0 1px 0 rgba(255,255,255,.6) inset, 0 16px 36px rgba(0,0,0,.4); }
.cycle__hub { left: 50%; top: 50%; display: grid; place-items: center; width: 64px; height: 64px; background: #fff; border-radius: 50%; box-shadow: 0 0 0 10px rgba(255,255,255,.04), 0 0 48px rgba(32,178,108,.28); }
.cycle__hub::before, .cycle__hub::after { content: ""; position: absolute; inset: -10px; border-radius: 50%; }
.cycle__hub::before { background: conic-gradient(from 0deg, transparent 0 62%, rgba(32,178,108,.95) 100%); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px)); mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px)); animation: cyc-spin 2.4s linear infinite; }
.cycle__hub::after { inset: -22px; border: 1px solid rgba(255,255,255,.06); }
@keyframes cyc-spin { to { transform: rotate(1turn); } }
.cycle__hub img { width: 34px; height: 34px; }
.cycle__wallet { left: 50%; top: 89%; display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 8px; color: var(--ink); white-space: nowrap; background: linear-gradient(180deg, #fff 0%, #f4f6f8 100%); border-radius: var(--r-panel); box-shadow: 0 16px 36px rgba(0,0,0,.4); }
.cycle__wallet i { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: var(--r-tile-sm); }
.cycle__wallet i svg { width: 16px; height: 16px; }
.cycle__wallet-txt { display: flex; flex-direction: column; gap: 2px; }
.cycle__wallet-txt b { font-size: 14px; line-height: 18px; font-weight: 600; }
.cycle__wallet-txt small { font-size: 12px; line-height: 14px; color: var(--muted); }
@media (prefers-reduced-motion: reduce) { .cycle__pulse, .cycle__lit, .cycle__evt { animation: none; display: none; } .cycle__tag, .cycle__hub::before { animation: none; } }

/* Earn cards (Bybit: 384×478, #F4F6F8, border rgba(0,0,0,.06)) */

/* Assets: cards row */
.assets { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "head cta" "grid grid"; align-items: end; column-gap: 24px; padding: var(--sec-y) max(24px, calc((100% - var(--container)) / 2)); background: var(--section-alt); }
.assets__head { grid-area: head; min-width: 0; }
.assets .sec-sub { margin-top: 8px; }
.assets__cta { grid-area: cta; justify-self: end; }
.assets .btn svg { flex: none; transition: transform var(--ease); }
.assets .btn:hover svg { transform: translateX(3px); }
.assets__cta[aria-expanded="true"] svg, .assets__cta[aria-expanded="true"]:hover svg { transform: rotate(-90deg); }
@media (prefers-reduced-motion: reduce) { .assets .btn svg, .board__all svg, .acard { transition: none; } }

.acards { grid-area: grid; display: grid; grid-template-columns: minmax(0, 1.3fr) repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: var(--head-gap); }
.acards > li { min-width: 0; }
.acards__lead { grid-row: span 2; }
.acard { display: flex; flex-direction: column; height: 100%; padding: 20px; color: var(--ink); border: 1px solid transparent; background: var(--card-bg); border-radius: var(--r-card); box-shadow: var(--sh-card); transition: box-shadow var(--ease), transform var(--ease); }
.acard:hover { transform: translateY(-2px); box-shadow: var(--sh-lift); }
.acard__head { display: flex; align-items: center; gap: 10px; }
.acard__head img { flex: none; width: 36px; height: 36px; border-radius: 50%; }
.acard__name { flex: 1; min-width: 0; }
.acard__name b { display: block; overflow: hidden; font-size: 15px; line-height: 20px; font-weight: 600; color: #000; text-overflow: ellipsis; white-space: nowrap; }
.acard__name small { display: block; font-size: 12px; line-height: 16px; color: var(--muted); }
.acard__chg { flex: none; padding: 2px 8px; font-size: 12px; line-height: 18px; font-weight: 600; background: var(--board); border-radius: var(--r-chg); }
.acard__chg.is-up { background: rgba(32,178,108,.1); }
.acard__chg.is-down { background: rgba(239,69,74,.1); }
.acard__price { display: block; margin-top: 16px; font-size: 22px; line-height: 28px; font-weight: 700; letter-spacing: -.02em; color: #000; font-variant-numeric: tabular-nums; white-space: nowrap; }
.acard__chart { position: relative; display: block; height: 56px; margin: 12px -20px 0; margin-bottom: 16px; }
.acard__spark { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.acard__vol { display: flex; justify-content: space-between; gap: 8px; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--line); font-size: 13px; line-height: 18px; color: var(--muted); }
.acard__vol b { font-weight: 600; color: #000; font-variant-numeric: tabular-nums; white-space: nowrap; }

.acard--lead { padding: 28px; color: #fff; box-shadow: var(--sh-dark); background: var(--g-dark) padding-box, linear-gradient(180deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,.04) 100%) border-box; }
.acard--lead:hover { box-shadow: 0 20px 40px -16px rgba(0,0,0,.45); }
.acard--lead .acard__head { gap: 12px; }
.acard--lead .acard__head img { width: 48px; height: 48px; }
.acard--lead .acard__name b { font-size: 18px; line-height: 24px; color: #fff; }
.acard--lead .acard__name small { font-size: 13px; line-height: 18px; color: rgba(255,255,255,.55); }
.acard--lead .acard__chg { padding: 4px 10px; font-size: 13px; background: rgba(255,255,255,.08); }
.acard--lead .acard__chg.is-up { background: rgba(32,178,108,.16); }
.acard--lead .acard__chg.is-down { background: rgba(239,69,74,.16); }
.acard--lead .acard__price { margin-top: 28px; font-size: 40px; line-height: 48px; color: #fff; }
.acard--lead .acard__chart { flex: 1 1 auto; min-height: 160px; height: auto; margin: 20px -28px 0; background: repeating-linear-gradient(180deg, transparent 0 39px, rgba(255,255,255,.06) 39px 40px); }
.acard--lead .acard__chart + .acard__vol { margin-top: 20px; }
.acard--lead .acard__vol { padding-top: 16px; border-top-color: rgba(255,255,255,.1); color: rgba(255,255,255,.55); }
.acard--lead .acard__vol b { color: #fff; }

@media (min-width: 1081px) and (max-width: 1260px) {
  .board__tab { padding: 6px 10px; font-size: 14px; }
  .acard--lead .acard__price { font-size: 34px; line-height: 42px; }
}
@media (max-width: 1080px) {
  .acards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .acards__lead { grid-column: 1 / -1; grid-row: auto; }
  .acard--lead .acard__chart { min-height: 140px; }
}
@media (max-width: 767px) {
  .assets { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "grid" "cta"; padding: var(--sec-y) 20px; }
  .assets__cta { justify-self: stretch; margin-top: 20px; }
  .acards { grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 24px; }
  .acards__lead { margin-bottom: 12px; }
  .acard--lead { padding: 20px; }
  .acard--lead .acard__head img { width: 40px; height: 40px; }
  .acard--lead .acard__name b { font-size: 16px; line-height: 22px; }
  .acard--lead .acard__price { margin-top: 20px; font-size: 30px; line-height: 36px; }
  .acard--lead .acard__chart { min-height: 120px; margin: 16px -20px 0; }
  .acards > li:not(.acards__lead) .acard { display: grid; grid-template-columns: 36px minmax(0, 1fr) 56px auto; grid-template-areas: "img name chart price" "img name chart chg"; column-gap: 10px; row-gap: 2px; align-items: center; padding: 14px 16px; background: #fff; border: 1px solid var(--line); border-top: 0; border-radius: 0; box-shadow: none; }
  .acards > li:nth-child(2) .acard { border-top: 1px solid var(--line); border-radius: var(--r-card) var(--r-card) 0 0; }
  .acards > li.acards__last .acard { border-radius: 0 0 var(--r-card) var(--r-card); }
  .acards > li:not(.acards__lead) .acard:hover { transform: none; box-shadow: none; }
  .acards > li:not(.acards__lead) .acard__head { display: contents; }
  .acards > li:not(.acards__lead) .acard__head img { grid-area: img; }
  .acards > li:not(.acards__lead) .acard__name { grid-area: name; }
  .acards > li:not(.acards__lead) .acard__chg { grid-area: chg; justify-self: end; padding: 0 6px; font-size: 11px; line-height: 16px; border-radius: var(--r-chg); }
  .acards > li:not(.acards__lead) .acard__price { grid-area: price; justify-self: end; margin: 0; font-size: 15px; line-height: 20px; font-weight: 600; }
  .acards > li:not(.acards__lead) .acard__chart { grid-area: chart; height: 24px; margin: 0; }
  .acards > li:not(.acards__lead) .acard__vol { display: none; }
}
@media (max-width: 379px) {
  .acards > li:not(.acards__lead) .acard { grid-template-columns: 32px minmax(0, 1fr) auto; grid-template-areas: "img name price" "img name chg"; }
  .acards > li:not(.acards__lead) .acard__head img { width: 32px; height: 32px; }
  .acards > li:not(.acards__lead) .acard__chart { display: none; }
}

/* App (Bybit: 784px, padding 96 120) */
.app { height: 784px; padding: var(--sec-y) 0; background: #fff; overflow: hidden; }
.app__wrap { display: flex; align-items: center; justify-content: space-between; height: 100%; max-width: var(--container); margin: 0 auto; }
.app__left { width: 589px; }
.app__get { width: fit-content; max-width: 100%; margin-top: 40px; background: var(--tint-bg); border: 1px solid var(--tint-line); border-radius: var(--r-card); overflow: hidden; }
.app__mobile { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; padding: 24px; }
.app__head { display: flex; align-items: center; gap: 14px; min-width: 0; }
.app__icon { display: grid; place-items: center; flex: none; width: 52px; height: 52px; border-radius: 14px; background: var(--g-ink); box-shadow: inset 0 1px 0 rgba(255,255,255,.16); }
.app__name strong { display: block; font-size: 16px; line-height: 22px; font-weight: 600; color: #000; }
.app__name span { display: block; margin-top: 2px; font-size: 13px; line-height: 18px; color: var(--muted); }
.app__stores { display: flex; gap: 12px; }
.app__badge { display: block; border-radius: 8px; transition: transform var(--ease); }
.app__badge img { display: block; width: auto; height: 40px; }
.app__badge:hover { transform: translateY(-2px); }
.app__badge:focus-visible { outline: 2px solid #000; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .app__badge { transition: none; } }

.app__art { position: relative; width: 600px; height: 592px; }
.app__stage { position: absolute; left: 50%; top: 50%; width: 560px; height: 592px; margin: -296px 0 0 -280px; }
.app__halo { position: absolute; left: 50%; top: 50%; width: 600px; height: 600px; margin: -300px 0 0 -300px; border-radius: 50%; background: radial-gradient(circle, var(--board) 0 188px, transparent 189px); translate: calc(var(--px, 0) * -8px) calc(var(--py, 0) * -6px); transition: translate .6s cubic-bezier(.2,.8,.2,1); }
.app__halo::before, .app__halo::after { content: ""; position: absolute; border-radius: 50%; border: 1px solid var(--line); }
.app__halo::before { inset: 64px; }
.app__halo::after { inset: 8px; border-style: dashed; border-color: var(--line); }
.phone { position: absolute; left: 50%; top: 16px; z-index: 1; width: 280px; height: 560px; margin-left: -140px; padding: 10px; background: #0b0c0e; border-radius: 46px; box-shadow: inset 0 0 0 2px #2b2d33, 0 40px 80px -28px rgba(0,0,0,.45);
  transform: perspective(1200px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.phone::before { content: ""; position: absolute; left: 50%; top: 20px; z-index: 2; width: 84px; height: 24px; margin-left: -42px; background: #0b0c0e; border-radius: 14px; }
.phone__screen { display: flex; flex-direction: column; height: 100%; padding: 14px 14px 0; background: #fff; border-radius: 37px; overflow: hidden; color: #000; }
.phone__status { display: flex; align-items: center; justify-content: space-between; height: 24px; padding: 0 10px; font-size: 13px; }
.phone__status b { font-weight: 600; }
.phone__sys { display: flex; align-items: flex-end; gap: 2px; }
.phone__sys i { width: 3px; border-radius: 1px; background: #000; }
.phone__sys i:nth-child(1) { height: 5px; } .phone__sys i:nth-child(2) { height: 8px; } .phone__sys i:nth-child(3) { height: 11px; }
.phone__sys u { width: 20px; height: 10px; margin-left: 5px; border: 1.5px solid #000; border-radius: 3px; box-shadow: inset 0 0 0 1.5px #fff, inset 14px 0 0 #000; }
.phone__top { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding: 0 2px; }
.phone__top img { width: 22px; height: 22px; }
.phone__top span { font-size: 12px; font-weight: 700; letter-spacing: .14em; }
.phone__top i { display: grid; place-items: center; width: 32px; height: 32px; margin-left: auto; border-radius: 50%; background: var(--board); }
.phone__bal { margin-top: 12px; padding: 14px 14px 12px; border-radius: 18px; background: linear-gradient(160deg, #2a2b31 0%, #000 70%); color: #fff; }
.phone__bal small { display: block; font-size: 11px; line-height: 14px; color: rgba(255,255,255,.6); }
.phone__bal strong { display: block; margin-top: 4px; font-size: 24px; line-height: 30px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.phone__spark { display: block; width: 100%; height: 28px; margin-top: 4px; overflow: visible; }
.phone__spark-line { fill: none; stroke: #fff; stroke-width: 1.8; stroke-linecap: round; }
.phone__acts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 10px; }
.phone__acts span { display: inline-flex; align-items: center; justify-content: center; gap: 4px; height: 34px; border-radius: 10px; font-size: 12px; font-weight: 600; background: #fff; color: #000; }
.phone__acts span + span { background: rgba(255,255,255,.12); color: #fff; }
.phone__h { display: flex; align-items: baseline; justify-content: space-between; margin-top: 14px; padding: 0 2px; font-size: 14px; }
.phone__h span { font-size: 12px; color: var(--muted); }
.phone__list { flex: 1; margin-top: 4px; }
.phone__list li { display: grid; grid-template-columns: 28px minmax(0, 1fr) 36px auto; align-items: center; gap: 8px; padding: 8px 2px; border-bottom: 1px solid var(--line); }
.phone__list li:last-child { border-bottom: 0; }
.phone__list img { width: 28px; height: 28px; border-radius: 50%; }
.phone__name b, .phone__val b { display: block; font-size: 13px; line-height: 16px; font-weight: 600; }
.phone__name small { display: block; font-size: 11px; line-height: 14px; color: var(--muted); }
.phone__val { text-align: right; }
.phone__val b { font-size: 12px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.phone__mini { width: 36px; height: 18px; overflow: visible; }
.phone__val .chg--pill { min-width: 0; margin-top: 2px; padding: 0 5px; font-size: 10px; line-height: 15px; border-radius: 4px; }
.phone__tabs { display: flex; justify-content: space-around; margin: 0 -14px; padding: 10px 0 20px; border-top: 1px solid var(--line); color: var(--t3); }
.phone__tabs i { position: relative; display: grid; place-items: center; }
.phone__tabs .is-on { color: #000; }
.phone__tabs .is-on::after { content: ""; position: absolute; left: 50%; bottom: -8px; width: 4px; height: 4px; margin-left: -2px; border-radius: 50%; background: #000; }
.app__float { translate: calc(var(--px, 0) * 14px) calc(var(--py, 0) * 10px); transition: translate .5s cubic-bezier(.2,.8,.2,1); position: absolute; z-index: 2; display: flex; align-items: center; gap: 12px; padding: 10px 16px 10px 10px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-panel); box-shadow: var(--sh-float); }
.app__float i { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: var(--r-tile-sm); }
.app__float i svg { width: 16px; height: 16px; }
.app__float b { display: block; font-size: 14px; line-height: 18px; font-weight: 600; color: #000; white-space: nowrap; }
.app__float small { display: block; font-size: 12px; line-height: 16px; color: var(--muted); white-space: nowrap; }
.app__float--deal { right: 8px; top: 60px; padding-right: 18px; background: rgba(255,255,255,.88); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
.app__float--deal i { position: relative; color: #fff; background: var(--dark); border-color: var(--dark); }
.app__float--deal i img { width: 18px; height: 18px; }
.app__float--deal small { color: var(--up-text); font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.app__float--deal i::after { content: ""; position: absolute; right: -4px; bottom: -4px; width: 16px; height: 16px; border: 2px solid #fff; border-radius: 50%; background: var(--up) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center / 9px no-repeat; }
.app__float--doc { left: -56px; bottom: 36px; }
.app__float--fee { left: -52px; top: 232px; }
.app.js-reveal .app__halo { opacity: 0; scale: .85; transition: opacity .8s ease, scale 1.1s cubic-bezier(.2,.8,.2,1), translate .6s cubic-bezier(.2,.8,.2,1); }
.app.js-reveal .phone { opacity: 0; translate: 0 48px; transition: opacity .7s ease, translate .9s cubic-bezier(.2,.8,.2,1), transform .5s cubic-bezier(.2,.8,.2,1); }
.app.js-reveal .app__float { opacity: 0; scale: .85; transition: opacity .5s ease var(--d, 0s), scale .6s cubic-bezier(.3,1.4,.5,1) var(--d, 0s), translate .5s cubic-bezier(.2,.8,.2,1); }
.app.js-reveal .app__float--deal { --d: .55s; } .app.js-reveal .app__float--doc { --d: .7s; } .app.js-reveal .app__float--fee { --d: .85s; }
.app.js-reveal .phone__list li { opacity: 0; translate: 0 10px; transition: opacity .4s ease, translate .4s ease; }
.app.js-reveal .phone__list li:nth-child(1) { transition-delay: .45s; } .app.js-reveal .phone__list li:nth-child(2) { transition-delay: .53s; } .app.js-reveal .phone__list li:nth-child(3) { transition-delay: .61s; } .app.js-reveal .phone__list li:nth-child(4) { transition-delay: .69s; }
.app.js-reveal .phone__spark-line { stroke-dasharray: 100; stroke-dashoffset: 100; transition: stroke-dashoffset 1.4s cubic-bezier(.4,0,.2,1) .5s; }
.app.js-reveal .phone__spark-area { opacity: 0; transition: opacity .8s ease 1.2s; }
.app.is-in .app__halo, .app.is-in .phone, .app.is-in .app__float, .app.is-in .phone__list li, .app.is-in .phone__spark-area { opacity: 1; }
.app.is-in .app__halo, .app.is-in .app__float { scale: 1; }
.app.is-in .phone, .app.is-in .phone__list li { translate: 0 0; }
.app.is-in .phone__spark-line { stroke-dashoffset: 0; }
.app.is-in .app__float { translate: calc(var(--px, 0) * 14px) calc(var(--py, 0) * 10px); }

/* Footer */
.ft { position: relative; color: #fff; background: var(--dark); }
.ft :focus-visible { outline-color: #fff; }
.ft__wrap { display: grid; grid-template-columns: 240px repeat(3, minmax(0, 1fr)) minmax(0, 1.5fr); gap: 32px; max-width: var(--container); margin: 0 auto; padding: 64px 0 56px; }
.ft__brand img { display: block; width: 150px; height: auto; }
.ft__h { display: block; margin: 0 0 14px; padding: 0; border: 0; background: none; text-align: left; font-size: 13px; line-height: 18px; font-weight: 600; letter-spacing: .06em; color: #fff; cursor: default; }
.ft__col a, .ft__col span { display: block; padding: 5px 0; font-size: 14px; line-height: 20px; color: rgba(255,255,255,.76); }
.ft__col span { color: rgba(255,255,255,.5); }
.ft__col a { transition: color var(--ease); }
.ft__col a:hover { color: #fff; }
.ft__bottom { max-width: var(--container); margin: 0 auto; padding: 24px 0 32px; border-top: 1px solid rgba(255,255,255,.08); font-size: 13px; line-height: 18px; color: rgba(255,255,255,.5); text-align: center; }

/* Responsive */
@media (max-width: 1260px) {
  .hero__wrap, .split__wrap, .app__wrap, .ft__wrap, .ft__bottom { padding-left: 24px; padding-right: 24px; }
  .hd__item > a { padding: 0 8px; }
  .board { width: 540px; }
  .hero__title { font-size: 46px; line-height: 52px; }
  .board__top { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .board__mini { padding: 20px 16px 8px; }
  .board__mini a { gap: 8px; }
  .app__left { width: 500px; }
  .app__art { width: 480px; }
  .app__stage { transform: scale(.86); }
  .ft__wrap { grid-template-columns: 200px repeat(3, minmax(0, 1fr)) minmax(0, 1.4fr); gap: 24px; }
  .split__wrap { gap: 40px; }
  .split__art { flex-basis: 460px; height: 520px; }
  .corp__text b { font-size: 15px; letter-spacing: .01em; }
}
/* Header nav needs ~1170px in one line */
@media (max-width: 1180px) {
  .hd__nav, .hd__login { display: none; }
  .hd__burger { display: block; }
}
@media (max-width: 1080px) {
  :root { --sec-y: 72px; }
  .hero__wrap { flex-direction: column; align-items: stretch; gap: 40px; }
  .hero__left, .board { width: auto; }
  .hero__left { flex: none; }
  .board { height: auto; }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .stats__item:nth-child(3)::before { display: none; }
  .stats__item:nth-child(n+3)::after { content: ""; position: absolute; top: 0; left: 32px; right: 32px; height: 1px; background: var(--line); }
  .app { height: auto; padding: var(--sec-y) 0; }
  .split { padding: var(--sec-y) 0; }
  .split__wrap, .app__wrap { flex-direction: column; align-items: stretch; gap: 32px; }
  .app__left { width: auto; }
  .split__copy { flex: none; }
  .app__art { width: 100%; max-width: 600px; height: 592px; margin: 0 auto; }
  .app__stage { transform: none; }
  .split__art { flex: none; width: 100%; max-width: 600px; height: auto; margin: 0 auto; }
  .corp { height: auto; }
  .ft__wrap { grid-template-columns: 1fr 1fr; }
  .ft__brand { grid-column: 1 / -1; }
}
/* Mobile (Bybit: <=767) */
@media (max-width: 767px) {
  :root { --hd-h: 52px; --r-card: 20px; --r-panel: 14px; --sec-y: 48px; --head-gap: 24px; }
  .hd { padding: 0 16px; }
  .hero { padding: 32px 0 24px; }
  .hero__wrap { gap: 24px; padding-left: 20px; padding-right: 20px; }
  .hero__left { text-align: center; }
  .hero__badge { margin-bottom: 16px; font-size: 12px; }
  .hero__title { font-size: 32px; line-height: 38px; letter-spacing: -0.03em; }
  .hero__steps { justify-content: center; gap: 6px; margin-top: 16px; }
  .hero__steps li { height: 30px; padding: 0 10px 0 8px; font-size: 13px; }
  .hero__form { flex-direction: column; height: auto; gap: 6px; margin-top: 20px; padding: 6px; border-radius: var(--r-card); }
  .hero__input { width: 100%; height: 44px; padding: 0 16px; }
  .hero__btn { width: 100%; }
  .hero__err { padding-left: 0; }
  .board { display: none; }
  .mcards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .mcards a { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 100px; height: 100%; padding: 20px 16px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-panel); transition: box-shadow var(--ease); }
  .mcards a:active { opacity: .7; }
  .mcards .sk-row { padding: 0; }
  .mcards .sk-row .sk { height: 104px; border-radius: var(--r-panel); }
  .mcards__pair { display: flex; align-items: center; gap: 4px; font-size: 14px; line-height: 22px; font-weight: 600; color: #000; }
  .mcards__pair img { width: 20px; height: 20px; border-radius: 50%; }
  .mcards__row { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; column-gap: 4px; }
  .mcards__price { font-size: 14px; line-height: 22px; font-weight: 600; color: #000; font-variant-numeric: tabular-nums; }
  .mcards .chg { font-size: 12px; line-height: 12px; font-weight: 400; }
  .mcards .chg--pill { min-width: 0; padding: 3px 6px; font-weight: 600; }
  .mcards__tag { position: absolute; top: -1px; right: -1px; padding: 0 8px; font-size: 10px; line-height: 14px; color: #fff; background: var(--gradient-tag); border-radius: 0 16px 0 8px; }
  .mcards__all { align-items: center; justify-content: center !important; gap: 4px; font-size: 14px; line-height: 22px; font-weight: 600; color: var(--accent); }

  .stats { width: calc(100% - 40px); margin-top: 24px; }
  .stats__item { padding: 18px 16px; }
  .stats__item + .stats__item::before { top: 18px; bottom: 18px; }
  .stats__item:nth-child(n+3)::after { left: 16px; right: 16px; }
  .stats__icon, .stats__coins { height: 32px; margin-bottom: 14px; }
  .stats__icon { width: 32px; border-radius: var(--r-tile-sm); }
  .stats__icon svg { width: 16px; height: 16px; }
  .stats__coins img { width: 22px; height: 22px; }
  .stats__coins img + img { margin-left: -7px; }
  .stats strong { font-size: 22px; line-height: 28px; }
  .stats__lbl { font-size: 12px; line-height: 16px; }

  .h2 { font-size: 28px; line-height: 36px; }
  .sec-sub { font-size: 14px; line-height: 22px; }
  .btn--lg, .btn--xl { height: 48px; padding: 0 24px; }

  .plat { padding: 20px 0 40px; }
  .hrow-view { display: flex; flex-direction: column; overflow: visible; }
  .plat .sec-head { display: contents; }
  .plat .h2, .plat .sec-sub { padding: 0 20px; text-align: center; }
  .plat .sec-head .btn { order: 2; width: auto; margin: 24px 20px 0; }
  .hrow { order: 1; width: auto; margin-top: 24px; gap: 12px; padding: 0 20px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 20px; scrollbar-width: none; }
  .hrow::-webkit-scrollbar { display: none; }
  .tile, .hrow > .tile { flex: 0 0 254px; height: 320px; padding: 20px 16px 0; scroll-snap-align: start; background-color: #fff; }
  .hrow > .tile { flex: 0 0 auto; height: 360px; aspect-ratio: 2 / 3; }
  .hrow > .tile--link, .hrow > .tile--dark { padding: 14px; }
  .tile__head { gap: 6px; margin-bottom: 8px; }
  .trade__asset { margin-bottom: 6px; }
  .trade__asset-btn { gap: 8px; padding: 4px 10px 4px 4px; border-radius: var(--r-tile-sm); }
  .trade__asset img { width: 22px; height: 22px; }
  .trade__asset b { font-size: 13px; line-height: 18px; }
  .trade__asset span { font-size: 12px; line-height: 18px; }
  .trade__asset-opt { gap: 8px; padding: 5px; }
  .hrow .lbl { font-size: 11px; }
  .hrow .tile__title { margin-top: 2px; font-size: 17px; line-height: 22px; }
  .hrow .tile__art { margin-top: 10px; transform: none; }
  .hrow .doc { width: 120px; height: 146px; }
  .hrow .doc--f { padding: 10px 9px 9px; gap: 6px; }
  .hrow .doc--b, .hrow .doc--m { padding: 14px 10px; gap: 6px; }
  .doc__head { gap: 5px; padding-bottom: 6px; }
  .doc__title { font-size: 9px; line-height: 12px; }
  .doc__pair { font-size: 9px; line-height: 12px; padding: 2px 6px; }
  .doc--f i { height: 5px; }
  .doc__stamp { gap: 3px; padding: 3px 5px; font-size: 9px; line-height: 12px; }
  .doc__stamp svg { width: 10px; height: 10px; }
  .hrow .tile__num { padding: 1px 6px; font-size: 11px; }
  .hrow > .tile--trade-widget { padding: 14px 12px 12px; }
  .tile--trade-widget .tile__head { padding-left: 2px; }
  .tile--trade-widget .trade__field { padding: 8px 12px; }
  .tile--trade-widget .trade__field strong { font-size: 16px; line-height: 22px; }
  .tile--trade-widget .trade__btn { padding: 10px; }
  .hrow > .tile--dark { background-color: var(--dark-tile); }
  .trade__swap { width: 30px; height: 30px; margin: -12px auto; }
  .trade__row { font-size: 11px; line-height: 15px; }
  .trade__rows { margin-top: 8px; padding-top: 8px; gap: 4px; }
  .trade__tab { padding: 8px 0; font-size: 13px; }
  .tile__go { width: 24px; height: 24px; }
  .tile__go svg { width: 14px; height: 14px; }
  .tile__status { padding: 2px 7px 2px 6px; font-size: 10px; line-height: 14px; }
  .deal__pair { gap: 8px; }
  .deal__icons i, .deal__icons img { width: 22px; height: 22px; }
  .deal__icons i { font-size: 11px; }
  .deal__icons img, [data-trade-mode="sell"] .deal__icons i { margin-left: -5px; }
  .deal__pair-txt b { font-size: 13px; line-height: 18px; }
  .deal__pair-txt small, .deal__price small, .wd__sum small { font-size: 11px; line-height: 14px; }
  .deal__price { margin-top: 10px; }
  .deal__price strong { font-size: 18px; line-height: 24px; }
  .deal__chart { margin: 6px -14px 0; }
  .deal__rows { gap: 3px; margin-top: 6px; padding: 8px 10px; border-radius: var(--r-ctl); }
  .deal__rows div { font-size: 11px; line-height: 15px; }
  .wd__rows { gap: 3px; margin: 0; padding: 0 2px; }
  .wd__sum strong { font-size: 20px; line-height: 26px; }
  .wd__dest { gap: 8px; margin: 10px 0 8px; padding: 8px 10px; border-radius: var(--r-ctl); }
  .wd__icon { width: 28px; height: 28px; border-radius: var(--r-sm); }
  .wd__ico svg { width: 16px; height: 16px; }
  .wd__dest-txt small { font-size: 10px; line-height: 13px; }
  .wd__dest-txt b { font-size: 12px; line-height: 16px; }
  .wd__code { padding: 2px 6px; font-size: 10px; line-height: 14px; }
  .wd__steps { gap: 7px; padding: 9px 10px; border-radius: var(--r-ctl); }
  .wd__steps::before { left: 17.5px; top: 17px; bottom: 29px; }
  .wd__steps li { gap: 8px; font-size: 11px; line-height: 15px; }
  .wd__steps li small { margin-top: 0; font-size: 10px; line-height: 13px; }
  .wd__steps i { width: 16px; height: 16px; }
  .wd__steps i svg { width: 10px; height: 10px; }
  .trade__field { margin-top: 8px; padding: 10px 12px; }
  .trade__field small { font-size: 12px; line-height: 16px; }
  .trade__field strong { font-size: 17px; line-height: 24px; }
  .trade__btn { margin-top: 12px; padding: 11px; font-size: 14px; }
  .tile__title { margin-top: 12px; font-size: 20px; line-height: 28px; }
  .tile__title br { display: none; }
  .tile__art { transform: scale(.7); transform-origin: center top; }

  .split, .app { padding: var(--sec-y) 0; }
  .split__wrap, .app__wrap { padding-left: 20px; padding-right: 20px; }
  .split__art { order: -1; }
  .corp { padding: 28px 16px; }
  .corp__icon { width: 34px; height: 34px; border-radius: var(--r-tile-sm); }
  .corp__text b { font-size: 13px; letter-spacing: 0; }
  .corp__tag { padding: 3px 8px; font-size: 11px; }
  .cycle__acct { gap: 10px; width: 100%; padding: 10px 12px; }
  .cycle__hub { width: 48px; height: 48px; box-shadow: 0 0 0 6px rgba(255,255,255,.06), 0 0 0 12px rgba(255,255,255,.03); }
  .cycle__hub img { width: 26px; height: 26px; }
  .cycle__tag { gap: 6px; padding: 4px 10px 4px 4px; font-size: 12px; line-height: 16px; }
  .cycle__tag i { width: 22px; height: 22px; }
  .cycle__tag-txt { line-height: 15px; }
  .cycle__tag-txt small { font-size: 10px; line-height: 12px; }
  .cycle__hub::before { inset: -8px; }
  .cycle__hub::after { inset: -16px; }
  .cycle__evt { padding: 4px 10px; font-size: 12px; line-height: 16px; }
  .cycle__evt i { width: 16px; height: 16px; margin-left: -4px; }
  .cycle__evt--debit { left: 25%; }
  .cycle__evt--credit { left: 75%; }
  .cycle__evt--wallet { top: 74%; }
  .cycle__wallet { gap: 8px; padding: 6px 12px 6px 6px; }
  .cycle__wallet i { width: 30px; height: 30px; border-radius: var(--r-tile-sm); }
  .cycle__wallet-txt { gap: 1px; }
  .cycle__wallet-txt b { font-size: 13px; line-height: 16px; }
  .cycle__wallet-txt small { font-size: 11px; line-height: 13px; }
  .split__fact-ico { width: 32px; height: 32px; margin-bottom: 12px; border-radius: var(--r-tile-sm); }
  .split__fact-ico svg { width: 16px; height: 16px; }
  .split__facts { gap: 6px; margin: 24px 0 32px; padding: 6px; }
  .split__facts > div { padding: 14px; }
  .split__facts .split__fact-wide { display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; }
  .split__facts .split__fact-wide .split__fact-ico { grid-row: span 2; margin: 0; }
  .split__facts strong, .split__facts .split__fact-text { font-size: 22px; line-height: 28px; }
  .split__facts span, .split__facts .split__fact-wide span { margin: 2px 0 0; font-size: 13px; line-height: 18px; text-align: left; }
  .split .btn { width: 100%; }



  .app__left .hero__badge { display: flex; width: fit-content; margin-left: auto; margin-right: auto; }
  .app__left .h2 { text-align: center; }
  .app__get { width: 100%; margin-top: 16px; }
  .app__mobile { align-items: stretch; gap: 16px; padding: 16px; }
  .app__stores { justify-content: space-between; gap: 8px; }
  .app__badge img { height: 32px; }
  .app__icon { width: 44px; height: 44px; border-radius: 12px; }
  .app__art { height: 470px; }
  .app__stage { width: 440px; margin-left: -220px; transform: scale(.78); }
  .app__float { display: none; }
  .app__halo { width: 520px; height: 520px; margin: -260px 0 0 -260px; background: radial-gradient(circle, var(--board) 0 160px, transparent 161px); }
  .app__halo::before { inset: 56px; }

  .ft__wrap { grid-template-columns: 1fr; gap: 0; padding: 32px 24px 8px; }
  .ft__brand { margin-bottom: 16px; }
  .ft__col { border-bottom: 1px solid rgba(255,255,255,.08); }
  .ft__col:last-child { border-bottom: 0; }
  .ft__h { display: flex; align-items: center; justify-content: space-between; width: 100%; height: 52px; margin: 0; font-size: 14px; cursor: pointer; }
  .ft__h::after { content: ""; width: 8px; height: 8px; margin-top: -4px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); transition: transform var(--ease); }
  .ft__col.is-open .ft__h::after { margin-top: 4px; transform: rotate(-135deg); }
  .ft__col > a, .ft__col > span { display: none; }
  .ft__col.is-open > a, .ft__col.is-open > span { display: block; }
  .ft__col.is-open { padding-bottom: 8px; }
  .ft__bottom { padding: 20px 24px 28px; }
}
@media (max-width: 379px) {
  .corp { padding-left: 12px; padding-right: 12px; }
  .corp__text b { font-size: 12px; }
  .cycle__tag-txt small { display: none; }
  .cycle__evt { padding: 4px 8px; font-size: 11px; }
  .app__badge img { height: 29px; }
}
@media (prefers-reduced-motion: reduce) { .sk { animation: none; } }

/* ============ Gradients ============ */



.board__trend, .board__mini, .board__list { background: linear-gradient(180deg, #fff 0%, #fbfcfd 100%); }


.hrow > .tile.tile--dark { background: var(--g-dark) padding-box, linear-gradient(180deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,.04) 100%) border-box; }

.split__copy .h2 .accent { color: var(--h-dim); }

.app__halo::before { border-color: var(--line); }

/* ============ About page (Bybit About structure: terminal hero, mission + bento, audience, steps + ticket, legal, CTA) ============ */
.ab-wrap { max-width: var(--container); margin: 0 auto; }
.ab-head { display: flex; flex-direction: column; align-items: center; text-align: center; }
.ab-badge, .ab-label { display: inline-flex; align-items: center; align-self: start; gap: 8px; font-size: 13px; line-height: 20px; font-weight: 600; }
.ab-badge i, .ab-label::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.ab-btn-light, .btn--accent.hd__reg, .btn--accent.hd__reg:active { background: #f1f3f5 linear-gradient(180deg, #fff 0%, #e9ecf0 100%); color: #000; box-shadow: none; transition: box-shadow var(--ease), transform var(--ease); }
.ab-btn-ghost { background: transparent; color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.24); transition: box-shadow var(--ease), background var(--ease), transform var(--ease); }
.ab-btn-light:active, .ab-btn-ghost:active { transform: scale(.98); }
@media (hover: hover) and (pointer: fine) {
  .ab-btn-light:hover, .btn--accent.hd__reg:hover { box-shadow: inset 0 0 0 100px rgba(16,24,40,.08); }
  .ab-btn-ghost:hover { background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); }
}

/* Hero */
.ab-hero, .ab-cta__panel { position: relative; isolation: isolate; }
.ab-hero::before, .ab-cta__panel::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 56px 56px; background-position: center top;
  -webkit-mask-image: radial-gradient(ellipse 60% 70% at 72% 35%, #000 0%, transparent 75%); mask-image: radial-gradient(ellipse 60% 70% at 72% 35%, #000 0%, transparent 75%);
}
.ab-hero { padding: 88px 24px 104px; background: var(--dark); color: #fff; overflow: hidden; }
.ab-hero__wrap { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 40px; }
.ab-hero__title { margin-top: 20px; font-size: 52px; line-height: 58px; font-weight: 700; letter-spacing: -0.035em; text-wrap: balance; }
.ab-hero__title span { color: rgba(255,255,255,.5); }
.ab-hero .board { background: #17181e; border: 1px solid rgba(255,255,255,.1); }
.ab-hero .board__trend, .ab-hero .board__mini, .ab-hero .board__list { background: #1d1e25; }
.ab-hero .board__trend-tag, .ab-hero .board__mini-title, .ab-hero .board__trend-asset b, .ab-hero .board__trend-price strong, .ab-hero .board__rows b, .ab-hero .board__rows-price, .ab-hero .board__all, .ab-hero .board__tab:hover, .ab-hero .board__tab.is-active { color: #fff; }
.ab-hero .board__trend-asset small, .ab-hero .board__trend-price > span, .ab-hero .board__mini small, .ab-hero .board__rows b span, .ab-hero .board__head, .ab-hero .board__tab, .ab-hero .board__rows-empty { color: rgba(255,255,255,.55); }
.ab-hero .board__tab.is-active { background: rgba(255,255,255,.08); }
.ab-hero .board__head { border-bottom-color: rgba(255,255,255,.08); }
.ab-hero .board__mini a:hover, .ab-hero .board__rows a:hover, .ab-hero .board__mini a:focus-visible, .ab-hero .board__rows a:focus-visible { background: rgba(255,255,255,.05); }
.ab-hero .board__trend-chart [data-trend-dot] { fill: #1d1e25; }
.ab-hero .chg--pill, .ab-hero .board__trend-price .chg { color: rgba(255,255,255,.6); background: rgba(255,255,255,.06); }
.ab-hero .chg--pill.is-up, .ab-hero .board__trend-price .chg.is-up { color: var(--up-on-dark); background: rgba(32,178,108,.14); }
.ab-hero .chg--pill.is-down, .ab-hero .board__trend-price .chg.is-down { color: var(--down-on-dark); background: rgba(239,69,74,.14); }
.ab-hero .sk { background: linear-gradient(90deg, rgba(255,255,255,.04), rgba(255,255,255,.08), rgba(255,255,255,.04)); background-size: 200% 100%; }
.ab-hero .mcards a { background: #1d1e25; border-color: rgba(255,255,255,.1); }
.ab-hero .mcards__pair, .ab-hero .mcards__price { color: #fff; }
.ab-hero .mcards__all { color: #fff; }
.ab-hero .mcards__tag { color: var(--dark); background: #fff; }
.ab-hero .mcards .sk-row .sk { background-color: transparent; }
.ab-hero__sub { max-width: 580px; margin-top: 24px; font-size: 18px; line-height: 28px; color: rgba(255,255,255,.64); }

/* Mission + bento */
.ab-about { padding: var(--sec-y) 24px; }
.ab-mission { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 48px; }
.ab-mission__text { font-size: 40px; line-height: 50px; font-weight: 600; letter-spacing: -0.02em; color: var(--ink-h1); text-wrap: pretty; }
.ab-mission__text span { color: var(--h-dim); }
.ab-bento { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: var(--head-gap); }
.ab-tile { position: relative; display: flex; flex-direction: column; min-height: 360px; padding: 32px; background: var(--tint-bg); border: 1px solid var(--tint-line); border-radius: var(--r-card); overflow: hidden; }
.ab-tile__title { font-size: 22px; line-height: 30px; font-weight: 600; letter-spacing: -0.01em; }
.ab-tile__text { max-width: 420px; margin: 8px 0 24px; font-size: 15px; line-height: 22px; color: var(--muted); }
.ab-tile--dark { color: #fff; background: var(--g-dark); border-color: transparent; box-shadow: var(--sh-dark); }
.ab-tile--flow { grid-column: span 2; }
.ab-tile__ico { display: grid; place-items: center; width: 40px; height: 40px; border-radius: var(--r-ctl); }
.ab-tile__ico svg { width: 20px; height: 20px; }
.ab-tile__big { margin-top: auto; font-size: 96px; line-height: 96px; font-weight: 700; letter-spacing: -0.04em; }
.ab-tile--fee .ab-tile__title { margin-top: 12px; font-size: 18px; line-height: 26px; font-weight: 500; color: rgba(255,255,255,.8); }
.ab-tile__note { margin-top: 20px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.12); font-size: 13px; line-height: 18px; color: rgba(255,255,255,.55); }
.ab-flow { display: grid; grid-template-columns: auto minmax(48px, 1fr) auto minmax(48px, 1fr) auto; align-items: center; gap: 16px; margin-top: auto; padding: 28px; background: #fff; border-radius: var(--r-panel); }
.ab-flow__node { display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; }
.ab-flow__node img, .ab-flow__rub { width: 48px; height: 48px; margin-bottom: 10px; border-radius: 50%; }
.ab-flow__rub { display: grid; place-items: center; font-style: normal; font-size: 22px; font-weight: 700; }
.ab-flow__node b { font-size: 15px; line-height: 22px; font-weight: 600; }
.ab-flow__node small { font-size: 12px; line-height: 16px; color: var(--muted); }
.ab-flow__hub { display: grid; place-items: center; width: 64px; height: 64px; background: var(--dark); border-radius: 50%; box-shadow: 0 0 0 8px var(--board); }
.ab-flow__arrows { display: flex; flex-direction: column; gap: 14px; }
.ab-flow__arrow { position: relative; display: block; padding-bottom: 6px; text-align: center; }
.ab-flow__arrow small { display: block; font-size: 11px; line-height: 14px; font-weight: 500; color: var(--muted); }
.ab-flow__arrow::before { content: ""; position: absolute; left: 0; right: 2px; bottom: 0; height: 2px; border-radius: 2px; background: var(--line-strong); }
.ab-flow__arrow::after { content: ""; position: absolute; right: 1px; bottom: -3px; width: 8px; height: 8px; border-top: 2px solid var(--line-strong); border-right: 2px solid var(--line-strong); border-radius: 1px; transform: rotate(45deg); }
.ab-flow__arrow--back::before { left: 2px; right: 0; }
.ab-flow__arrow--back::after { right: auto; left: 1px; transform: rotate(-135deg); }
.ab-flow__arrow:not(.ab-flow__arrow--back)::before, .ab-flow__arrow:not(.ab-flow__arrow--back)::after { border-color: var(--dark); }
.ab-flow__arrow:not(.ab-flow__arrow--back)::before { background: var(--dark); }
.ab-quote { display: flex; flex-direction: column; margin-top: auto; padding: 16px; background: #fff; border-radius: var(--r-panel); }
.ab-quote__chart { position: relative; height: 96px; color: var(--dark); }
.ab-quote__chart svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.ab-quote__dot { position: absolute; right: 0; top: 25%; width: 12px; height: 12px; background: var(--dark); border: 3px solid #fff; border-radius: 50%; box-sizing: content-box; transform: translate(50%, -50%); }
.ab-quote__limit { position: absolute; left: 0; right: 0; top: 46%; border-top: 2px dashed var(--t3); }
.ab-quote__limit small { position: absolute; left: 0; top: 0; padding: 2px 8px; font-size: 12px; line-height: 16px; font-weight: 600; color: #fff; background: var(--dark); border-radius: 100px; transform: translateY(-50%); }
.ab-quote__seg { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-top: 14px; padding: 4px; background: var(--board); border-radius: var(--r-ctl); }
.ab-quote__seg span { padding: 6px 8px; font-size: 13px; line-height: 18px; font-weight: 600; text-align: center; color: var(--muted); border-radius: var(--r-sm); }
.ab-quote__seg .is-on { color: #fff; background: var(--dark); }
.ab-doc { position: relative; margin: auto 0 16px; }
.ab-doc::before, .ab-doc::after { content: ""; position: absolute; top: 0; bottom: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--r-panel); }
.ab-doc::before { left: 24px; right: 24px; transform: translateY(16px); opacity: .5; }
.ab-doc::after { left: 12px; right: 12px; transform: translateY(8px); opacity: .8; }
.ab-doc__paper { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 12px; padding: 16px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-panel); }
.ab-doc__head { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.ab-doc__head i { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: var(--r-tile-sm); }
.ab-doc__head i svg { width: 16px; height: 16px; }
.ab-doc__head > span { display: flex; flex-direction: column; }
.ab-doc__head b { font-size: 14px; line-height: 20px; font-weight: 600; }
.ab-doc__head small { font-size: 12px; line-height: 16px; color: var(--muted); font-variant-numeric: tabular-nums; }
.ab-doc__rows { margin: 0; padding-top: 12px; border-top: 1px dashed var(--line); }
.ab-doc__rows div { display: flex; justify-content: space-between; gap: 12px; padding: 3px 0; font-size: 13px; line-height: 18px; }
.ab-doc__rows dt { color: var(--muted); }
.ab-doc__rows dd { margin: 0; font-weight: 600; white-space: nowrap; }
.ab-doc__sign { display: inline-flex; align-self: flex-start; align-items: center; gap: 6px; margin-top: 4px; padding: 6px 12px; font-size: 12px; line-height: 16px; font-weight: 600; color: #fff; background: var(--dark); border-radius: 100px; }
.ab-pair { margin-top: auto; padding: 16px; background: #fff; border-radius: var(--r-panel); }
.ab-pair__head { display: flex; align-items: center; gap: 10px; padding-bottom: 14px; border-bottom: 1px dashed var(--line); }
.ab-pair__head i { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: var(--r-tile-sm); }
.ab-pair__head b { flex: 1; font-size: 14px; line-height: 20px; font-weight: 600; }
.ab-pair__head span { padding: 4px 10px; font-size: 12px; line-height: 16px; font-weight: 600; color: #fff; background: var(--dark); border-radius: 100px; }
.ab-pair__parties { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 32px minmax(0, 1fr); align-items: start; padding-top: 16px; }
.ab-pair__parties::before { content: ""; position: absolute; left: 25%; right: 25%; top: 39px; border-top: 2px dashed var(--line-strong); }
.ab-pair__node { position: relative; display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; }
.ab-pair__node i { display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 6px; border-radius: 50%; }
.ab-pair__node b { font-size: 14px; line-height: 20px; font-weight: 600; }
.ab-pair__node small { font-size: 12px; line-height: 16px; color: var(--muted); white-space: nowrap; }
.ab-pair__link { position: relative; display: grid; place-items: center; height: 48px; }
.ab-pair__link i { position: relative; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; }

/* Audience */
.ab-aud { padding: var(--sec-y) 24px; background: var(--board); }
.ab-aud__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: var(--head-gap); }
.ab-aud__card { display: flex; flex-direction: column; padding: 32px; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-card); transition: box-shadow var(--ease); }
@media (hover: hover) and (pointer: fine) { .ab-aud__card:hover { box-shadow: var(--sh-lift); } }
.ab-aud__card--dark { color: #fff; background: var(--g-dark); box-shadow: var(--sh-dark); }
.ab-aud__ico { display: grid; place-items: center; width: 40px; height: 40px; border-radius: var(--r-ctl); }
.ab-aud__title { margin-top: 32px; font-size: 22px; line-height: 30px; font-weight: 600; letter-spacing: -0.01em; }
.ab-aud__list { display: flex; flex-direction: column; gap: 14px; margin: 20px 0 32px; }
.ab-aud__list li { display: flex; gap: 10px; font-size: 15px; line-height: 22px; color: var(--muted); }
.ab-aud__list svg { flex: none; margin-top: 3px; color: var(--ink); }
.ab-aud__card--dark .ab-aud__list li { color: rgba(255,255,255,.7); }
.ab-aud__card--dark .ab-aud__list svg { color: #fff; }
.ab-aud__link { display: inline-flex; align-items: center; gap: 8px; margin-top: auto; padding-top: 20px; border-top: 1px solid var(--line); font-size: 15px; line-height: 22px; font-weight: 600; }
.ab-aud__card--dark .ab-aud__link { border-color: rgba(255,255,255,.12); }
.ab-aud__link svg { width: 18px; height: 18px; transition: transform var(--ease); }
@media (hover: hover) and (pointer: fine) { .ab-aud__link:hover svg { transform: translateX(4px); } }

/* How we work */
.ab-how { padding: var(--sec-y) 24px; background: var(--dark); color: #fff; }
.ab-how .h2 { color: #fff; }
.ab-how__grid { display: grid; grid-template-columns: minmax(0, 1fr) 440px; align-items: start; gap: 64px; margin-top: var(--head-gap); }
.ab-steps { border-top: 1px solid rgba(255,255,255,.14); }
.ab-step { border-bottom: 1px solid rgba(255,255,255,.14); }
.ab-step summary { display: grid; grid-template-columns: 112px minmax(0, 1fr) 24px; align-items: center; gap: 24px; padding: 22px 0; cursor: pointer; list-style: none; }
.ab-step summary::-webkit-details-marker { display: none; }
.ab-step__num { font-size: 56px; line-height: 64px; font-weight: 600; letter-spacing: -0.03em; font-variant-numeric: tabular-nums; color: rgba(255,255,255,.48); transition: color .2s ease; }
.ab-step__title { font-size: 22px; line-height: 30px; font-weight: 500; color: rgba(255,255,255,.6); transition: color .2s ease; }
.ab-step[open] .ab-step__num, .ab-step[open] .ab-step__title, .ab-step summary:hover .ab-step__title { color: #fff; }
.ab-step__ico { position: relative; width: 24px; height: 24px; }
.ab-step__ico::before, .ab-step__ico::after { content: ""; position: absolute; left: 2px; right: 2px; top: 11px; height: 2px; border-radius: 2px; background: #fff; transition: transform .25s ease; }
.ab-step__ico::after { transform: rotate(90deg); }
.ab-step[open] .ab-step__ico::after { transform: rotate(0deg); }
.ab-step__list { display: flex; flex-direction: column; gap: 12px; padding: 0 48px 30px 136px; }
.ab-step__list li { position: relative; padding-left: 20px; font-size: 16px; line-height: 24px; color: rgba(255,255,255,.75); }
.ab-step__list li::before { content: ""; position: absolute; left: 0; top: 9px; width: 6px; height: 6px; border-radius: 50%; background: #fff; }
.ab-ticket { position: sticky; top: calc(var(--hd-h) + 32px); padding: 24px; color: var(--ink); background: #fff; border-radius: var(--r-card); }
.ab-ticket__head { display: flex; align-items: center; gap: 12px; }
.ab-ticket__title { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.ab-ticket__title b { font-size: 16px; line-height: 24px; font-weight: 600; font-variant-numeric: tabular-nums; }
.ab-ticket__title small { font-size: 12px; line-height: 16px; color: var(--muted); }
.ab-ticket__status { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px 4px 8px; font-size: 12px; line-height: 16px; font-weight: 600; color: #fff; background: var(--dark); border-radius: 100px; }
.ab-tk { position: relative; display: flex; align-items: center; gap: 14px; padding: 12px; border-radius: var(--r-ctl); transition: background .25s ease; }
.ab-tk + .ab-tk { margin-top: 2px; }
.ab-tk::before { content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px; border-radius: 3px; background: var(--dark); transform: scaleY(0); transition: transform .25s ease; }
.ab-how:has(.ab-step:nth-child(1)[open]) .ab-tk[data-s="1"],
.ab-how:has(.ab-step:nth-child(2)[open]) .ab-tk[data-s="2"],
.ab-how:has(.ab-step:nth-child(3)[open]) .ab-tk[data-s="3"],
.ab-how:has(.ab-step:nth-child(4)[open]) .ab-tk[data-s="4"],
.ab-how:has(.ab-step:nth-child(5)[open]) .ab-tk[data-s="5"] { background: var(--board); }
.ab-how:has(.ab-step:nth-child(1)[open]) .ab-tk[data-s="1"]::before,
.ab-how:has(.ab-step:nth-child(2)[open]) .ab-tk[data-s="2"]::before,
.ab-how:has(.ab-step:nth-child(3)[open]) .ab-tk[data-s="3"]::before,
.ab-how:has(.ab-step:nth-child(4)[open]) .ab-tk[data-s="4"]::before,
.ab-how:has(.ab-step:nth-child(5)[open]) .ab-tk[data-s="5"]::before { transform: scaleY(1); }
.ab-tk__avatar { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%; }
.ab-tk__chip { display: inline-flex; align-items: center; gap: 4px; flex: none; padding: 4px 10px 4px 8px; font-size: 12px; line-height: 16px; font-weight: 600; color: var(--up-text); background: rgba(32,178,108,.12); border-radius: 100px; }
.ab-tk__vis { display: flex; align-items: center; justify-content: center; flex: none; width: 92px; }
.ab-tk__vis i { display: grid; place-items: center; flex: none; width: 36px; height: 36px; font-style: normal; border-radius: 50%; }
.ab-tk__vis i.is-rub { font-size: 15px; font-weight: 600; }
.ab-tk__vis em { display: grid; place-items: center; width: 20px; color: var(--muted); }
.ab-tk__txt { display: flex; flex-direction: column; min-width: 0; }
.ab-tk__txt b { font-size: 14px; line-height: 20px; font-weight: 600; }
.ab-tk__txt small { font-size: 12px; line-height: 16px; color: var(--muted); }
.ab-tk__docs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ab-tk__file { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 10px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-ctl); }
.ab-tk__file > i { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: var(--r-tile-sm); }
.ab-tk__file > span { display: flex; flex-direction: column; min-width: 0; }
.ab-tk__file b { font-size: 13px; line-height: 18px; font-weight: 600; white-space: nowrap; }
.ab-tk__file small { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; line-height: 16px; font-weight: 600; color: var(--up-text); white-space: nowrap; }
.ab-ticket__sec { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 12px 0 4px; padding: 16px 12px 0; border-top: 1px dashed var(--line); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); font-variant-numeric: tabular-nums; }
.ab-ticket__sec .ab-ticket__status { letter-spacing: 0; text-transform: none; }

/* Legal */
.ab-legal { padding: var(--sec-y) 24px; background: var(--board); }
.ab-legal__grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 16px; margin-top: var(--head-gap); }
.ab-card { padding: 32px; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-card); }
.ab-card--wide { grid-column: 1 / -1; }
.ab-legal__side { display: flex; flex-direction: column; align-self: stretch; gap: 16px; min-width: 0; }
.ab-lic { position: relative; display: flex; flex: 1; align-items: center; gap: 16px; padding: 24px; overflow: hidden; color: #fff; background: var(--g-dark); box-shadow: var(--sh-dark); }
.ab-lic .ab-card__ico { flex: none; }
.ab-lic__mark { position: absolute; right: -24px; top: 50%; width: 140px; height: 140px; color: rgba(255,255,255,.07); transform: translateY(-50%); pointer-events: none; }
.ab-lic__body { position: relative; min-width: 0; }
.ab-lic__h { font-size: 20px; line-height: 28px; letter-spacing: -0.01em; font-weight: 600; }
.ab-lic__text { margin-top: 2px; font-size: 15px; line-height: 22px; color: rgba(255,255,255,.64); }
.ab-lic__text b { font-weight: 600; color: #fff; white-space: nowrap; }
.ab-card__h { display: flex; align-items: center; gap: 12px; font-size: 20px; line-height: 28px; font-weight: 600; letter-spacing: -0.01em; }
.ab-card__ico { display: grid; place-items: center; width: 40px; height: 40px; border-radius: var(--r-ctl); }
.ab-req { margin: 20px 0 0; }
.ab-req div { display: grid; grid-template-columns: 220px minmax(0, 1fr); align-items: center; gap: 16px; min-height: 52px; padding: 10px 0; border-top: 1px solid var(--line); }
.ab-req dt { color: var(--muted); }
.ab-req dd { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0; font-size: 15px; line-height: 22px; font-variant-numeric: tabular-nums; }
.ab-req a { text-decoration: underline; text-underline-offset: 3px; }
.ab-copy { position: relative; display: grid; place-items: center; flex: none; width: 32px; height: 32px; padding: 0; color: var(--muted); background: none; border: 0; border-radius: var(--r-sm); transition: background var(--ease), color var(--ease); }
.ab-copy svg { grid-area: 1 / 1; width: 16px; height: 16px; transition: opacity .15s ease, transform .15s ease; }
.ab-copy svg + svg { opacity: 0; transform: scale(.6); color: var(--up); }
.ab-copy.is-done svg:first-child { opacity: 0; transform: scale(.6); }
.ab-copy.is-done svg + svg { opacity: 1; transform: none; }
@media (hover: hover) and (pointer: fine) { .ab-copy:hover { color: var(--ink); background: var(--board); } }
.ab-contacts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px 24px; margin-top: 20px; }
.ab-contacts__item { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 8px 10px 12px; margin: 0 -12px; border-radius: var(--r-ctl); transition: background var(--ease); }
.ab-contacts p { display: flex; flex-direction: column; gap: 2px; min-width: 0; margin: 0; }
.ab-contacts b { min-width: 0; overflow-wrap: anywhere; font-size: 15px; line-height: 22px; font-weight: 500; }
.ab-contacts span { font-size: 13px; line-height: 18px; color: var(--muted); }
.ab-contacts .ab-copy { transition: background var(--ease), color var(--ease), opacity var(--ease); }
@media (hover: hover) and (pointer: fine) {
  .ab-contacts__item:hover { background: var(--board); }
  .ab-contacts__item:hover .ab-copy:hover { background: #fff; }
  .ab-contacts .ab-copy { opacity: 0; }
  .ab-contacts__item:hover .ab-copy, .ab-contacts .ab-copy:focus-visible, .ab-contacts .ab-copy.is-done { opacity: 1; }
}
.ab-docs { display: flex; flex-direction: column; gap: 4px; margin-top: 20px; }
.ab-docs a, .ab-docs__soon { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 8px 12px; margin: 0 -12px; border-radius: var(--r-ctl); transition: background var(--ease); }
.ab-docs b { flex: 1; font-size: 15px; line-height: 22px; font-weight: 600; }
.ab-docs__soon b { font-weight: 500; color: var(--muted); }
.ab-docs a > svg { flex: none; color: var(--muted); transition: transform var(--ease), color var(--ease); }
@media (hover: hover) and (pointer: fine) { .ab-docs a:hover { background: var(--board); } .ab-docs a:hover > svg { color: var(--ink); transform: translateX(4px); } }

/* CTA */
.ab-cta { padding: var(--sec-y) 24px; }
.ab-cta__panel { display: flex; flex-direction: column; align-items: center; max-width: var(--container); margin: 0 auto; padding: 88px 24px; text-align: center; color: #fff; background: var(--g-dark); border-radius: var(--r-card); box-shadow: var(--sh-dark); overflow: hidden; }
.ab-cta__panel::before { -webkit-mask-image: radial-gradient(ellipse 60% 90% at 50% 0%, #000 0%, transparent 80%); mask-image: radial-gradient(ellipse 60% 90% at 50% 0%, #000 0%, transparent 80%); }
.ab-cta__mark { width: 48px; height: 48px; }
.ab-cta__title { margin-top: 24px; font-size: 52px; line-height: 60px; font-weight: 700; letter-spacing: -0.035em; text-wrap: balance; }
.ab-cta__sub { margin-top: 12px; font-size: 18px; line-height: 28px; color: rgba(255,255,255,.64); }
.ab-cta__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 36px; }

@supports (interpolate-size: allow-keywords) {
  .ab-steps { interpolate-size: allow-keywords; }
  .ab-step::details-content { height: 0; overflow: clip; transition: height .3s cubic-bezier(.2,.7,.2,1), content-visibility .3s allow-discrete; }
  .ab-step[open]::details-content { height: auto; }
}
@media (max-width: 1260px) { .ab-hero__title { font-size: 46px; line-height: 52px; } }
@media (max-width: 1080px) {
  .ab-hero { padding-top: 64px; }
  .ab-hero__wrap, .ab-how__grid, .ab-mission, .ab-legal__grid { grid-template-columns: minmax(0, 1fr); }
  .ab-contacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ab-hero__wrap { gap: 40px; }
  .ab-hero__title { font-size: 52px; line-height: 58px; }
  .ab-mission { gap: 24px; }
  .ab-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ab-aud__grid { grid-template-columns: minmax(0, 1fr); }
  .ab-how__grid { gap: 40px; }
  .ab-ticket { position: static; max-width: 560px; }
}
@media (max-width: 767px) {
  .ab-hero { padding: 48px 16px 56px; }
  .ab-hero__title { margin-top: 16px; font-size: 36px; line-height: 42px; }
  .ab-hero__sub { margin-top: 16px; font-size: 16px; line-height: 24px; }
  .ab-cta__btns .btn { width: 100%; }
  .ab-about { padding: var(--sec-y) 16px; }
  .ab-mission__text { font-size: 26px; line-height: 34px; }
  .ab-bento { grid-template-columns: minmax(0, 1fr); gap: 12px; margin-top: 40px; }
  .ab-tile--flow { grid-column: auto; }
  .ab-tile { min-height: 0; padding: 24px 20px; }
  .ab-tile__title { font-size: 20px; line-height: 28px; }
  .ab-tile > div, .ab-tile__big { margin-top: 28px; }
  .ab-tile__text { margin-bottom: 0; }
  .ab-tile__big { font-size: 72px; line-height: 72px; }
  .ab-flow { grid-template-columns: auto minmax(20px, 1fr) auto minmax(20px, 1fr) auto; gap: 8px; padding: 20px 12px; }
  .ab-flow__node img, .ab-flow__rub { width: 40px; height: 40px; }
  .ab-flow__node b { font-size: 13px; line-height: 18px; }
  .ab-flow__node small, .ab-flow__arrow small { display: none; }
  .ab-flow__hub { width: 52px; height: 52px; }
  .ab-aud { padding: var(--sec-y) 16px; }
  .ab-aud .sec-sub { font-size: 16px; line-height: 24px; }
  .ab-aud__grid { margin-top: 28px; gap: 12px; }
  .ab-aud__card { padding: 24px 20px; }
  .ab-aud__title { margin-top: 24px; font-size: 20px; line-height: 28px; }
  .ab-how { padding: var(--sec-y) 16px; }
  .ab-how__grid { margin-top: 24px; }
  .ab-step summary { grid-template-columns: 40px minmax(0, 1fr) 24px; gap: 12px; padding: 20px 0; }
  .ab-step__num { font-size: 22px; line-height: 30px; }
  .ab-step__title { font-size: 18px; line-height: 26px; }
  .ab-step__list { padding: 0 0 24px 52px; }
  .ab-step__list li { font-size: 15px; line-height: 22px; }
  .ab-ticket { padding: 20px 16px; }
  .ab-ticket__sec { padding: 16px 8px 0; }
  .ab-tk { gap: 12px; padding: 10px 8px; }
  .ab-ticket__title b { font-size: 15px; line-height: 22px; white-space: nowrap; }
  .ab-tk__avatar { width: 36px; height: 36px; }
  .ab-tk__chip { padding: 4px 8px 4px 6px; font-size: 11px; }
  .ab-tk__vis { width: 80px; }
  .ab-tk__docs { grid-template-columns: minmax(0, 1fr); }
  .ab-legal { padding: var(--sec-y) 16px; }
  .ab-legal__grid { margin-top: 28px; gap: 12px; }
  .ab-legal__side { gap: 12px; }
  .ab-contacts { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .ab-card { padding: 24px 20px; }
  .ab-req div { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .ab-cta { padding: var(--sec-y) 16px; }
  .ab-cta__panel { padding: 56px 20px; }
  .ab-cta__title { font-size: 32px; line-height: 40px; }
  .ab-cta__sub { font-size: 16px; line-height: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .ab-step::details-content, .ab-step__ico::before, .ab-step__ico::after, .ab-step__num, .ab-step__title, .ab-btn-light, .ab-btn-ghost, .ab-docs a, .ab-docs a > svg, .ab-contacts__item, .ab-contacts .ab-copy, .ab-aud__card, .ab-aud__link svg, .ab-copy, .ab-copy svg, .ab-tk, .ab-tk::before { transition: none; }
}

/* ============ LEGAL CENTER (/legal/) ============ */
.lg-page { display: grid; grid-template-columns: 280px minmax(0, 1fr); background: var(--board); }
.lg-side { position: sticky; top: var(--hd-h); align-self: start; height: calc(100vh - var(--hd-h)); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; background: #fff; border-right: 1px solid var(--line); }
.lg-nav__toggle { display: none; }
.lg-nav__body { padding: 20px 12px 32px; }
.lg-nav__label { padding: 0 12px 8px; font-size: 13px; line-height: 18px; font-weight: 500; color: var(--muted); }
.lg-nav__label:not(:first-child) { margin-top: 24px; }
.lg-nav__list { display: flex; flex-direction: column; gap: 2px; }
.lg-nav__doc, .lg-nav__link, .lg-nav__soon { position: relative; display: flex; align-items: center; min-height: 48px; padding: 12px 12px 12px 16px; font-size: 16px; line-height: 24px; font-weight: 500; color: var(--ink); border-radius: var(--r-sm); transition: background var(--ease); }
.lg-nav__soon { color: var(--muted); }
.lg-nav__doc.is-active, .lg-nav__link.is-active { background: rgba(56,68,82,.06); }
.lg-nav__doc.is-active::before, .lg-nav__link.is-active::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px; border-radius: 3px; background: var(--accent); }
@media (hover: hover) and (pointer: fine) {
  .lg-nav__doc:hover, .lg-nav__link:hover { background: rgba(56,68,82,.04); }
}

.lg-main { min-width: 0; padding: 24px 32px 80px; }
.lg-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; margin: 0; padding: 0; list-style: none; font-size: 14px; line-height: 21px; font-weight: 500; color: var(--muted); }
.lg-crumbs li + li::before { content: ""; display: inline-block; width: 6px; height: 6px; margin: 0 12px 2px 0; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); }
.lg-crumbs li:last-child { color: var(--ink); }
.lg-crumbs a { transition: color var(--ease); }
@media (hover: hover) and (pointer: fine) { .lg-crumbs a:hover { color: var(--ink); } }
.lg-body { display: grid; grid-template-columns: minmax(0, 1fr) 256px; align-items: start; gap: 32px; margin-top: 24px; }
.lg-docs { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.lg-card { padding: 48px 8% 56px; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-card); }
.lg-card__title { font-size: 32px; line-height: 40px; font-weight: 700; letter-spacing: -0.03em; color: var(--ink-h1); text-wrap: balance; }
.lg-card__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 16px; font-size: 13px; line-height: 20px; color: var(--muted); }
.lg-card__org { display: inline-flex; align-items: center; gap: 8px; font-weight: 500; color: var(--ink); }
.lg-card__logo { display: grid; place-items: center; flex: none; width: 28px; height: 28px; background: var(--dark); border-radius: 50%; }
.lg-card__rev { color: var(--muted); }
.lg-card__pdf { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 14px; font-weight: 600; color: var(--ink); border: 1px solid var(--line); border-radius: 100px; transition: background var(--ease), border-color var(--ease); }
@media (hover: hover) and (pointer: fine) { .lg-card__pdf:hover { background: var(--board); border-color: var(--line-strong); } }
.lg-card__body { margin-top: 32px; padding-top: 32px; border-top: 1px solid var(--line); }

.lg-sec + .lg-sec { margin-top: 36px; }
.lg-sec h2 { font-size: 20px; line-height: 28px; font-weight: 600; letter-spacing: -0.01em; color: var(--ink-h1); }
.lg-sec__num { color: var(--muted); font-variant-numeric: tabular-nums; }
.lg-sec p, .lg-sec li { font-size: 16px; line-height: 26px; color: var(--text-2); }
.lg-sec p { margin-top: 14px; }
.lg-sec h2 + p { margin-top: 16px; }
.lg-sec--lead p:first-child { margin-top: 0; }
.lg-sec--lead p { font-size: 17px; line-height: 28px; color: var(--ink); }
.lg-sec p > strong:first-child { font-weight: 600; color: var(--ink-h1); font-variant-numeric: tabular-nums; }
.lg-sec ul { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; padding-left: 24px; list-style: disc; }
.lg-sec li::marker { color: var(--muted); }
.lg-sec a { color: var(--ink-h1); text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; overflow-wrap: anywhere; transition: text-decoration-color var(--ease); }
@media (hover: hover) and (pointer: fine) { .lg-sec a:hover { text-decoration-color: currentColor; } }
.lg-table { margin-top: 16px; overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-ctl); }
.lg-table table { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 21px; }
.lg-table th { padding: 12px 16px; font-weight: 600; text-align: left; vertical-align: bottom; color: var(--ink-h1); background: var(--board); }
.lg-table td { padding: 12px 16px; vertical-align: top; color: var(--text-2); border-top: 1px solid var(--line); }
.lg-table td:first-child { font-weight: 500; color: var(--ink-h1); }
.lg-key { padding: 16px 20px; background: var(--warn-bg); border: 1px solid var(--warn-line); border-radius: var(--r-ctl); }
.lg-key strong { font-weight: 600; color: var(--ink-h1); }

.lg-toc { position: sticky; top: calc(var(--hd-h) + 24px); grid-column: 2; grid-row: 1; }
.lg-toc__panel { padding: 20px 12px 16px 16px; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-card); }
.lg-toc__toggle { display: none; }
.lg-toc__body { max-height: calc(100vh - var(--hd-h) - 84px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.lg-toc__label { padding: 0 0 12px; font-size: 13px; line-height: 18px; font-weight: 500; color: var(--muted); }
.lg-toc__doc { padding: 12px 0 6px; font-size: 13px; line-height: 18px; font-weight: 600; color: var(--ink); }
.lg-toc__panel[data-ready] .lg-toc__doc { display: none; }
.lg-toc ol { margin: 0; padding: 0; list-style: none; border-left: 1px solid var(--line); }
.lg-toc ol a { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 4px; margin-left: -1px; padding: 6px 8px 6px 15px; font-size: 13px; line-height: 19px; color: var(--muted); border-left: 2px solid transparent; transition: color var(--ease), border-color var(--ease); }
.lg-toc ol a span { font-variant-numeric: tabular-nums; }
.lg-toc ol a.is-active { color: var(--ink); font-weight: 600; border-left-color: var(--accent); }
@media (hover: hover) and (pointer: fine) { .lg-toc ol a:hover { color: var(--ink); } }
@media (max-width: 1280px) {
  .lg-body { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .lg-toc { position: static; grid-column: auto; grid-row: auto; order: -1; }
  .lg-toc__panel { padding: 0; border-radius: var(--r-panel); }
  .lg-toc__toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 52px; padding: 0 24px; font-size: 15px; line-height: 20px; font-weight: 600; cursor: pointer; list-style: none; }
  .lg-toc__toggle::-webkit-details-marker { display: none; }
  .lg-toc__toggle svg { flex: none; color: var(--muted); transition: transform var(--ease); }
  .lg-toc__panel[open] .lg-toc__toggle svg { transform: rotate(180deg); }
  .lg-toc__body { max-height: none; padding: 0 16px 16px; }
  .lg-toc__label { display: none; }
  .lg-toc ol a { font-size: 14px; line-height: 20px; }
  .lg-card { padding: 40px 6% 48px; }
}
@media (max-width: 1080px) {
  .lg-page { grid-template-columns: minmax(0, 1fr); }
  .lg-side { position: relative; top: auto; z-index: 30; height: auto; overflow: visible; border-right: 0; border-bottom: 1px solid var(--line); }
  .lg-nav__toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 52px; padding: 0 24px; font-size: 15px; line-height: 20px; font-weight: 600; cursor: pointer; list-style: none; }
  .lg-nav__toggle::-webkit-details-marker { display: none; }
  .lg-nav__toggle span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .lg-nav__toggle svg { flex: none; color: var(--muted); transition: transform var(--ease); }
  .lg-nav[open] .lg-nav__toggle svg { transform: rotate(180deg); }
  .lg-nav__body { position: absolute; left: 0; right: 0; top: 100%; max-height: calc(100vh - var(--hd-h) - 52px - 24px); max-height: calc(100dvh - var(--hd-h) - 52px - 24px); overflow-y: auto; overscroll-behavior: contain; padding: 12px 12px 20px; background: #fff; border-bottom: 1px solid var(--line); box-shadow: var(--sh-pop); }
  .lg-main { padding: 20px 24px 64px; }
}
@media (max-width: 767px) {
  .lg-nav__toggle { padding: 0 16px; }
  .lg-main { padding: 16px 16px 48px; }
  .lg-card { padding: 24px 20px 32px; }
  .lg-toc__toggle { padding: 0 20px; }
  .lg-toc__body { padding: 0 12px 12px; }
  .lg-card__title { font-size: 24px; line-height: 32px; }
  .lg-card__body { margin-top: 24px; padding-top: 24px; }
  .lg-sec + .lg-sec { margin-top: 28px; }
  .lg-sec h2 { font-size: 18px; line-height: 26px; }
  .lg-sec p, .lg-sec li { font-size: 15px; line-height: 24px; }
  .lg-sec--lead p { font-size: 16px; line-height: 26px; }
  .lg-key { padding: 14px 16px; }
  .lg-table { overflow: visible; border: 0; border-radius: 0; }
  .lg-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .lg-table table, .lg-table tbody, .lg-table tr, .lg-table td { display: block; }
  .lg-table tr { padding: 4px 16px; border: 1px solid var(--line); border-radius: var(--r-ctl); }
  .lg-table tr + tr { margin-top: 8px; }
  .lg-table td { padding: 10px 0; border-top: 0; }
  .lg-table td + td { border-top: 1px solid var(--line); }
  .lg-table td::before { content: attr(data-label); display: block; margin-bottom: 2px; font-size: 12px; line-height: 16px; font-weight: 500; color: var(--muted); }
}
@media (prefers-reduced-motion: reduce) { .lg-nav__doc, .lg-nav__link, .lg-nav__toggle svg, .lg-toc ol a, .lg-toc__toggle svg, .lg-crumbs a, .lg-card__pdf, .lg-sec a { transition: none; } }

/* ============ NOTICE CENTRE (/notices/) — reuses the legal shell (.lg-page, .lg-side, .lg-crumbs, .lg-card) ============ */
.nt-body { display: grid; grid-template-columns: minmax(0, 1fr) 320px; align-items: start; gap: 32px; margin-top: 24px; }
.nt-feed { min-width: 0; scroll-margin-top: calc(var(--hd-h) + 24px); }
.nt-head__title { font-size: 32px; line-height: 40px; font-weight: 700; letter-spacing: -0.03em; color: var(--ink-h1); text-wrap: balance; }
.nt-head__lead { max-width: 640px; margin-top: 12px; font-size: 16px; line-height: 24px; color: var(--text-2); text-wrap: pretty; }
.nt-list { margin-top: 24px; }
.nt-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; font-size: 13px; line-height: 20px; color: var(--muted); font-variant-numeric: tabular-nums; }
.nt-tag { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; font-size: 12px; line-height: 16px; font-weight: 600; color: var(--ink); background: var(--board); border-radius: 100px; }

.nt-status { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px; padding: 20px 24px; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-card); }
.nt-status[hidden] { display: none; }
.nt-status__ico, .nt-files__ico { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: var(--r-ctl); }
.nt-status p { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nt-status small { font-size: 12px; line-height: 16px; color: var(--muted); }
.nt-status b { font-size: 16px; line-height: 24px; font-weight: 600; color: var(--ink-h1); }
.nt-status__val { text-align: right; }
.nt-status__val b { font-variant-numeric: tabular-nums; white-space: nowrap; }

.nt-status + .nt-rows { margin-top: 16px; }
.nt-rows { margin: 0; padding: 0; list-style: none; overflow: hidden; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-card); }
.nt-rows > li + li { border-top: 1px solid var(--line); }
.nt-row { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 20px; align-items: start; gap: 20px; padding: 20px 24px; transition: background var(--ease); }
.nt-row__title { margin-top: 6px; font-size: 17px; line-height: 24px; font-weight: 600; color: var(--ink-h1); text-wrap: pretty; }
.nt-row__title a { outline: none; }
.nt-row__title a::after { content: ""; position: absolute; inset: 0; }
.nt-row:has(.nt-row__title a:focus-visible) { box-shadow: inset 0 0 0 2px var(--ink); }
.nt-row__text { margin-top: 4px; font-size: 14px; line-height: 22px; color: var(--text-2); }
.nt-row__eff { margin-top: 8px; font-size: 13px; line-height: 20px; font-weight: 600; color: var(--ink); }
.nt-row__thumb { display: none; }
.nt-list[data-nt-view="cat"] .nt-row--cover { grid-template-columns: 160px minmax(0, 1fr) 20px; }
.nt-list[data-nt-view="cat"] .nt-row__thumb { display: block; align-self: center; width: 160px; aspect-ratio: 16 / 10; object-fit: cover; background: var(--board); border-radius: var(--r-tile-sm); }
.nt-row__go { align-self: center; display: grid; place-items: center; color: var(--muted); transition: color var(--ease), transform var(--ease); }

.nt-pager { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 24px; }
.nt-pager[hidden] { display: none; }
.nt-pager a, .nt-pager span { display: grid; place-items: center; min-width: 40px; height: 40px; padding: 0 8px; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; border-radius: var(--r-ctl); }
.nt-pager a { background: var(--card-bg); border: 1px solid transparent; box-shadow: var(--sh-card); transition: background var(--ease), color var(--ease); }
.nt-pager a[aria-current="page"] { color: #fff; background: var(--dark); }
.nt-pager a:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.nt-pager__gap { color: var(--muted); }
.nt-pager__off { color: var(--muted); opacity: .5; }
.nt-empty { display: flex; flex-direction: column; align-items: center; gap: 4px; margin-top: 24px; padding: 48px 24px; text-align: center; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-card); }
.nt-empty[hidden] { display: none; }
.nt-empty b { font-size: 16px; line-height: 24px; font-weight: 600; color: var(--ink-h1); }
.nt-empty span { font-size: 14px; line-height: 22px; color: var(--muted); }

.nt-aside { position: sticky; top: calc(var(--hd-h) + 24px); display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.nt-panel { padding: 24px; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-card); }
.nt-panel__title { font-size: 16px; line-height: 24px; font-weight: 600; color: var(--ink-h1); }
.nt-panel__text { margin-top: 4px; font-size: 13px; line-height: 20px; color: var(--muted); }
.nt-docs { display: flex; flex-direction: column; margin-top: 12px; }
.nt-docs a { display: flex; flex-direction: column; gap: 2px; margin: 0 -12px; padding: 10px 12px; border-radius: var(--r-ctl); transition: background var(--ease); }
.nt-docs b { font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink); }
.nt-docs small { font-size: 12px; line-height: 18px; color: var(--muted); }
.nt-panel__mail { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; font-size: 14px; line-height: 20px; }
.nt-panel__mail b { font-weight: 600; color: var(--ink); }

.nt-doc .lg-card__title { margin-top: 16px; }
.nt-doc__lead { margin-top: 12px; font-size: 17px; line-height: 28px; color: var(--text-2); text-wrap: pretty; }
.nt-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 16px 24px; margin-top: 28px; padding: 20px 24px; background: var(--board); border-radius: var(--r-ctl); }
.nt-facts dt { font-size: 12px; line-height: 16px; color: var(--muted); }
.nt-facts dd { margin: 4px 0 0; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink-h1); font-variant-numeric: tabular-nums; }
.nt-facts a { text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; }
.nt-cover { display: block; width: 100%; aspect-ratio: 16 / 9; margin-top: 28px; object-fit: cover; background: var(--board); border-radius: var(--r-ctl); }
.nt-doc__body { margin-top: 28px; }
.nt-doc__body p:first-child { margin-top: 0; }
.nt-files__title { margin-top: 32px; font-size: 15px; line-height: 22px; font-weight: 600; color: var(--ink-h1); }
.nt-files { display: flex; flex-direction: column; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.nt-files a { display: grid; grid-template-columns: 40px minmax(0, 1fr) 16px; align-items: center; gap: 14px; padding: 12px 16px 12px 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); transition: background var(--ease); }
.nt-files__txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.nt-files b { font-size: 15px; line-height: 22px; font-weight: 600; color: var(--ink-h1); }
.nt-files small { font-size: 12px; line-height: 16px; color: var(--muted); }
.nt-files a > svg { color: var(--muted); transition: transform var(--ease), color var(--ease); }
.nt-doc__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--line); }
.nt-back { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink); border: 1px solid var(--line); border-radius: 100px; transition: background var(--ease); }
.nt-back svg { flex: none; color: var(--muted); }
.nt-permalink { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; line-height: 20px; color: var(--muted); }
@media (hover: hover) and (pointer: fine) {
  .nt-row:hover { background: rgba(56,68,82,.03); }
  .nt-row:hover .nt-row__go, .nt-files a:hover > svg { color: var(--ink); transform: translateX(4px); }
  .nt-files a[target]:hover > svg { transform: translate(2px, -2px); }
  .nt-docs a:hover, .nt-files a:hover, .nt-back:hover, .nt-pager a:not([aria-current]):hover { background: var(--board); }
}
@media (max-width: 1280px) {
  .nt-body { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .nt-aside { position: static; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
}
@media (max-width: 767px) {
  .nt-body { margin-top: 16px; }
  .nt-head__title { font-size: 24px; line-height: 32px; }
  .nt-head__lead { font-size: 15px; line-height: 22px; }
  .nt-status { grid-template-columns: auto minmax(0, 1fr); gap: 12px 14px; padding: 16px; }
  .nt-status .nt-status__val { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; padding-top: 12px; text-align: left; border-top: 1px solid var(--line); }
  .nt-status__val b { font-size: 14px; line-height: 20px; }
  .nt-row { grid-template-columns: minmax(0, 1fr); gap: 14px; padding: 16px; }
  .nt-row__go { display: none; }
  .nt-list[data-nt-view="cat"] .nt-row--cover { grid-template-columns: minmax(0, 1fr); }
  .nt-list[data-nt-view="cat"] .nt-row__thumb { width: 100%; aspect-ratio: 16 / 9; }
  .nt-pager { gap: 6px; }
  .nt-pager a, .nt-pager span { min-width: 36px; height: 36px; }
  .nt-cover { margin-top: 20px; }
  .nt-row__title { font-size: 16px; line-height: 22px; }
  .nt-aside { grid-template-columns: minmax(0, 1fr); }
  .nt-panel { padding: 20px; }
  .nt-doc__lead { font-size: 16px; line-height: 26px; }
  .nt-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 16px; }
}
@media (prefers-reduced-motion: reduce) { .nt-row, .nt-row__go, .nt-docs a, .nt-files a, .nt-files a > svg, .nt-back, .nt-pager a { transition: none; } }

/* ============ PRODUCT PAGES (/deposit/rub/, /deposit/crypto/, /convert/) ============ */
.px { background: #fff; }
.px__wrap { max-width: calc(var(--container) + 48px); margin: 0 auto; padding: 0 24px; }
.px__body { padding-top: 24px; padding-bottom: var(--sec-y); }
.px__card { padding: 32px; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-card); }
.px__card--main { box-shadow: var(--sh-main); }
.px__h2 { font-size: 20px; line-height: 28px; font-weight: 600; letter-spacing: -0.01em; color: var(--ink-h1); }
.px__meta { font-size: 13px; line-height: 18px; color: var(--muted); }

.px-dark .chg { color: rgba(255,255,255,.5); }
.px-dark .chg.is-up { color: var(--up-on-dark); }
.px-dark .chg.is-down { color: var(--down-on-dark); }

/* Title bar with section tabs */
.px-top { position: relative; isolation: isolate; overflow: hidden; background: linear-gradient(180deg, #f8f9fb 0%, #fff 100%); border-bottom: 1px solid var(--line); }
.px-top::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(rgba(16,24,40,.05) 1px, transparent 1px) 0 0 / 32px 32px, linear-gradient(90deg, rgba(16,24,40,.05) 1px, transparent 1px) 0 0 / 32px 32px; -webkit-mask: radial-gradient(ellipse 50% 140% at 88% 50%, #000 0%, transparent 70%); mask: radial-gradient(ellipse 50% 140% at 88% 50%, #000 0%, transparent 70%); }
.px-top__wrap { padding-top: 20px; padding-bottom: 24px; }
.px-top__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; margin-top: 14px; }
.px-top__title { font-size: 32px; line-height: 40px; font-weight: 700; letter-spacing: -0.03em; color: var(--ink-h1); }
.px-tabs { display: inline-flex; gap: 4px; padding: 4px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-ctl); box-shadow: 0 1px 2px rgba(16,24,40,.04); }
.px-tabs a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 16px 0 12px; font-size: 14px; line-height: 20px; font-weight: 600; white-space: nowrap; color: var(--muted); border-radius: var(--r-sm); transition: color var(--ease), background var(--ease); }
.px-tabs svg { flex: none; width: 18px; height: 18px; }
.px-tabs a[aria-current="page"] { color: #fff; background: var(--g-ink); box-shadow: inset 0 1px 0 rgba(255,255,255,.14); }
.px-tabs__short { display: none; }
@media (hover: hover) and (pointer: fine) { .px-tabs a:not([aria-current]):hover { color: var(--ink); background: var(--board); } }

/* Working area: form + dark panel */
.px-term { display: grid; grid-template-columns: minmax(0, 1fr) 420px; align-items: start; gap: 24px; }
.px-bal { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; line-height: 18px; color: var(--muted); white-space: nowrap; }
.px-bal svg { flex: none; color: var(--t3); }
.px-bal b { font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.px-form__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-bottom: 28px; }
.px-badge { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 10px; font-size: 12px; line-height: 16px; font-weight: 600; color: var(--up-text); background: rgba(32,178,108,.1); border-radius: 100px; }
.px-badge i { width: 6px; height: 6px; background: var(--up); border-radius: 50%; box-shadow: 0 0 0 3px rgba(32,178,108,.2); }
.px-badge--muted { color: var(--muted); background: var(--board); }
.px-badge--muted i { background: var(--t3); box-shadow: none; }

.px-steps, .cv-how__list { margin: 0; padding: 0; list-style: none; }
.px-steps { display: grid; }
.px-step { position: relative; display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 16px; padding-bottom: 28px; }
.px-step:last-child { padding-bottom: 0; }
.px-step:not(:last-child)::before { content: ""; position: absolute; left: 15.5px; top: 40px; bottom: 8px; width: 1px; background: var(--line); }
.px-step__num { display: grid; place-items: center; width: 32px; height: 32px; font-size: 14px; line-height: 1; font-weight: 700; color: #fff; background: var(--g-ink); border-radius: 50%; font-variant-numeric: tabular-nums; }
.px-step__body { min-width: 0; }
.px-step__title { margin: 4px 0 12px; font-size: 16px; line-height: 24px; font-weight: 600; color: var(--ink-h1); }

.px-rub { display: grid; place-items: center; flex: none; width: 28px; height: 28px; font-size: 15px; line-height: 1; font-style: normal; font-weight: 700; color: #fff; background: var(--g-ink); border-radius: 50%; }
.px-field { display: flex; align-items: center; gap: 10px; padding: 6px 12px 6px 6px; border: 1px solid var(--line); border-radius: var(--r-ctl); }
.px-field b { font-size: 15px; line-height: 20px; font-weight: 700; }
.px-field span { min-width: 0; font-size: 14px; line-height: 20px; color: var(--muted); }
.px-pick { margin-bottom: 0; }
.pick-dark .trade__asset-btn { transition: border-color var(--ease), box-shadow var(--ease), background-color var(--ease), color var(--ease); }
.pick-dark .trade__asset-btn[aria-expanded="true"] { color: #fff; background: #111216; border-color: #111216; box-shadow: 0 8px 20px -10px rgba(0,0,0,.45); }
.pick-dark .trade__asset-btn[aria-expanded="true"] > span:not(.px-mpick__cur), .pick-dark .trade__asset-btn[aria-expanded="true"] .trade__asset-chev { color: rgba(255,255,255,.55); }
.pick-dark .trade__asset-btn[aria-expanded="true"] img, .pick-dark .trade__asset-pop img { background: none; }
.pick-dark .trade__asset-pop, .pick-dark > .trade__asset-list { color: #fff; background: var(--g-glass); -webkit-backdrop-filter: saturate(160%) blur(20px); backdrop-filter: saturate(160%) blur(20px); border: 0; border-radius: 12px; box-shadow: 0 18px 36px rgba(0,0,0,.32); }
.pick-dark .trade__asset-pop { padding: 8px; }
.pick-dark > .trade__asset-list { gap: 2px; padding: 6px; }
.pick-dark .trade__asset-search { height: 34px; padding: 0 10px; color: rgba(255,255,255,.45); background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.08); border-radius: 10px; }
.pick-dark .trade__asset-search:focus-within { border-color: rgba(255,255,255,.32); box-shadow: none; }
.pick-dark .trade__asset-search svg { width: 16px; height: 16px; }
.pick-dark .trade__asset-search input { font-size: 13px; color: #fff; }
.pick-dark .trade__asset-search input::placeholder { color: rgba(255,255,255,.4); }
.pick-dark .trade__asset-search input::-webkit-search-cancel-button { filter: invert(1) grayscale(1); opacity: .5; }
.pick-dark .trade__asset-pop .trade__asset-list { gap: 0; max-height: 288px; margin: 6px -4px 0 0; padding: 0 4px 0 0; }
.pick-dark .trade__asset-opt:hover, .pick-dark .trade__asset-opt:focus-visible { background: rgba(255,255,255,.06); }
.pick-dark .trade__asset-opt:focus-visible { box-shadow: inset 0 0 0 2px rgba(255,255,255,.5); }
.pick-dark .trade__asset-opt > svg { color: #fff; }
.pick-dark .trade__asset-pop .trade__asset-opt { gap: 10px; height: 36px; padding: 0 10px; }
.pick-dark .trade__asset-pop .trade__asset-opt img { width: 20px; height: 20px; }
.pick-dark .trade__asset-pop .trade__asset-opt b { font-size: 13px; line-height: 18px; font-weight: 600; color: #fff; }
.pick-dark .trade__asset-pop .trade__asset-opt span { font-size: 12px; line-height: 18px; font-weight: 500; color: rgba(255,255,255,.5); }
.pick-dark .trade__asset-empty { color: rgba(255,255,255,.5); }
.pick-dark [aria-expanded="true"] .px-method__ico, .pick-dark .trade__asset-list .px-method__ico { color: #fff; background: var(--ico-dark-bg); border-color: var(--ico-dark-line); box-shadow: none; }
.pick-dark .trade__asset-list .px-method__ico svg { color: #fff; }
.pick-dark [aria-expanded="true"] .px-method__text small, .pick-dark .trade__asset-list .px-method__text small { color: rgba(255,255,255,.55); }
.pick-dark [aria-expanded="true"] .px-method__fee, .pick-dark .trade__asset-list .px-method__fee { color: #fff; background: rgba(255,255,255,.1); }
.px-mpick { position: relative; }
.px-mpick__btn { gap: 12px; padding: 10px 14px 10px 10px; border-radius: var(--r-ctl); }
.px-mpick__cur, .px-mpick__opt { display: flex; flex: 1; align-items: center; gap: 12px; min-width: 0; }
.px-mpick__opt { padding: 8px; }
.px-mpick__opt .px-method__ico svg { color: var(--ink); visibility: visible; }
.px-method__ico, .px-lock__ico { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: var(--r-ctl); }
.px-method__text { display: grid; flex: 1; min-width: 0; gap: 2px; }
.px-method__text b { font-size: 15px; line-height: 20px; font-weight: 600; }
.px-method__text small { font-size: 13px; line-height: 18px; color: var(--muted); }
.px-method__ico--sbp { background: #fff; }
.px-method__fee { flex: none; padding: 3px 10px; font-size: 12px; line-height: 16px; font-weight: 600; color: var(--ink); background: var(--board); border-radius: 100px; white-space: nowrap; font-variant-numeric: tabular-nums; }

[data-rub-pane][hidden] { display: none; }
.px-any { display: flex; align-items: flex-start; gap: 14px; padding: 16px 18px; background: var(--board); border-radius: var(--r-panel); }
.px-any__ico { display: grid; place-items: center; flex: none; width: 40px; height: 40px; font-size: 18px; line-height: 1; font-weight: 700; color: #fff; background: var(--g-ink); border-radius: var(--r-ctl); }
.px-any p { display: grid; gap: 2px; font-size: 14px; line-height: 21px; color: var(--muted); }
.px-any b { font-size: 16px; line-height: 22px; font-weight: 600; color: var(--ink-h1); }

.px-amount { display: flex; align-items: center; gap: 12px; padding: 12px 18px; background: var(--board); border: 1px solid transparent; border-radius: var(--r-panel); transition: border-color var(--ease), background var(--ease), box-shadow var(--ease); }
.px-amount:has(input:focus) { background: #fff; border-color: var(--ink); box-shadow: var(--ring); }
.px-amount__input { flex: 1; min-width: 0; padding: 0; font: inherit; font-size: 32px; line-height: 42px; font-weight: 600; letter-spacing: -0.02em; color: var(--ink); background: none; border: 0; outline: none; font-variant-numeric: tabular-nums; }
.px-amount__cur { font-size: 24px; line-height: 32px; font-weight: 600; color: var(--muted); }
.px-amount-row { display: flex; gap: 12px; }
.px-amount-row .px-amount { flex: 1; min-width: 0; }
.px-amount__pay { flex: none; height: auto; min-height: 56px; padding: 0 32px; border-radius: var(--r-panel); }
.px-amount__pay:disabled { opacity: .4; cursor: not-allowed; }
.px-quick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.px-quick button { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; font-size: 13px; line-height: 18px; font-weight: 600; color: var(--ink); background: #fff; border: 1px solid var(--line); border-radius: 100px; font-variant-numeric: tabular-nums; transition: border-color var(--ease), background var(--ease); }
.px-quick button[aria-pressed="true"] { background: var(--board); border-color: var(--ink); }
@media (hover: hover) and (pointer: fine) { .px-quick button:hover { border-color: var(--line-strong); } }

.px-nets { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; }
.px-net { position: relative; display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-ctl); cursor: pointer; transition: border-color var(--ease), box-shadow var(--ease); }
.px-net input { position: absolute; opacity: 0; pointer-events: none; }
.px-net__text { display: grid; flex: 1; min-width: 0; }
.px-net__text b { font-size: 15px; line-height: 20px; font-weight: 700; }
.px-net__text small { font-size: 13px; line-height: 18px; color: var(--muted); }
.px-net__dot { flex: none; width: 18px; height: 18px; border: 1.5px solid var(--line-strong); border-radius: 50%; transition: border var(--ease); }
.px-net:has(input:checked) { border-color: var(--ink); box-shadow: var(--ring); }
.px-net:has(input:checked) .px-net__dot { border: 5px solid var(--ink); }
.px-net:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .px-net:hover { border-color: var(--line-strong); } }
.px-notes { display: grid; gap: 8px; padding: 16px 20px; background: var(--warn-bg); border: 1px solid var(--warn-line); border-radius: var(--r-ctl); }
.px-notes li { position: relative; padding-left: 16px; font-size: 14px; line-height: 21px; color: var(--text-2); }
.px-notes li::before { content: ""; position: absolute; left: 0; top: 8px; width: 5px; height: 5px; background: #c98a1b; border-radius: 50%; }
.px-notes b { font-weight: 600; color: var(--ink-h1); }

/* Dark terminal panel */
.px-dark { position: sticky; top: calc(var(--hd-h) + 24px); isolation: isolate; overflow: hidden; padding: 24px; color: #fff; background: var(--g-dark); border-radius: var(--r-card); box-shadow: var(--sh-dark); }
.px-dark::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(circle at 100% 0%, rgba(255,255,255,.14), transparent 45%), linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 24px 24px, linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 24px 24px; -webkit-mask: radial-gradient(ellipse 90% 60% at 100% 0%, #000, transparent 75%); mask: radial-gradient(ellipse 90% 60% at 100% 0%, #000, transparent 75%); }
.px-dark__head { display: flex; align-items: center; gap: 12px; }
.px-dark__head h2 { flex: 1; font-size: 20px; line-height: 28px; font-weight: 600; letter-spacing: -0.01em; }
.px-dark__head img { flex: none; border-radius: 50%; }
.px-dark__head > span:not(.px-dark__chip) { display: grid; flex: 1; min-width: 0; }
.px-dark__head b { font-size: 16px; line-height: 22px; font-weight: 600; }
.px-dark__head small { font-size: 12px; line-height: 16px; color: rgba(255,255,255,.55); }
.px-dark__chip { flex: none; padding: 4px 10px; font-size: 12px; line-height: 16px; font-weight: 700; color: rgba(255,255,255,.8); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.1); border-radius: 100px; }
.px-dark__rows { margin: 16px 0 0; }
.px-dark__rows div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 11px 0; font-size: 14px; line-height: 20px; border-bottom: 1px solid rgba(255,255,255,.08); }
.px-dark__rows div:last-child { border-bottom: 0; padding-bottom: 0; }
.px-dark__rows dt { color: rgba(255,255,255,.55); }
.px-dark__rows dd { margin: 0; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.px-dark__rows .is-total dd { font-size: 20px; line-height: 26px; }
.px-inf { font-size: 24px; line-height: 20px; font-weight: 500; }
.px-dark__rows .is-total dd.is-text { font-size: 16px; line-height: 22px; white-space: nowrap; }
.px-dark__note { display: flex; align-items: flex-start; gap: 8px; margin-top: 16px; font-size: 12px; line-height: 18px; color: rgba(255,255,255,.6); }
.px-dark__note svg { flex: none; margin-top: 1px; color: rgba(255,255,255,.8); }
.px-dark .sk { background: linear-gradient(90deg, rgba(255,255,255,.04), rgba(255,255,255,.1), rgba(255,255,255,.04)); background-size: 200% 100%; }

.px-lock { display: grid; overflow: hidden; border: 1px solid var(--line); border-radius: var(--r-panel); }
.px-lock > * { grid-area: 1 / 1; }
.px-lock__addr, .px-lock .px-req, .px-lock .px-sbp { filter: blur(3px); opacity: .6; user-select: none; }
.px-lock__lines i { display: block; width: 150px; max-width: 40vw; height: 10px; background: #d5dae0; border-radius: 5px; }
.px-lock__addr { display: flex; align-items: center; gap: 20px; margin: 0; padding: 20px; }
.px-req { padding: 16px 20px 10px; }
.px-req__bank { position: relative; display: grid; gap: 6px; }
.px-req__label { font-size: 12px; line-height: 16px; color: rgba(255,255,255,.55); }
.px-req__bank-btn { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; height: 40px; padding: 0 12px; font: inherit; font-size: 14px; line-height: 20px; font-weight: 600; color: #fff; text-align: left; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 10px; cursor: pointer; transition: border-color var(--ease); }
.px-req__bank-btn:hover { border-color: rgba(255,255,255,.24); }
.px-req__bank-btn:focus-visible { outline: 2px solid rgba(255,255,255,.6); outline-offset: 2px; }
.px-req__bank-btn .is-empty { font-weight: 500; color: rgba(255,255,255,.55); }
.px-req__bank-btn svg { flex: none; color: rgba(255,255,255,.55); transition: transform var(--ease); }
.px-req__bank-btn[aria-expanded="true"] svg { transform: rotate(180deg); }
.px-req__opt { padding: 8px 10px; }
.px-req__opt .px-method__text b { font-size: 14px; color: #fff; }
.px-req__opt .px-method__text small { font-size: 12px; }
.px-req__rows { margin: 12px 0 0; }
.px-req__rows > div { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 6px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.px-req__rows > div:last-child { border-bottom: 0; }
.px-req__rows dt { flex: none; font-size: 13px; line-height: 20px; color: rgba(255,255,255,.55); }
.px-req__rows dd { display: flex; align-items: center; gap: 4px; min-width: 0; margin: 0 -6px 0 0; font-size: 14px; line-height: 20px; font-weight: 600; color: #fff; text-align: right; font-variant-numeric: tabular-nums; }
.px-req__rows > .px-req__wide { flex-direction: column; align-items: stretch; gap: 2px; }
.px-req__wide dd { align-items: flex-start; justify-content: space-between; font-size: 13px; line-height: 19px; font-weight: 500; text-align: left; }
.px-req .ab-copy, .px-sbp .ab-copy { width: 28px; height: 28px; color: rgba(255,255,255,.5); }
@media (hover: hover) and (pointer: fine) { .px-req .ab-copy:hover, .px-sbp .ab-copy:hover { color: #fff; background: rgba(255,255,255,.08); } }
.px-sbp { padding: 20px; }
.px-sbp[hidden], .px-sbp__pay[hidden] { display: none; }
.px-sbp__idle { padding: 8px 0; font-size: 13px; line-height: 20px; text-align: center; color: rgba(255,255,255,.6); }
.px-sbp__pay { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 16px; }
.px-sbp[data-sbp-state="expired"] .px-qr, .px-sbp[data-sbp-state="expired"] .px-sbp__link { opacity: .3; }
.px-sbp__side { display: grid; gap: 8px; }
.px-sbp__timer { display: inline-flex; align-items: center; gap: 6px; justify-self: start; padding: 4px 10px; font-size: 12px; line-height: 16px; color: rgba(255,255,255,.7); background: rgba(255,255,255,.08); border-radius: 999px; }
.px-sbp__timer b { font-weight: 600; color: #fff; font-variant-numeric: tabular-nums; }
.px-sbp__side p { font-size: 12px; line-height: 18px; color: rgba(255,255,255,.55); }
.px-sbp__link { grid-column: 1 / -1; display: flex; align-items: center; gap: 2px; height: 40px; padding: 0 4px 0 12px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 10px; }
.px-sbp__link > span { flex: 1; min-width: 0; overflow: hidden; font-size: 13px; line-height: 20px; color: rgba(255,255,255,.8); white-space: nowrap; text-overflow: ellipsis; }
.px-qr { flex: none; width: 112px; height: 112px; background: repeating-conic-gradient(var(--dark) 0 25%, #fff 0 50%) 0 0 / 16px 16px; border: 8px solid #fff; border-radius: 12px; }
.px-lock__lines { display: grid; flex: 1; gap: 8px; }
.px-lock__lines small { font-size: 12px; line-height: 16px; color: var(--muted); }
.px-lock__lines i { width: 100%; }
.px-lock__lines i:nth-of-type(2) { width: 60%; }
.px-lock__lines i:nth-of-type(3) { width: 30%; }
.px-lock__over { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 24px 20px; text-align: center; }
.px-lock__over b { font-size: 16px; line-height: 24px; font-weight: 600; }
.px-lock__over p { max-width: 320px; font-size: 13px; line-height: 19px; }
.px-lock__btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 8px; }
.px-lock__btns .btn, .px-empty .btn { height: 40px; padding: 0 20px; font-size: 15px; }
.px-lock--dark { margin-top: 20px; background: rgba(255,255,255,.03); border-color: rgba(255,255,255,.1); }
.px-lock--dark .px-lock__lines small { color: rgba(255,255,255,.6); }
.px-lock--dark .px-lock__lines i { background: rgba(255,255,255,.22); }
.px-lock--dark .px-lock__over { background: rgba(12,13,16,.62); }
.px-lock--dark .px-lock__over b { color: #fff; }
.px-lock--dark .px-lock__over p { color: rgba(255,255,255,.64); }

/* Below the working area */
.px-hist { margin-top: 24px; }
.px-hist__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px; }
.px-empty { display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 24px 0 4px; font-size: 14px; line-height: 20px; text-align: center; color: var(--muted); }
.px-empty[hidden] { display: none; }
.px-empty__btn { height: 40px; padding: 0 20px; font-size: 14px; }
.px-hist__all { display: inline-flex; align-items: center; gap: 4px; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink); }
.px-hist__all svg { transition: transform var(--ease); }
@media (hover: hover) and (pointer: fine) { .px-hist__all:hover svg { transform: translateX(2px); } }
.px-hist__scroll { margin-top: 16px; overflow-x: auto; scrollbar-width: none; }
.px-hist__scroll::-webkit-scrollbar { display: none; }
.px-hist__cols { display: grid; grid-template-columns: repeat(var(--cols), minmax(88px, 1fr)); gap: 16px; min-width: calc(var(--cols) * 104px); padding: 10px 16px; font-size: 13px; line-height: 18px; font-weight: 500; color: var(--muted); white-space: nowrap; background: var(--board); border-radius: var(--r-sm); }
.px-hist__cols span:last-child { text-align: right; }
.px-sec { margin-top: 64px; }
.px-sec__title, .px-plat__title, .cv-how__title { font-size: 32px; line-height: 40px; font-weight: 700; letter-spacing: -0.03em; color: var(--ink-h1); text-wrap: balance; }
.px-sec__sub { max-width: 720px; margin-top: 8px; font-size: 16px; line-height: 24px; color: var(--muted); }
.px-sec + .px-below { margin-top: 64px; }
.px-bento { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr); gap: 16px; margin-top: 24px; }
.px-bento__card { position: relative; isolation: isolate; display: flex; flex-direction: column; gap: 20px; padding: 28px; overflow: hidden; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-card); }
.px-bento__ico { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: var(--r-ctl); }
.px-bento__metric { display: block; margin-bottom: 6px; font-size: 40px; line-height: 44px; font-weight: 700; letter-spacing: -0.03em; color: var(--ink-h1); font-variant-numeric: tabular-nums; white-space: nowrap; }
.px-bento h3 { font-size: 16px; line-height: 22px; font-weight: 600; color: var(--ink-h1); }
.px-bento p { margin-top: 6px; font-size: 14px; line-height: 21px; color: var(--muted); }
.px-bento__card--hero { grid-row: span 2; min-height: 380px; color: #fff; background: var(--g-dark); box-shadow: var(--sh-dark); }
.px-bento__card--hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px); background-size: 32px 32px; -webkit-mask-image: radial-gradient(120% 90% at 100% 0%, #000 0%, transparent 65%); mask-image: radial-gradient(120% 90% at 100% 0%, #000 0%, transparent 65%); }
.px-bento__card--hero::after { content: ""; position: absolute; top: -140px; right: -120px; z-index: -1; width: 360px; height: 360px; background: radial-gradient(circle, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 65%); }
.px-bento__card--hero .px-bento__metric { margin-top: auto; font-size: 72px; line-height: 76px; letter-spacing: -0.045em; background: linear-gradient(180deg, #fff 30%, rgba(255,255,255,.55) 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.px-bento__card--hero h3 { font-size: 18px; line-height: 26px; color: #fff; }
.px-bento__card--hero p { color: rgba(255,255,255,.62); }
.px-bento__card--hero .px-bento__body { margin-top: auto; }
.px-bento__card--wide { grid-column: span 2; flex-direction: row; align-items: center; }
.px-bento__coins { display: flex; padding-left: 8px; }
.px-bento__coins img { width: 36px; height: 36px; margin-left: -8px; border-radius: 50%; background: #111216; box-shadow: 0 0 0 3px #15161b; }
.px-bento__flow { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; line-height: 18px; font-weight: 600; }
.px-bento__flow span { padding: 6px 12px; color: #fff; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); border-radius: 100px; }
.px-bento__flow span:last-child { color: #3ed08b; background: rgba(32,178,108,.14); border-color: rgba(32,178,108,.35); }
.px-bento__flow i { width: 16px; height: 1px; background: linear-gradient(90deg, rgba(255,255,255,.15), rgba(255,255,255,.6)); }
.px-plat { position: relative; isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 440px); align-items: center; gap: 40px; padding: 48px; overflow: hidden; color: #fff; background: var(--g-dark); border-radius: var(--r-card); box-shadow: var(--sh-dark); }
.px-plat::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 40px 40px; -webkit-mask-image: radial-gradient(70% 90% at 78% 50%, #000 0%, transparent 70%); mask-image: radial-gradient(70% 90% at 78% 50%, #000 0%, transparent 70%); }
.px-plat__title { color: #fff; }
.px-plat__lead { max-width: 520px; margin-top: 12px; font-size: 16px; line-height: 24px; color: rgba(255,255,255,.62); }
.px-plat__facts { display: grid; gap: 14px; margin-top: 28px; }
.px-plat__facts li { display: flex; align-items: center; gap: 14px; }
.px-plat__ico { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: var(--r-ctl); }
.px-plat__facts li > span:last-child { display: flex; flex-direction: column; gap: 2px; font-size: 13px; line-height: 18px; color: rgba(255,255,255,.55); }
.px-plat__facts b { font-size: 15px; line-height: 20px; font-weight: 600; color: #fff; }
.px-plat__stats { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 32px; margin-top: 32px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.1); }
.px-plat__stats dt { font-size: 12px; line-height: 16px; color: rgba(255,255,255,.55); }
.px-plat__stats dd { margin: 4px 0 0; font-size: 28px; line-height: 34px; font-weight: 700; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.px-orbit { position: relative; justify-self: center; width: 420px; height: 420px; --d1: 220px; --d2: 380px; }
.px-orbit::before { content: ""; position: absolute; inset: 20%; z-index: -1; background: radial-gradient(circle, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 70%); }
.px-orbit__ring { position: absolute; left: 50%; top: 50%; width: var(--d); height: var(--d); margin: calc(var(--d) / -2) 0 0 calc(var(--d) / -2); border: 1px solid rgba(255,255,255,.12); border-radius: 50%; animation: px-orbit var(--t) linear infinite; }
.px-orbit__ring--1 { --d: var(--d1); --t: 60s; }
.px-orbit__ring--2 { --d: var(--d2); --t: 90s; border-style: dashed; border-color: rgba(255,255,255,.1); animation-direction: reverse; }
.px-orbit__sat { position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; margin: -22px 0 0 -22px; transform: rotate(var(--a)) translateY(calc(var(--d) / -2)) rotate(calc(var(--a) * -1)); }
.px-orbit__sat img { display: block; width: 44px; height: 44px; padding: 2px; background: #1a1b21; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; box-shadow: 0 8px 20px rgba(0,0,0,.4); animation: px-orbit var(--t) linear infinite reverse; }
.px-orbit__ring--2 .px-orbit__sat img { animation-direction: normal; }
.px-orbit__core { position: absolute; left: 50%; top: 50%; display: grid; place-items: center; width: 88px; height: 88px; margin: -44px 0 0 -44px; background: linear-gradient(180deg, #2a2b31 0%, #0c0d10 100%); border: 1px solid rgba(255,255,255,.16); border-radius: 26px; box-shadow: 0 0 0 10px rgba(255,255,255,.03), 0 0 48px rgba(255,255,255,.16); }
@keyframes px-orbit { to { rotate: 360deg; } }
.px-below { display: grid; grid-template-columns: minmax(0, 1fr) 360px; align-items: start; gap: 24px; margin-top: 24px; }
.px-faq .px__h2 { margin-bottom: 4px; }
.px-faq__item { border-bottom: 1px solid var(--line); }
.px-faq__item:last-child { border-bottom: 0; }
.px-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 0; font-size: 15px; line-height: 22px; font-weight: 600; color: var(--ink-h1); cursor: pointer; list-style: none; }
.px-faq__item summary::-webkit-details-marker { display: none; }
.px-faq__item summary svg { flex: none; color: var(--muted); transition: transform var(--ease); }
.px-faq__item[open] summary svg { transform: rotate(180deg); }
.px-faq__item p { padding: 0 32px 16px 0; font-size: 14px; line-height: 22px; color: var(--text-2); }
.px-help { position: sticky; top: calc(var(--hd-h) + 24px); }
.px-help p { margin-top: 8px; font-size: 14px; line-height: 21px; color: var(--muted); }
.px-help .px-help__mail { display: flex; align-items: center; gap: 8px; margin-top: 12px; font-size: 15px; line-height: 20px; font-weight: 600; color: var(--ink); }
.px-help__mail > svg { flex: none; }
.px-help__mail > span { min-width: 0; overflow-wrap: anywhere; }
.px-help__mail .ab-copy { margin: -6px 0; transition: background var(--ease), color var(--ease), opacity var(--ease); }
@media (hover: hover) and (pointer: fine) {
  .px-help__mail .ab-copy { opacity: 0; }
  .px-help__mail:hover .ab-copy, .px-help__mail .ab-copy:focus-visible, .px-help__mail .ab-copy.is-done { opacity: 1; }
}

/* Convert widget */
.cv { padding: 28px; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-main); }
.cv__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.cv__title { font-size: 20px; line-height: 28px; font-weight: 600; letter-spacing: -0.01em; color: var(--ink-h1); }
.cv__tabs { margin-bottom: 16px; }
@media (hover: hover) and (pointer: fine) { .cv__tabs .trade__tab[aria-selected="false"]:hover { color: var(--ink); } }
.cv__box { padding: 16px 18px; background: var(--board); border: 1px solid transparent; border-radius: var(--r-panel); transition: border-color var(--ease), background var(--ease); }
.cv__box:has(.cv__input:focus) { background: #fff; border-color: var(--ink); }
.cv__label { display: block; font-size: 13px; line-height: 18px; color: var(--muted); }
.cv__label-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cv__row { display: flex; align-items: center; gap: 12px; margin-top: 8px; }
.cv__input, .cv__out { flex: 1; min-width: 0; padding: 0; overflow: hidden; font: inherit; font-size: 34px; line-height: 44px; font-weight: 600; letter-spacing: -0.02em; color: var(--ink); text-overflow: ellipsis; white-space: nowrap; background: none; border: 0; outline: none; font-variant-numeric: tabular-nums; }
.cv__out.is-empty { color: var(--t3); }
.cv__slot { flex: none; }
.cv__pick { margin: 0; }
.cv__pick .trade__asset-btn { width: auto; gap: 8px; padding: 4px 10px 4px 4px; border-radius: 100px; }
.cv__pick .trade__asset-pop { left: auto; right: 0; width: 300px; max-width: calc(100vw - 72px); }
.cv__rub { display: inline-flex; align-items: center; gap: 8px; padding: 4px 14px 4px 4px; background: #fff; border: 1px solid var(--line); border-radius: 100px; }
.cv__rub b { font-size: 15px; line-height: 20px; font-weight: 700; }
.cv__flip { position: relative; z-index: 1; display: grid; place-items: center; width: 44px; height: 44px; margin: -12px auto; padding: 0; color: #fff; background: var(--g-ink); border: 0; border-radius: 50%; box-shadow: 0 0 0 5px #fff; }
.cv__flip svg { transition: transform var(--ease); }
@media (hover: hover) and (pointer: fine) { .cv__flip:hover svg { transform: rotate(180deg); } }
.cv__rows { display: grid; gap: 8px; margin: 18px 0 0; padding: 0 4px; }
.cv__rows div { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; line-height: 20px; }
.cv__rows dt { color: var(--muted); }
.cv__rows dd { margin: 0; font-weight: 600; color: var(--ink); text-align: right; font-variant-numeric: tabular-nums; }
.cv__btn { width: 100%; margin-top: 20px; gap: 12px; }
.cv__timer { position: relative; display: grid; place-items: center; flex: none; width: 28px; height: 28px; }
.cv__timer svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); fill: none; stroke-width: 2.5; }
.cv__timer circle { stroke: rgba(255,255,255,.22); stroke-dasharray: 100; }
.cv__timer .cv__timer-bar { stroke: #fff; stroke-linecap: round; transition: stroke-dashoffset 1s linear; }
.cv__timer b { font-size: 11px; line-height: 1; font-weight: 700; font-variant-numeric: tabular-nums; }

/* Convert market panel */
.cvm__price { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-top: 20px; }
.cvm__price small { flex-basis: 100%; font-size: 13px; line-height: 18px; color: rgba(255,255,255,.6); }
.cvm__price strong { font-size: 30px; line-height: 38px; font-weight: 700; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.px-dark .chg--pill { color: rgba(255,255,255,.6); background: rgba(255,255,255,.06); }
.px-dark .chg--pill.is-up { color: var(--up-on-dark); background: rgba(32,178,108,.14); }
.px-dark .chg--pill.is-down { color: var(--down-on-dark); background: rgba(239,69,74,.14); }
.cvm__chart { height: 112px; margin: 12px -24px 0; }
.cvm__chart svg { width: 100%; height: 100%; }
.cvm__vol { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; padding-top: 14px; font-size: 13px; line-height: 18px; color: rgba(255,255,255,.6); border-top: 1px solid rgba(255,255,255,.08); }
.cvm__vol b { font-size: 14px; line-height: 20px; font-weight: 600; color: #fff; font-variant-numeric: tabular-nums; }

.cv-how { margin-top: 64px; }
.cv-how__title { margin-bottom: 24px; }
.cv-how__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.cv-how__list li { padding: 28px; background: var(--card-bg); border: 1px solid transparent; border-radius: var(--r-card); box-shadow: var(--sh-card); }
.cv-how__list h3 { margin-top: 20px; font-size: 18px; line-height: 26px; font-weight: 600; color: var(--ink-h1); }
.cv-how__list p { margin-top: 8px; font-size: 14px; line-height: 22px; color: var(--muted); }
.cv-how__list a, .px-faq__item p a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; }

@media (max-width: 1080px) {
  .px-term, .px-below { grid-template-columns: minmax(0, 1fr); }
  .px-dark, .px-help { position: relative; top: auto; }
  .px-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .px-bento__card--hero { grid-row: auto; grid-column: span 2; min-height: 300px; }
  .px-plat { grid-template-columns: minmax(0, 1fr); }
  .px-orbit { width: 340px; height: 340px; --d1: 180px; --d2: 310px; }
}
@media (max-width: 767px) {
  .px__wrap { padding: 0 16px; }
  .px__body { padding-top: 16px; padding-bottom: var(--sec-y); }
  .px-top__wrap { padding-top: 14px; padding-bottom: 16px; }
  .px-top__row { gap: 12px; margin-top: 10px; }
  .px-top__title { font-size: 26px; line-height: 34px; }
  .px-tabs { display: flex; width: 100%; }
  .px-tabs a { flex: 1; gap: 6px; padding: 0 8px; }
  .px-tabs__full { display: none; }
  .px-tabs__short { display: inline; }
  .px__card { padding: 20px; }
  .px-form__head { margin-bottom: 20px; }
  .px-step { grid-template-columns: 28px minmax(0, 1fr); gap: 12px; padding-bottom: 24px; }
  .px-step:not(:last-child)::before { left: 13.5px; top: 36px; }
  .px-step__num { width: 28px; height: 28px; font-size: 13px; }
  .px-step__title { margin-top: 2px; }
  .px-mpick__btn { padding: 8px 12px 8px 8px; }
  .px-mpick__cur, .px-mpick__opt { display: grid; grid-template-columns: 40px minmax(0, 1fr); align-items: center; gap: 4px 10px; }
  .px-mpick__opt { grid-template-columns: 40px minmax(0, 1fr) 18px; }
  .px-mpick .px-method__ico { grid-row: 1 / 3; }
  .px-mpick .px-method__fee { grid-column: 2; grid-row: 2; justify-self: start; }
  .px-mpick__opt > svg { grid-column: 3; grid-row: 1 / 3; }
  .px-dark__rows .is-total dd.is-text { font-size: 14px; line-height: 20px; }
  .px-amount { padding: 10px 14px; }
  .px-amount-row { flex-direction: column; }
  .px-amount__input { font-size: 26px; line-height: 36px; }
  .px-amount__cur { font-size: 20px; }
  .px-notes { padding: 14px 16px; }
  .px-dark { padding: 20px; }
  .px-qr { width: 84px; height: 84px; border-width: 6px; }
  .px-lock__addr { gap: 14px; padding: 16px; }
  .px-hist, .px-below { margin-top: 16px; }
  .px-below { gap: 16px; }
  .cv { padding: 18px; }
  .cv__box { padding: 14px 16px; }
  .cv__input, .cv__out { font-size: 26px; line-height: 36px; }
  .cvm__chart { margin: 8px -20px 0; height: 96px; }
  .cvm__price strong { font-size: 26px; line-height: 34px; }
  .cv-how { margin-top: 40px; }
  .cv-how__title { margin-bottom: 16px; }
  .cv-how__list { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .cv-how__list li { padding: 20px; }
  .cv-how__list h3 { margin-top: 14px; font-size: 17px; line-height: 24px; }
  .px-hist__scroll { -webkit-mask-image: linear-gradient(90deg, #000 80%, transparent); mask-image: linear-gradient(90deg, #000 80%, transparent); }
  .px-sec, .px-sec + .px-below { margin-top: 40px; }
  .px-sec__title, .px-plat__title, .cv-how__title { font-size: 24px; line-height: 32px; }
  .px-sec__sub { font-size: 15px; line-height: 22px; }
  .px-bento { grid-template-columns: minmax(0, 1fr); gap: 12px; margin-top: 16px; }
  .px-bento__card { gap: 16px; padding: 20px; }
  .px-bento__card--hero { grid-column: auto; min-height: 280px; }
  .px-bento__card--hero .px-bento__metric { font-size: 56px; line-height: 60px; }
  .px-bento__card--wide { grid-column: auto; align-items: flex-start; }
  .px-bento__metric { font-size: 32px; line-height: 36px; }
  .px-plat { gap: 8px; padding: 28px 20px 8px; }
  .px-plat__lead { font-size: 15px; line-height: 22px; }
  .px-plat__stats { gap: 20px; }
  .px-plat__stats dd { font-size: 22px; line-height: 28px; }
  .px-orbit { width: 300px; height: 300px; --d1: 150px; --d2: 270px; }
  .px-orbit__sat, .px-orbit__sat img { width: 36px; height: 36px; }
  .px-orbit__sat { margin: -18px 0 0 -18px; }
  .px-orbit__core { width: 68px; height: 68px; margin: -34px 0 0 -34px; border-radius: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .px-orbit__ring, .px-orbit__sat img { animation: none; }
  .px-tabs a, .px-quick button, .px-net, .px-net__dot, .px-amount, .px-faq__item summary svg, .px-hist__all svg, .cv__box, .cv__flip svg, .cv__timer .cv__timer-bar { transition: none; }
}

/* ============ Fees overview (/fees/) ============ */
.fe-sum { padding: 0; }
.fe-sum__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.fe-sum__list li { display: flex; align-items: flex-start; gap: 14px; padding: 24px; }
.fe-sum__list li + li { border-left: 1px solid var(--line); }
.fe-sum__ico { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: var(--r-ctl); }
.fe-sum__txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fe-sum__txt small { font-size: 13px; line-height: 20px; color: var(--muted); }
.fe-sum__txt b { font-size: 22px; line-height: 30px; font-weight: 700; letter-spacing: -0.02em; color: var(--ink-h1); font-variant-numeric: tabular-nums; }
.fe-sum__txt span { font-size: 13px; line-height: 20px; color: var(--text-2); }
.fe-panel { margin-top: 24px; scroll-margin-top: calc(var(--hd-h) + 24px); }
.fe-panel[hidden] { display: none; }
.fe-panel__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 24px; }
.fe-lead { margin-top: 4px; font-size: 14px; line-height: 22px; color: var(--text-2); }
.fe-search { width: 300px; }
.fe-scroll { margin-top: 20px; overflow-x: auto; }
.fe-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 14px; line-height: 20px; }
.fe-table th { padding: 10px 16px; font-size: 12px; line-height: 16px; font-weight: 600; text-align: left; white-space: nowrap; color: var(--muted); background: var(--board); }
.fe-table th:first-child { border-radius: var(--r-tile-sm) 0 0 var(--r-tile-sm); }
.fe-table th:last-child { border-radius: 0 var(--r-tile-sm) var(--r-tile-sm) 0; }
.fe-table td { padding: 16px; vertical-align: middle; color: var(--ink); border-bottom: 1px solid var(--line); }
.fe-table tbody tr:last-child td { border-bottom: 0; }
.fe-table tr[hidden] { display: none; }
.fe-val { font-weight: 600; white-space: nowrap; color: var(--ink-h1); font-variant-numeric: tabular-nums; }
.fe-val small { display: block; font-size: 12px; line-height: 16px; font-weight: 500; color: var(--muted); }
.fe-dim { color: var(--text-2); }
.fe-num { white-space: nowrap; font-variant-numeric: tabular-nums; }
.fe-table--crypto td { padding-top: 12px; padding-bottom: 12px; }
.fe-coin { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.fe-coin img { flex: none; border-radius: 50%; }
.fe-coin b { font-weight: 600; color: var(--ink-h1); }
.fe-coin span { color: var(--muted); }
.fe-net { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.fe-tag { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; font-size: 11px; line-height: 16px; font-weight: 600; color: var(--ink); background: var(--board); border-radius: 100px; }
.fe-empty { padding: 32px 16px; font-size: 14px; line-height: 22px; text-align: center; color: var(--muted); }
.fe-empty[hidden] { display: none; }
.fe-notes { display: flex; flex-direction: column; gap: 6px; margin: 20px 0 0; padding: 16px 20px 16px 36px; font-size: 13px; line-height: 20px; color: var(--text-2); list-style: disc; background: var(--board); border-radius: var(--r-ctl); }
.fe-notes li::marker { color: var(--muted); }
.fe-notes a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--line-strong); text-underline-offset: 3px; }
@media (max-width: 1080px) {
  .fe-sum__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fe-sum__list li + li { border-left: 0; }
  .fe-sum__list li:nth-child(even) { border-left: 1px solid var(--line); }
  .fe-sum__list li:nth-child(n + 3) { border-top: 1px solid var(--line); }
}
@media (max-width: 767px) {
  .fe-tabs { width: 100%; }
  .fe-tabs a { flex: 1; padding: 0 10px; }
  .fe-sum__list li { flex-direction: column; gap: 10px; padding: 16px; }
  .fe-sum__ico { width: 36px; height: 36px; }
  .fe-sum__txt b { font-size: 18px; line-height: 26px; }
  .fe-search { width: 100%; }
  .fe-table { min-width: 560px; }
  .fe-table--trade { min-width: 0; }
  .fe-table--crypto { min-width: 780px; }
  .fe-table th, .fe-table td { padding-left: 12px; padding-right: 12px; }
  .fe-notes { padding: 14px 16px 14px 32px; }
}

/* Markets overview (/markets/) */
.mk-asof { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; line-height: 20px; color: var(--muted); font-variant-numeric: tabular-nums; }
.mk-asof i { position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--up); }
.mk-asof i::after { content: ""; position: absolute; inset: -3px; border-radius: 50%; border: 1px solid var(--up); animation: status-ping 2.4s ease-out infinite; }
.mk-over { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.mk-card { display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 20px; }
.mk-card__title { display: flex; align-items: center; gap: 10px; font-size: 15px; line-height: 22px; font-weight: 600; color: var(--ink-h1); }
.mk-card__ico { display: grid; place-items: center; flex: none; width: 32px; height: 32px; color: var(--ink); background: var(--board); border-radius: var(--r-sm); }
.mk-card__ico--gainers { color: var(--up-text); background: rgba(32,178,108,.1); }
.mk-card__ico--losers { color: var(--down-text); background: rgba(239,69,74,.1); }
.mk-card__list { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; }
.mk-card__list .sk-row { padding: 15px 0; }
.mk-card__empty { padding: 9px 0; font-size: 13px; line-height: 20px; color: var(--muted); }
.mk-top { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; margin: 0 -8px; padding: 6px 8px; font-size: 13px; line-height: 20px; border-radius: var(--r-sm); transition: background var(--ease); }
.mk-top__pair { display: flex; align-items: center; gap: 10px; min-width: 0; }
.mk-top__pair img { flex: none; border-radius: 50%; }
.mk-top__name { display: flex; flex-direction: column; min-width: 0; }
.mk-top__name b { font-weight: 600; color: var(--ink-h1); white-space: nowrap; }
.mk-top__name small { font-size: 12px; font-weight: 500; color: var(--muted); }
.mk-top__price { font-size: 12px; line-height: 16px; white-space: nowrap; color: var(--muted); font-variant-numeric: tabular-nums; }
.mk-top__chg, .mk-top__vol { min-width: 64px; font-weight: 600; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.mk-top__vol { color: var(--ink); }
.mk-mood__body { display: flex; flex-direction: column; gap: 12px; flex: 1; justify-content: center; }
.mk-mood__counts { display: flex; justify-content: space-between; gap: 12px; font-size: 13px; line-height: 20px; color: var(--muted); }
.mk-mood__counts b { margin-right: 4px; font-size: 22px; line-height: 30px; font-weight: 700; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.mk-mood__counts .is-up b { color: var(--up-text); }
.mk-mood__counts .is-down b { color: var(--down-text); }
.mk-mood__bar { height: 8px; overflow: hidden; background: var(--down); border-radius: 100px; }
.mk-mood__bar i { display: block; width: 50%; height: 100%; background: var(--up); border-right: 2px solid #fff; transition: width .4s ease; }
.mk-mood__vol { display: flex; justify-content: space-between; gap: 12px; padding-top: 12px; font-size: 13px; line-height: 20px; color: var(--muted); border-top: 1px solid var(--line); }
.mk-mood__vol b { font-weight: 600; color: var(--ink-h1); white-space: nowrap; font-variant-numeric: tabular-nums; }
.mk-panel { margin-top: 24px; }
.mk-panel__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 24px; }
.mk-panel__tools { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.mk-seg { display: inline-flex; gap: 2px; padding: 3px; background: var(--board); border-radius: var(--r-ctl); }
.mk-seg button { height: 34px; padding: 0 14px; font: inherit; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--muted); background: none; border: 0; border-radius: var(--r-sm); cursor: pointer; transition: color var(--ease), background var(--ease); }
.mk-seg button[aria-pressed="true"] { color: var(--ink-h1); background: #fff; box-shadow: 0 1px 2px rgba(16,24,40,.08); }
.mk-search { width: 260px; }
.mk-table th { padding-top: 0; padding-bottom: 0; height: 40px; }
.mk-sort { display: inline-flex; align-items: center; gap: 4px; padding: 0; font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
.mk-sort svg { opacity: .45; }
th[aria-sort="ascending"] .mk-sort, th[aria-sort="descending"] .mk-sort { color: var(--ink-h1); }
th[aria-sort="ascending"] .mk-sort svg, th[aria-sort="descending"] .mk-sort svg { opacity: 1; }
.mk-table .mk-price, .mk-table .mk-chg, .mk-table .mk-vol { text-align: right; }
.mk-table .mk-num { width: 1%; padding-right: 4px; color: var(--muted); font-variant-numeric: tabular-nums; }
.mk-table td { padding-top: 12px; padding-bottom: 12px; }
.mk-table tbody tr { transition: background var(--ease); }
.mk-table .mk-sk td { padding: 18px 16px; }
.mk-pair { display: flex; align-items: center; gap: 8px; }
.mk-star { display: grid; place-items: center; flex: none; width: 32px; height: 32px; margin-left: -8px; padding: 0; color: var(--t3); background: none; border: 0; border-radius: var(--r-sm); cursor: pointer; transition: color var(--ease); }
.mk-star path { fill: none; stroke: currentColor; }
.mk-star[aria-pressed="true"] { color: #f7a600; }
.mk-star[aria-pressed="true"] path { fill: currentColor; }
.mk-pair__link { display: flex; align-items: center; gap: 10px; min-width: 0; }
.mk-pair__link img { flex: none; border-radius: 50%; }
.mk-pair__name { display: flex; flex-direction: column; min-width: 0; }
.mk-pair__name b { font-weight: 600; color: var(--ink-h1); white-space: nowrap; }
.mk-pair__name b small { font-size: 13px; font-weight: 500; color: var(--muted); }
.mk-pair__name > span { font-size: 12px; line-height: 16px; color: var(--muted); white-space: nowrap; }
.mk-price { font-weight: 600; }
.mk-chart { width: 136px; }
.mk-spark { display: block; width: 120px; height: 36px; }
.mk-act { width: 1%; text-align: right; }
.mk-acts { display: inline-flex; align-items: center; gap: 8px; }
.mk-more, .mk-trade { display: inline-flex; align-items: center; height: 32px; padding: 0 14px; font-size: 13px; line-height: 18px; font-weight: 600; white-space: nowrap; border-radius: 100px; transition: background var(--ease), border-color var(--ease), color var(--ease); }
.mk-more { color: var(--ink); border: 1px solid var(--line); }
.mk-trade { color: #fff; background: var(--g-ink); box-shadow: inset 0 1px 0 rgba(255,255,255,.14); }
.mk-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; }
.mk-foot[hidden], .mk-pager[hidden] { display: none; }
.mk-range { font-size: 13px; line-height: 20px; color: var(--muted); font-variant-numeric: tabular-nums; }
.mk-pager { display: flex; gap: 4px; }
.mk-pager__btn { display: grid; place-items: center; min-width: 36px; height: 36px; padding: 0 10px; font: inherit; font-size: 14px; font-weight: 600; color: var(--text-2); background: none; border: 1px solid transparent; border-radius: var(--r-sm); cursor: pointer; font-variant-numeric: tabular-nums; transition: background var(--ease), color var(--ease); }
.mk-pager__btn[aria-current="page"] { color: #fff; background: var(--g-ink); }
.mk-pager__btn:disabled { color: var(--t3); cursor: default; }
.mk-pager__arrow { border-color: var(--line); }
@media (hover: hover) and (pointer: fine) {
  .mk-top:hover { background: var(--board); }
  .mk-table tbody tr:not(.mk-sk):hover { background: var(--board); }
  .mk-seg button[aria-pressed="false"]:hover, .mk-sort:hover { color: var(--ink); }
  .mk-star:hover { color: #f7a600; }
  .mk-more:hover { background: var(--board); border-color: var(--line-strong); }
  .mk-trade:hover { background: var(--g-ink-hover); }
  .mk-pager__btn:not(:disabled):not([aria-current]):hover { color: var(--ink); background: var(--board); }
}
@media (max-width: 1080px) {
  .mk-over { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mk-table .mk-chart { display: none; }
}
@media (max-width: 767px) {
  .mk-over { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .mk-card { padding: 16px; }
  .mk-panel__head .px__h2 { width: 100%; }
  .mk-panel__tools { width: 100%; }
  .mk-search { width: 100%; }
  .mk-table { min-width: 0; }
  .mk-table .mk-vol, .mk-table .mk-act, .mk-table .mk-num { display: none; }
  .mk-table th, .mk-table td { padding-left: 6px; padding-right: 6px; }
  .mk-table td.mk-name { padding-left: 0; }
  .mk-table th.mk-name { padding-left: 12px; border-radius: var(--r-tile-sm) 0 0 var(--r-tile-sm); }
  .mk-table td.mk-chg { padding-right: 0; }
  .mk-table th.mk-chg { padding-right: 12px; border-radius: 0 var(--r-tile-sm) var(--r-tile-sm) 0; }
  .mk-foot { justify-content: center; }
  .mk-range { width: 100%; text-align: center; }
  .mk-pair__name > span, .mk-pair__name b small { display: none; }
  .mk-th-long { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .mk-pair { gap: 4px; }
  .mk-star { width: 28px; margin-left: -6px; }
  .mk-pair__link { gap: 8px; }
  .mk-pair__link img { width: 24px; height: 24px; }
  .mk-price { font-size: 13px; }
  .mk-chg .chg--pill { min-width: 0; padding: 2px 6px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .mk-asof i::after { animation: none; } .mk-mood__bar i { transition: none; } }

/* Crypto prices: catalog (/price/) and asset pages (/price/<slug>/) */
.pr-lead { max-width: 720px; margin-top: 8px; font-size: 15px; line-height: 24px; color: var(--text-2); }
.mk-panel--first { margin-top: 0; }
.pr-title { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.pr-title img { flex: none; border-radius: 50%; }
.pr-title span { font-size: 20px; line-height: 28px; font-weight: 600; letter-spacing: 0; color: var(--muted); }
.pr-cta { display: flex; gap: 8px; }
.pr-cta .btn { height: 44px; padding: 0 22px; font-size: 15px; }
.pr-grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; align-items: start; gap: 24px; }
.pr-quote__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; }
.pr-price { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.pr-price b { font-size: 36px; line-height: 44px; font-weight: 700; letter-spacing: -0.03em; color: var(--ink-h1); font-variant-numeric: tabular-nums; }
.pr-sub { margin-top: 4px; font-size: 14px; line-height: 22px; color: var(--muted); }
.pr-sub b { font-weight: 600; color: var(--text-2); font-variant-numeric: tabular-nums; }
.pr-price__chg { display: inline-flex; align-items: center; gap: 8px; }
.pr-price__chg small { font-size: 13px; line-height: 20px; color: var(--muted); }
.pr-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin-top: 20px; }
.mk-seg button:disabled { color: var(--line-strong); cursor: not-allowed; }
.pr-hl { display: flex; flex-wrap: wrap; gap: 4px 20px; font-size: 13px; line-height: 20px; color: var(--muted); }
.pr-hl b { margin-left: 4px; font-weight: 600; color: var(--ink-h1); white-space: nowrap; font-variant-numeric: tabular-nums; }
.pr-chart { position: relative; display: grid; align-items: center; height: 260px; margin-top: 12px; touch-action: pan-y; cursor: crosshair; }
.pr-chart .sk { height: 100%; border-radius: var(--r-ctl); }
.pr-svg { position: absolute; inset: 0; display: block; overflow: visible; }
.pr-svg__mark { font-size: 11px; font-weight: 600; fill: var(--muted); }
.pr-svg__guide { stroke: var(--line-strong); stroke-width: 1; stroke-dasharray: 3 3; }
.pr-svg__guide, .pr-svg__dot, .pr-tip { opacity: 0; transition: opacity var(--ease); pointer-events: none; }
.pr-chart.is-hover .pr-svg__guide, .pr-chart.is-hover .pr-svg__dot, .pr-chart.is-hover .pr-tip { opacity: 1; }
.pr-tip { position: absolute; top: 0; left: 0; display: flex; flex-direction: column; padding: 6px 10px; font-size: 12px; line-height: 16px; color: var(--muted); white-space: nowrap; background: #fff; border: 1px solid var(--line); border-radius: var(--r-sm); box-shadow: 0 8px 24px -12px rgba(16,24,40,.25); }
.pr-tip b { font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink-h1); font-variant-numeric: tabular-nums; }
.pr-axis { display: flex; justify-content: space-between; min-height: 18px; margin-top: 6px; font-size: 12px; line-height: 18px; color: var(--muted); font-variant-numeric: tabular-nums; }
.pr-chart__empty { text-align: center; font-size: 14px; color: var(--muted); }
.pr-dyn, .pr-about { margin-top: 24px; }
.pr-dyn .fe-lead { margin-top: 4px; }
.pr-dyn-table td { white-space: nowrap; }
.pr-about__body { display: flex; flex-direction: column; gap: 12px; max-width: 820px; margin-top: 12px; font-size: 15px; line-height: 24px; color: var(--text-2); }
.pr-disc { margin-top: 48px; padding-top: 24px; border-top: 1px solid var(--line); font-size: 12px; line-height: 18px; color: var(--muted); }
.pr-disc__title { margin-bottom: 8px; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--text-2); }
.pr-disc p + p { margin-top: 8px; }
.pr-disc a { color: var(--text-2); text-decoration: underline; text-underline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .pr-svg__guide, .pr-svg__dot, .pr-tip { transition: none; } }
.pr-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 20px 0 0; border-top: 1px solid var(--line); }
.pr-stats div { padding: 16px 16px 0 0; }
.pr-stats div + div { padding-left: 16px; border-left: 1px solid var(--line); }
.pr-stats dt { font-size: 13px; line-height: 20px; color: var(--muted); }
.pr-stats dd { margin: 4px 0 0; font-size: 16px; line-height: 24px; font-weight: 600; color: var(--ink-h1); white-space: nowrap; font-variant-numeric: tabular-nums; }
.pr-stats dd .chg { font-weight: 600; }
.pr-cap { margin-top: 20px; font-size: 12px; line-height: 18px; color: var(--muted); }
.pr-conv { display: flex; flex-direction: column; gap: 12px; }
.pr-field { display: flex; align-items: center; gap: 12px; height: 56px; padding: 0 16px; background: var(--board); border: 1px solid transparent; border-radius: var(--r-ctl); transition: border-color var(--ease), box-shadow var(--ease); }
.pr-field:focus-within { border-color: var(--line-strong); box-shadow: var(--ring); }
.pr-field input { flex: 1; min-width: 0; height: 100%; padding: 0; font: inherit; font-size: 18px; font-weight: 600; color: var(--ink-h1); background: none; border: 0; outline: none; font-variant-numeric: tabular-nums; }
.pr-field__unit { display: inline-flex; align-items: center; gap: 8px; flex: none; font-size: 14px; font-weight: 600; color: var(--ink); }
.pr-field__unit img { border-radius: 50%; }
.pr-field__unit .px-rub { width: 24px; height: 24px; }
.pr-conv__note { font-size: 12px; line-height: 18px; color: var(--muted); }
.pr-conv__btn { width: 100%; margin-top: 4px; }
.pr-conv__link { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink); }
.pr-conv__link svg { width: 16px; height: 16px; }
.pr-info { margin-top: 24px; }
.pr-info .fe-lead { margin-top: 4px; }
.pr-table { min-width: 640px; }
.pr-table td { white-space: nowrap; }
.pr-rel-sec { margin-top: 64px; }
.pr-rel-sec__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 16px; margin-bottom: 24px; }
.pr-rel-sec__head .px-hist__all { white-space: nowrap; }
.pr-rel-sec__head .cv-how__title { margin-bottom: 0; }
.pr-rel { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.pr-rel__item { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; align-items: center; gap: 12px; height: 100%; padding: 16px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-panel); transition: border-color var(--ease), box-shadow var(--ease); }
.pr-rel__item img { border-radius: 50%; }
.pr-rel__name { display: flex; flex-direction: column; min-width: 0; }
.pr-rel__name b { overflow: hidden; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ink-h1); white-space: nowrap; text-overflow: ellipsis; }
.pr-rel__name small { font-size: 12px; line-height: 16px; color: var(--muted); }
.pr-rel__val { display: flex; flex-direction: column; align-items: flex-end; font-size: 13px; line-height: 18px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pr-rel__val b { font-weight: 600; color: var(--ink-h1); }
@media (hover: hover) and (pointer: fine) { .pr-rel__item:hover { border-color: var(--line-strong); box-shadow: 0 8px 24px -16px rgba(16,24,40,.25); } .pr-conv__link:hover { text-decoration: underline; } }
@media (max-width: 1080px) {
  .pr-grid { grid-template-columns: minmax(0, 1fr); }
  .pr-rel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .pr-title { font-size: 26px; line-height: 34px; gap: 10px; }
  .pr-title img { width: 32px; height: 32px; }
  .pr-title span { font-size: 16px; }
  .pr-cta { width: 100%; }
  .pr-cta .btn { flex: 1; }
  .pr-price b { font-size: 28px; line-height: 36px; }
  .pr-chart { height: 200px; }
  .pr-bar { flex-direction: column; align-items: stretch; }
  .pr-ranges { display: flex; }
  .pr-ranges button { flex: 1; padding: 0 8px; }
  .pr-axis span:nth-child(even) { display: none; }
  .pr-dyn-table, .pr-dyn-table tbody { display: block; min-width: 0; }
  .pr-dyn-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .pr-dyn-table tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
  .pr-dyn-table tbody tr:last-child { border-bottom: 0; }
  .pr-dyn-table td, .pr-dyn-table tbody tr:last-child td { padding: 0; font-size: 13px; border: 0; }
  .pr-dyn-table td:nth-child(1) { font-weight: 600; color: var(--ink-h1); }
  .pr-dyn-table td:nth-child(even) { text-align: right; }
  .pr-dyn-table td:nth-child(3)::before { content: "Мин. "; color: var(--muted); }
  .pr-dyn-table td:nth-child(4)::before { content: "Макс. "; color: var(--muted); }
  .pr-disc { margin-top: 32px; }
  .pr-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pr-stats div:nth-child(3) { padding-left: 0; border-left: 0; }
  .pr-table { min-width: 560px; }
  .pr-rel-sec { margin-top: 48px; }
  .pr-rel { grid-template-columns: minmax(0, 1fr); }
}