/* ============================================================================
   landing-v3.css — ВИТРИНА V3 (цикл правок 2026-06-11).
   База = старый просторный index.html (его IA и ритм НЕ тронуты) + полировка:
   scroll-aware стеклянная шапка · живой терминал-фрейм в hero · секвенции
   воронки и Telegram-плашки · view-transitions. Ложится на tokens/base/components.
   ========================================================================== */

/* ---------- стеклянная шапка: прозрачна над hero → матовая при скролле ---------- */
body.lnd3 .nav{border-bottom-color:transparent;
  transition:border-color var(--dur-4) var(--ease-std);}
body.lnd3 .nav::before{background:transparent;
  transition:background-color var(--dur-4) var(--ease-std);
  backdrop-filter:saturate(150%) blur(14px); -webkit-backdrop-filter:saturate(150%) blur(14px);}
body.lnd3 .nav.is-glass{border-bottom-color:var(--border);}
body.lnd3 .nav.is-glass::before{background:color-mix(in srgb, var(--bg) 66%, transparent);}
/* у лендинг-навбара нет .nav-search-распорки (как на дашборде) → CTA-группу к правому краю явно */
body.lnd3 .nav-right{margin-inline-start:auto;}

/* ---------- живой терминал-фрейм в hero (крупный, просторный) ---------- */
.lf-wrap{--lf-p:0; position:relative; margin-inline:auto; max-width:1040px;}
.lf-section .lf-wrap{margin-top:var(--space-6);}
.lf-glow{position:absolute; inset:-80px -60px; z-index:-1; pointer-events:none;
  opacity:calc(.18 + var(--lf-p) * .82); transform:scale(calc(.9 + var(--lf-p) * .1));
  background:radial-gradient(760px 380px at 50% 20%, rgba(45,212,191,.10), transparent 66%);}
/* --lf-p (0→1) задаётся скроллом (landing3.js): панель ВЫПЛЫВАЕТ снизу — подъём + рост +
   наклон-глубина + проявление. Глубокий «кинематографичный» вход. */
.lf-frame{position:relative;
  transform:perspective(1500px)
    translateY(calc((1 - var(--lf-p)) * 110px))
    scale(calc(.93 + var(--lf-p) * .07))
    rotateX(calc((1 - var(--lf-p)) * 9deg));
  transform-origin:50% 92%; opacity:calc(.08 + var(--lf-p) * .92); will-change:transform, opacity;
  mask-image:linear-gradient(180deg, #000 64%, transparent 98%);
  -webkit-mask-image:linear-gradient(180deg, #000 64%, transparent 98%);}
.lf-frame .ring{position:absolute; inset:0; border-radius:12px; padding:1px; pointer-events:none; z-index:2;
  background:linear-gradient(180deg, rgba(45,212,191,.34), rgba(255,255,255,.07) 40%, rgba(255,255,255,.04));
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;}
.lf-body{background:var(--surface-1); border-radius:12px; overflow:hidden;
  box-shadow:0 28px 72px hsl(var(--shadow-color)/.5);}
.lf-head{display:flex; align-items:center; gap:10px; height:44px; padding-inline:18px;
  border-bottom:1px solid var(--border);
  background:color-mix(in srgb, var(--bg) 55%, var(--surface-1));}
.lf-head .ttl{font-family:var(--font-mono); font-size:.6875rem; letter-spacing:.10em;
  text-transform:uppercase; color:var(--text-3);}
.lf-live{margin-left:auto; display:inline-flex; align-items:center; gap:7px;
  font-family:var(--font-mono); font-size:.6875rem; letter-spacing:.05em; text-transform:uppercase; color:var(--text-3);}
.lf-live .dot{width:7px; height:7px; border-radius:999px; background:var(--accent); animation:lfpulse 2s var(--ease-out) infinite;}
@keyframes lfpulse{0%{box-shadow:0 0 0 0 rgba(45,212,191,.35);} 70%{box-shadow:0 0 0 7px rgba(45,212,191,0);} 100%{box-shadow:0 0 0 0 rgba(45,212,191,0);}}
/* просторная строка ленты: 46px, 14px текст — витринная, не рабочая плотность */
/* 1-я колонка = время: ширина под АБСОЛЮТНЫЙ формат «13.07 08:08» (~80px при .75rem mono),
   иначе при переключённом data-timefmt="abs" время наезжало на логотип (56px мало). */
.lf-row{position:relative; display:grid; grid-template-columns:88px 30px minmax(96px,140px) minmax(150px,auto) minmax(0,1fr) 110px 16px;
  align-items:center; gap:14px; height:46px; padding-inline:18px; text-decoration:none; color:inherit;
  border-bottom:1px solid rgba(255,255,255,.05); font-size:.875rem;
  transition:background-color .18s var(--ease-std), transform .18s var(--ease-std);}
.lf-row:last-child{border-bottom:none;}
/* эффект при наведении: подсветка строки + цветная грань слева (в цвете сигнала) + стрелка справа */
.lf-row::before{content:""; position:absolute; left:0; top:6px; bottom:6px; width:2px; border-radius:2px;
  background:var(--accent); opacity:0; transition:opacity .18s var(--ease-std);}
.lf-row:hover{background:var(--fill-hover); transform:translateX(2px);}
.lf-row:hover::before{opacity:1;}
.lf-row:hover .sym{color:var(--accent);}
.lf-row .go{width:14px; height:14px; color:var(--text-3); opacity:0; transform:translateX(-3px);
  transition:opacity .18s var(--ease-std), transform .18s var(--ease-std);}
.lf-row .go svg{width:14px; height:14px;}
.lf-row:hover .go{opacity:1; transform:none; color:var(--accent);}
.lf-row .tm{font-family:var(--font-mono); font-size:.75rem; color:var(--text-3); white-space:nowrap;}
.lf-row .lg{width:22px; height:22px; border-radius:999px; background:var(--surface-3); overflow:hidden;
  display:flex; align-items:center; justify-content:center; font-size:.5625rem; font-weight:600; color:var(--text-2);}
.lf-row .lg img{width:100%; height:100%; object-fit:cover;}
.lf-row .sym{font-weight:600; color:var(--text-1); white-space:nowrap;}
.lf-row .sig{display:inline-flex; align-items:center; gap:8px; color:var(--text-2); font-size:.8125rem; white-space:nowrap;}
.lf-row .sig .dotc{width:8px; height:8px; border-radius:999px; background:var(--c, var(--text-3)); flex:0 0 auto;}
.lf-row .ph{color:var(--text-3); font-size:.8125rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.lf-row .usd{font-family:var(--font-mono); color:var(--text-1); text-align:right; white-space:nowrap;}
/* строки скрыты до проявления фрейма (он ниже сгиба) → каскад влетает при входе секции в кадр */
.lf-frame .lf-row{opacity:0;}
.lf-frame.is-revealed .lf-row{animation:lfrow .6s var(--ease-out) var(--d, 0ms) both;}
@keyframes lfrow{from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:none;}}
/* на мобиле 5 колонок → прячем и hover-стрелку .go (на тач её всё равно не видно), иначе 6-я
   ячейка падала на 2-ю строку и ломала однострочную ленту */
@media (max-width:860px){ .lf-row{grid-template-columns:84px 26px minmax(0,1fr) auto 96px; gap:10px;} .lf-row .ph{display:none;} .lf-row .go{display:none;} }

/* ---------- воронка: секвенция шагов при входе в кадр ---------- */
.funnel .fn-step, .funnel .fn-arrow{opacity:0; transform:translateY(10px);
  transition:opacity var(--dur-6) var(--ease-out), transform var(--dur-6) var(--ease-out);}
.funnel.anim-in .fn-step, .funnel.anim-in .fn-arrow{opacity:1; transform:none;}
.funnel.anim-in .fn-step:nth-child(1){transition-delay:0ms;}
.funnel.anim-in .fn-arrow:nth-child(2){transition-delay:140ms;}
.funnel.anim-in .fn-step:nth-child(3){transition-delay:240ms;}
.funnel.anim-in .fn-arrow:nth-child(4){transition-delay:380ms;}
.funnel.anim-in .fn-step:nth-child(5){transition-delay:480ms;}

/* ---------- Telegram-плашка: уведомление «прилетает» при входе в кадр ---------- */
.tg-promo .tg-noti{opacity:0; transform:translateY(18px);
  transition:opacity var(--dur-6) var(--ease-out) 160ms, transform var(--dur-6) var(--ease-out) 160ms;}
.tg-promo .tg-noti-back{transition-delay:0ms;}
.tg-promo.anim-in .tg-noti{opacity:1; transform:none;}

/* ---------- сигнальные чипы: лёгкий лифт на ховер (полировка, не передел) ---------- */
.sigt{transition:transform var(--dur-2) var(--ease-std), border-color var(--dur-2) var(--ease-std);}
.sigt:hover{transform:translateY(-2px);}

/* ---------- переход витрина → приложение (progressive enhancement) ---------- */
@view-transition{navigation:auto;}

@media (prefers-reduced-motion:reduce){
  .lf-wrap{--lf-p:1;}
  .lf-frame{transform:none; opacity:1;}
  .lf-frame .lf-row{animation:none; opacity:1;}
  .lf-live .dot{animation:none;}
  .funnel .fn-step,.funnel .fn-arrow,.tg-promo .tg-noti{opacity:1; transform:none; transition:none;}
}

/* ============================================================================
   V3 РАСШИРЕНИЕ (релиз) — «Инструменты» бенто + витринные столпы HyperLiquid и
   DEX Visor с авторскими анимированными фигурами. Всё на tokens/components,
   один акцент, категориальная палитра только на данных. Анимация — исключительно
   transform/opacity, один проход на входе в кадр (гейт .is-in от app.js/landing3),
   reduced-motion → финальное состояние. Всё в scope body.lnd3.
   ========================================================================== */

/* ---------- «Инструменты»: бенто продуктовых поверхностей ---------- */
body.lnd3 .tools-grid{display:grid; gap:clamp(var(--space-4),1.4vw,var(--space-5));
  grid-template-columns:repeat(3,minmax(0,1fr));}
@media (max-width:940px){ body.lnd3 .tools-grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:560px){ body.lnd3 .tools-grid{grid-template-columns:1fr;} }
body.lnd3 .tool{padding:var(--space-6); display:flex; flex-direction:column; gap:var(--space-3);
  min-height:172px; color:var(--text-2);}
body.lnd3 .tool .ic{width:38px; height:38px; border-radius:var(--radius-sm);
  display:inline-flex; align-items:center; justify-content:center; flex:0 0 auto;
  background:var(--surface-2); border:1px solid var(--border);
  color:var(--text-2); transition:color var(--dur-3) var(--ease-std), border-color var(--dur-3) var(--ease-std);}
body.lnd3 .tool .ic svg{width:19px; height:19px; stroke-width:1.5;}
body.lnd3 .tool:hover .ic{color:var(--accent); border-color:color-mix(in srgb,var(--accent) 34%, var(--border));}
body.lnd3 .tool h3{font-size:1.125rem; font-weight:600; color:var(--text-1); line-height:1.2; letter-spacing:-.01em;}
body.lnd3 .tool p{font-size:.875rem; line-height:1.55; color:var(--text-2); margin:0;}
body.lnd3 .tool .tool-go{margin-top:auto; display:inline-flex; align-items:center; gap:7px;
  font-family:var(--font-mono); font-size:.6875rem; letter-spacing:.02em; color:var(--text-3);
  transition:color var(--dur-2) var(--ease-std);}
body.lnd3 .tool .tool-go svg{width:13px; height:13px; stroke-width:1.6; transition:transform var(--dur-2) var(--ease-std);}
body.lnd3 .tool:hover .tool-go{color:var(--accent);}
body.lnd3 .tool:hover .tool-go svg{transform:translateX(3px);}

/* ---------- Витринные столпы (фигура + текст, 2 колонки) ---------- */
body.lnd3 .l3-pillar{padding-block:clamp(var(--space-16),9vw,var(--space-24));}
body.lnd3 .pil-grid{display:grid; grid-template-columns:1.02fr 1.18fr;
  gap:clamp(var(--space-8),5vw,var(--space-20)); align-items:center;}
body.lnd3 .l3-pillar.rev .pil-grid{grid-template-columns:1.18fr 1.02fr;}
body.lnd3 .l3-pillar.rev .pil-copy{order:2;}
body.lnd3 .l3-pillar.rev .pil-fig{order:1;}
/* нейтральный chip-«eyebrow» — идентичность столпа несут ФИГУРА и заголовок,
   а не цветная плашка (§1 сдержанность; акцент/семантика — только на данных). */
/* бирка столпа = стильный бирюзовый лейбл (без плашки) — в духе eyebrow, но акцентом */
body.lnd3 .pil-badge{display:inline-flex; align-items:center; gap:8px; padding:0; height:auto;
  font-family:var(--font-mono); font-size:.75rem; font-weight:500;
  letter-spacing:.18em; text-transform:uppercase; color:var(--accent);
  background:none; border:0; box-shadow:none;}
body.lnd3 .pil-badge .d{width:5px; height:5px; border-radius:var(--radius-pill); background:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 16%, transparent);}
body.lnd3 .pil-copy h2{margin-top:var(--space-4); max-width:16ch;}
body.lnd3 .pil-copy > p{margin-top:var(--space-4); color:var(--text-2); max-width:48ch; line-height:1.6;}
body.lnd3 .pil-copy p b{color:var(--text-1); font-weight:600;}
body.lnd3 .pil-feats{list-style:none; margin-top:var(--space-6); display:flex; flex-direction:column; gap:var(--space-3);}
body.lnd3 .pil-feats li{position:relative; padding-left:var(--space-6); color:var(--text-2);
  font-size:.9375rem; line-height:1.5;}
body.lnd3 .pil-feats li .fi{position:absolute; left:0; top:1px; width:18px; height:18px; color:var(--pc,var(--accent));}
body.lnd3 .pil-feats li .fi svg{width:18px; height:18px; stroke-width:1.6;}
body.lnd3 .pil-feats li b{color:var(--text-1); font-weight:600;}
body.lnd3 .pil-kpis{display:flex; flex-wrap:wrap; gap:var(--space-6); margin-top:var(--space-8);
  padding-top:var(--space-6); border-top:1px solid var(--border);}
body.lnd3 .pil-kpi{display:flex; flex-direction:column; gap:var(--space-1);}
body.lnd3 .pil-kpi .v{font-family:var(--font-display); font-size:1.5rem; font-weight:500; color:var(--text-1);
  font-variant-numeric:tabular-nums; line-height:1;}
body.lnd3 .pil-kpi .l{font-size:.6875rem; text-transform:uppercase; letter-spacing:var(--track-caps-lg); color:var(--text-3);}
body.lnd3 .pil-cta{margin-top:var(--space-8);}

/* фигура-подложка: карточка с верхним светом + мягкое категориальное свечение позади */
body.lnd3 .pil-fig{position:relative; border-radius:var(--radius-md); overflow:hidden;
  background:var(--surface-1); border:1px solid var(--border);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 24px 60px -28px hsl(var(--shadow-color)/.6);
  padding:clamp(var(--space-5),2.4vw,var(--space-8));}
body.lnd3 .pil-fig > *{position:relative; z-index:1;}
[data-theme="light"] body.lnd3 .pil-fig{box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 20px 44px -26px hsl(var(--shadow-color)/.28);}

/* фигура: заголовок-«шапка терминала» */
body.lnd3 .fig-head{display:flex; align-items:center; gap:9px; margin-bottom:var(--space-4);}
body.lnd3 .fig-head .ttl{font-family:var(--font-mono); font-size:.6875rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--text-3);}
body.lnd3 .fig-head .sp{flex:1;}
body.lnd3 .fig-head .tk{font-family:var(--font-mono); font-size:.75rem; color:var(--text-2); font-variant-numeric:tabular-nums;}
body.lnd3 .fig-head .live{display:inline-flex; align-items:center; gap:6px; font-family:var(--font-mono);
  font-size:.625rem; letter-spacing:.08em; text-transform:uppercase; color:var(--text-3);}
body.lnd3 .fig-head .live .d{position:relative; width:6px; height:6px; border-radius:var(--radius-pill); background:var(--accent);}
body.lnd3 .fig-head .live .d::after{content:""; position:absolute; inset:0; border-radius:inherit; background:var(--accent);
  animation:figping 2s var(--ease-out) infinite;}
@keyframes figping{0%{transform:scale(1); opacity:.5;} 70%{transform:scale(2.6); opacity:0;} 100%{transform:scale(2.6); opacity:0;}}

/* ---------- HyperLiquid: «доска позиции» (свечи + вход + ликвидация + сетка ордеров) ---------- */
body.lnd3 .hlp-svg{width:100%; height:auto; display:block;}
body.lnd3 .hlp-svg .grid{stroke:var(--border); stroke-width:1;}
body.lnd3 .hlp-svg .cndl{transform-box:fill-box; transform-origin:center bottom; opacity:0;}
body.lnd3 .pil-fig.is-in .hlp-svg .cndl{animation:l3candle .5s var(--ease-out) both;}
body.lnd3 .hlp-svg .wick{stroke-width:1.4; opacity:0;}
body.lnd3 .pil-fig.is-in .hlp-svg .wick{animation:l3fade .5s var(--ease-out) both;}
body.lnd3 .hlp-svg .up{fill:var(--up);} body.lnd3 .hlp-svg .up.wick{stroke:var(--up);}
body.lnd3 .hlp-svg .dn{fill:var(--down);} body.lnd3 .hlp-svg .dn.wick{stroke:var(--down);}
body.lnd3 .hlp-svg .entry{stroke:var(--cat-hl); stroke-width:1.6; transform-box:fill-box; transform-origin:left; opacity:0;}
body.lnd3 .pil-fig.is-in .hlp-svg .entry{animation:l3grow .6s var(--ease-out) .35s both;}
body.lnd3 .hlp-svg .liq{stroke:var(--down); stroke-width:1.4; stroke-dasharray:5 4; transform-box:fill-box; transform-origin:left; opacity:0;}
body.lnd3 .pil-fig.is-in .hlp-svg .liq{animation:l3grow .6s var(--ease-out) .5s both;}
body.lnd3 .hlp-svg .ladder{stroke:var(--cat-hl); stroke-width:2; stroke-linecap:round; stroke-dasharray:9 5;
  transform-box:fill-box; transform-origin:right; opacity:0;}
body.lnd3 .pil-fig.is-in .hlp-svg .ladder{animation:l3grow .45s var(--ease-out) both;}
body.lnd3 .pil-fig.is-in .hlp-svg .ladder:nth-of-type(1){animation-delay:.55s;}
body.lnd3 .pil-fig.is-in .hlp-svg .ladder:nth-of-type(2){animation-delay:.63s;}
body.lnd3 .pil-fig.is-in .hlp-svg .ladder:nth-of-type(3){animation-delay:.71s;}
body.lnd3 .pil-fig.is-in .hlp-svg .ladder:nth-of-type(4){animation-delay:.79s;}
body.lnd3 .hlp-svg .tag{font-family:var(--font-mono); font-size:8.5px; fill:var(--text-3); opacity:0;}
body.lnd3 .pil-fig.is-in .hlp-svg .tag{animation:l3fade .5s var(--ease-out) .7s both;}
body.lnd3 .hlp-svg .tag.hi{fill:var(--cat-hl);} body.lnd3 .hlp-svg .tag.lo{fill:var(--down);}
body.lnd3 .hlp-svg .bub{transform-box:fill-box; transform-origin:center; opacity:0;}
body.lnd3 .pil-fig.is-in .hlp-svg .bub{animation:l3pop .5s var(--ease-out) both;}
body.lnd3 .pil-fig.is-in .hlp-svg .bub:nth-of-type(1){animation-delay:.85s;}
body.lnd3 .pil-fig.is-in .hlp-svg .bub:nth-of-type(2){animation-delay:.95s;}
/* стагтер свечей по индексу */
body.lnd3 .pil-fig.is-in .hlp-svg .cndl{animation-delay:calc(var(--ci,0) * 45ms);}
body.lnd3 .pil-fig.is-in .hlp-svg .wick{animation-delay:calc(var(--ci,0) * 45ms);}

/* ---------- DEX Visor: «стена графиков» + пузыри-сделки ---------- */
body.lnd3 .dxp-wall{display:grid; grid-template-columns:1fr 1fr; gap:10px;}
body.lnd3 .dxp-tile{position:relative; background:color-mix(in srgb, var(--bg) 40%, var(--surface-1));
  border:1px solid var(--border); border-radius:var(--radius-sm); padding:9px 10px 8px;
  min-height:104px; overflow:hidden; opacity:0;}
body.lnd3 .pil-fig.is-in .dxp-tile{animation:l3tile .5s var(--ease-out) both;}
body.lnd3 .pil-fig.is-in .dxp-tile:nth-child(1){animation-delay:.05s;}
body.lnd3 .pil-fig.is-in .dxp-tile:nth-child(2){animation-delay:.13s;}
body.lnd3 .pil-fig.is-in .dxp-tile:nth-child(3){animation-delay:.21s;}
body.lnd3 .pil-fig.is-in .dxp-tile:nth-child(4){animation-delay:.29s;}
body.lnd3 .dxp-tile .th{display:flex; align-items:center; gap:6px; margin-bottom:6px;}
body.lnd3 .dxp-tile .th .s{font-weight:600; font-size:.75rem; color:var(--text-1);}
body.lnd3 .dxp-tile .th .n{font-family:var(--font-mono); font-size:.5625rem; color:var(--text-3);
  letter-spacing:.04em; text-transform:uppercase;}
body.lnd3 .dxp-spark{width:100%; height:auto; display:block; overflow:visible;}
body.lnd3 .dxp-spark .grid{stroke:var(--border); stroke-width:1;}
body.lnd3 .dxp-spark .ax{font-family:var(--font-mono); font-size:6px; fill:var(--text-3);}
body.lnd3 .dxp-spark .cndl{transform-box:fill-box; transform-origin:center bottom;}
body.lnd3 .dxp-spark .wick{stroke-width:1.1;}
body.lnd3 .dxp-spark .up{fill:var(--up);} body.lnd3 .dxp-spark .up.wick{stroke:var(--up);}
body.lnd3 .dxp-spark .dn{fill:var(--down);} body.lnd3 .dxp-spark .dn.wick{stroke:var(--down);}
/* пузыри-сделки (в стиле GMGN): кольцо НА свече, цвет по стороне, размер по $ */
body.lnd3 .dxp-spark .bub{transform-box:fill-box; transform-origin:center; opacity:0; stroke-width:1.3;}
body.lnd3 .dxp-spark .bub.buy{fill:color-mix(in srgb,var(--up) 22%, transparent); stroke:var(--up);}
body.lnd3 .dxp-spark .bub.sell{fill:color-mix(in srgb,var(--down) 22%, transparent); stroke:var(--down);}
body.lnd3 .pil-fig.is-in .dxp-spark .bub{animation:l3pop .5s var(--ease-out) both;}
body.lnd3 .pil-fig.is-in .dxp-spark .bub{animation-delay:calc(.5s + var(--bd,0) * 80ms);}
/* лента-контроллер под стеной — в стиле ленты событий (.lf-row) */
body.lnd3 .dxp-feed{margin-top:12px; border:1px solid var(--border); border-radius:var(--radius-sm);
  overflow:hidden; background:var(--surface-1);}
body.lnd3 .dxp-fr{position:relative; display:grid; grid-template-columns:8px minmax(46px,auto) minmax(0,1fr) auto;
  align-items:center; gap:10px; height:38px; padding:0 13px 0 15px; opacity:0;}
body.lnd3 .dxp-fr + .dxp-fr{border-top:1px solid rgba(255,255,255,.05);}
[data-theme="light"] body.lnd3 .dxp-fr + .dxp-fr{border-top-color:var(--border);}
body.lnd3 .dxp-fr::before{content:""; position:absolute; left:0; top:7px; bottom:7px; width:2px;
  border-radius:0 2px 2px 0; background:var(--c,var(--text-3));}
body.lnd3 .dxp-fr .dot{width:8px; height:8px; border-radius:var(--radius-pill); background:var(--c,var(--text-3)); flex:0 0 auto;}
body.lnd3 .dxp-fr .sym{font-weight:600; font-size:.8125rem; color:var(--text-1); white-space:nowrap;}
body.lnd3 .dxp-fr .lab{color:var(--text-3); font-size:.8125rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
body.lnd3 .dxp-fr .usd{font-family:var(--font-mono); font-size:.8125rem; color:var(--text-1); font-variant-numeric:tabular-nums; white-space:nowrap;}
body.lnd3 .pil-fig.is-in .dxp-fr{animation:l3slide .45s var(--ease-out) both;}
body.lnd3 .pil-fig.is-in .dxp-fr:nth-child(1){animation-delay:.5s;}
body.lnd3 .pil-fig.is-in .dxp-fr:nth-child(2){animation-delay:.6s;}
body.lnd3 .pil-fig.is-in .dxp-fr:nth-child(3){animation-delay:.7s;}

/* ---------- ключевые кадры (transform/opacity) ---------- */
@keyframes l3candle{from{opacity:0; transform:scaleY(.15);} to{opacity:1; transform:scaleY(1);}}
@keyframes l3grow{from{opacity:0; transform:scaleX(0);} to{opacity:1; transform:scaleX(1);}}
@keyframes l3pop{from{opacity:0; transform:scale(.35);} to{opacity:1; transform:scale(1);}}
@keyframes l3fade{from{opacity:0;} to{opacity:1;}}
@keyframes l3tile{from{opacity:0; transform:translateY(12px) scale(.97);} to{opacity:1; transform:none;}}
@keyframes l3slide{from{opacity:0; transform:translateX(-10px);} to{opacity:1; transform:none;}}

/* ---------- адаптив ---------- */
@media (max-width:880px){
  body.lnd3 .pil-grid,body.lnd3 .l3-pillar.rev .pil-grid{grid-template-columns:1fr; gap:var(--space-8);}
  body.lnd3 .l3-pillar.rev .pil-copy{order:1;} body.lnd3 .l3-pillar.rev .pil-fig{order:2;}
}

@media (prefers-reduced-motion:reduce){
  body.lnd3 .hlp-svg .cndl,body.lnd3 .hlp-svg .wick,body.lnd3 .hlp-svg .entry,body.lnd3 .hlp-svg .liq,
  body.lnd3 .hlp-svg .ladder,body.lnd3 .hlp-svg .tag,body.lnd3 .hlp-svg .bub,
  body.lnd3 .dxp-tile,body.lnd3 .dxp-bub,body.lnd3 .dxp-fr{animation:none; opacity:1; transform:none;}
  body.lnd3 .fig-head .live .d::after{animation:none; display:none;}
}
