/* tyrian/tyrian.css */
/* Лендинг Tyrian Trade: стили разделов и живых примеров.
 * Общие стили шаблона (темы, сетка, панели, текст, кнопки) лежат в ../shared/landing.css.
 * Внутри чёрных панелей примеры интерфейса одинаковы в обеих темах: чёрное, тонкие линии,
 * «слоновая кость», фиолетовый только как свет и выбор. */

.lp-root .pos { color: var(--up); }
.lp-root .neg { color: var(--down); }

/* ---- 1. Шапка страницы ----------------------------------------------------------------- */
.lp-root .intro { position: absolute; top: 80px; right: calc(50% + 24px); left: var(--gutter); z-index: 8; display: flex; align-items: flex-start; min-height: 120px; color: var(--page-ink); }
.lp-root .intro strong { font: 700 72px/88px var(--font); letter-spacing: -0.03em; }
.lp-root .intro span { margin: 64px 0 0 10px; font: 500 20px/28px var(--font); }
.lp-root .hero { min-height: 556px; }
.lp-root .hero .pn-in { display: flex; flex-direction: column; min-height: 556px; }
.lp-root .hero h2 { line-height: 1.12; }
.lp-root .hero h2 span { display: block; }
.lp-root .hero h2 span + span { color: var(--ivory-2); }
.lp-root .hero .lead { max-width: none; margin-top: 24px; }
.lp-root .hero-free { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 36px; border-top: 1px solid var(--line); }
.lp-root .hero-free li { display: grid; gap: 4px; padding: 16px 16px 0 0; }
.lp-root .hero-free li + li { padding-left: 16px; border-left: 1px solid var(--line); }
.lp-root .hero-free b { font: 400 34px/38px var(--font); letter-spacing: -0.03em; color: var(--ivory); }
.lp-root .hero-free span { font: 600 12px/16px var(--font); letter-spacing: 0.12em; text-transform: uppercase; color: var(--ivory-3); }
.lp-root .hero-act { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: auto; padding-top: 32px; }

/* ---- 2. Знак --------------------------------------------------------------------------- */
.lp-root .object { height: 700px; }
.lp-root .object canvas, .lp-root .object .fallback { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; }
.lp-root canvas[data-ready] + .fallback { display: none; }
.lp-root .side.quote { top: -32px; }
.lp-root .side.quote p { font-size: 20px; letter-spacing: 0.01em; }
.lp-root #market .side.low, .lp-root #communities .side.low { padding-bottom: 380px; }

/* ---- 3. AI: телефон с уведомлениями ---------------------------------------------------- */
.lp-root .service { min-height: 721px; }
.lp-root .service .pn-in { min-height: 405px; padding-bottom: 0; }
.lp-root .phone-box { position: relative; z-index: 1; height: 316px; overflow: hidden; }
.lp-root .phone { position: absolute; top: 8px; left: 50%; width: 360px; height: 785px; margin-left: -180px; border-radius: 58px; background: #0a0a0c; box-shadow: inset 0 0 0 2px #56565c, inset 0 0 0 9px #17171a, inset 0 0 0 10px #303036; }
.lp-root .phone-screen { position: absolute; inset: 10px; overflow: hidden; border-radius: 48px; background: radial-gradient(130% 46% at 50% 0%, #2a1f4a, #121018 62%, #0a090d); }
.lp-root .phone-screen::before { content: ''; position: absolute; top: 12px; left: 50%; z-index: 1; width: 104px; height: 30px; margin-left: -52px; border-radius: 20px; background: #000; }
.lp-root .phone-date { position: absolute; top: 56px; right: 0; left: 0; text-align: center; font: 500 17px/19px var(--font); color: rgb(255 255 255 / 0.82); }
.lp-root .phone-time { position: absolute; top: 76px; right: 0; left: 0; text-align: center; font: 300 78px/78px var(--font); letter-spacing: -0.03em; color: rgb(255 255 255 / 0.86); }
.lp-root .phone-note { position: absolute; top: 179px; left: 14px; display: flex; gap: 12px; width: 312px; min-height: 86px; padding: 11px 12px; border-radius: 20px; background: rgb(255 255 255 / 0.1); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.14); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); color: #fff; opacity: 0; transform: translateY(-10px) scale(0.86); transition: transform 0.6s var(--spring) 0.5s, opacity 0.4s linear 0.5s; }
.lp-root .phone-note.second { top: 276px; transition-delay: 1.3s; }
.lp-root .pn.is-in .phone-note { opacity: 1; transform: none; }
.lp-root .phone-note i { display: grid; flex: none; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: linear-gradient(135deg, #8f5cf0, #3b167f); }
.lp-root .phone-note.second i { background: linear-gradient(135deg, #3a3a40, #151518); }
.lp-root .phone-note i svg { width: 18px; height: 18px; }
.lp-root .phone-note > div { display: grid; grid-template-columns: 1fr auto; column-gap: 8px; flex: 1; min-width: 0; }
.lp-root .phone-note b { font: 600 14px/19px var(--font); }
.lp-root .phone-note small { font: 400 12px/19px var(--font); color: rgb(255 255 255 / 0.56); }
.lp-root .phone-note span { grid-column: 1 / -1; margin-top: 2px; font: 400 13px/17px var(--font); color: rgb(255 255 255 / 0.86); }

/* ---- Общая шапка у больших примеров ---------------------------------------------------- */
.lp-root .split-head { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); align-items: end; gap: 48px; }
.lp-root .split-head .lead { max-width: 520px; margin: 0 0 4px auto; font-size: 18px; line-height: 27px; }

/* ---- 4. AI: разбор графика -------------------------------------------------------------- */
.lp-root .aid { display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.18fr); gap: 24px; margin-top: 44px; }
.lp-root .aid-chat { display: flex; flex-direction: column; min-height: 470px; padding: 20px; border: 1px solid var(--line); border-radius: 20px; }
.lp-root .aid-asks { display: flex; flex-wrap: wrap; gap: 8px; }
.lp-root .aid-log { display: flex; flex: 1; flex-direction: column; gap: 14px; min-height: 300px; margin-top: 20px; }
.lp-root .msg.me { align-self: flex-end; max-width: 88%; padding: 12px 14px; border-radius: 16px 16px 4px 16px; background: rgb(225 214 198 / 0.08); box-shadow: inset 0 0 0 1px var(--line); }
.lp-root .msg.me p { font: 400 15px/21px var(--font); color: var(--ivory); }
.lp-root .msg-att { display: inline-flex; gap: 4px; margin-top: 8px; padding: 3px 8px; border-radius: 6px; background: rgb(0 0 0 / 0.5); font: 500 12px/16px var(--font); color: var(--ivory-2); }
.lp-root .msg-att b { color: var(--ivory); }
.lp-root .msg.ai { max-width: 100%; }
.lp-root .ai-head { display: flex; align-items: center; gap: 8px; }
.lp-root .ai-head i { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; color: var(--accent-ink); background: var(--accent-soft); box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.3); }
.lp-root .ai-head i svg { width: 14px; height: 14px; }
.lp-root .ai-head b { font: 600 14px/18px var(--font); }
.lp-root .ai-state { font: 400 13px/18px var(--font); color: var(--ivory-3); }
.lp-root .ai-state:not(.ok)::after { content: ''; display: inline-block; width: 6px; height: 6px; margin-left: 6px; border-radius: 50%; background: var(--accent); animation: pulse 1s ease-in-out infinite; vertical-align: 1px; }
.lp-root .ai-state.ok { color: var(--up); }
@keyframes pulse { 50% { opacity: 0.25; } }
.lp-root .ai-lines { display: grid; gap: 8px; margin-top: 12px; padding-left: 34px; }
.lp-root .ai-lines li { position: relative; font: 400 15px/22px var(--font); color: var(--ivory); }
.lp-root .ai-lines li::before { content: ''; position: absolute; top: 9px; left: -14px; width: 4px; height: 4px; border-radius: 50%; background: var(--ivory-3); }
.lp-root .ai-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 16px; padding-left: 34px; }
.lp-root .ai-foot[hidden] { display: none; }
.lp-root .ai-apply { height: 34px; padding: 0 14px; font-size: 13px; }
.lp-root .aid.is-off .ai-apply { color: var(--ivory-2); }
.lp-root .aid-input { display: flex; align-items: center; gap: 12px; height: 52px; margin-top: 16px; padding: 0 8px 0 18px; border-radius: 26px; background: rgb(225 214 198 / 0.05); box-shadow: inset 0 0 0 1px var(--line); font: 400 15px/20px var(--font); color: var(--ivory-3); }
.lp-root .aid-input span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lp-root .aid-input.is-typing { color: var(--ivory); box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.6); }
.lp-root .aid-input.is-typing span::after { content: ''; display: inline-block; width: 1.5px; height: 17px; margin-left: 2px; background: var(--accent-ink); vertical-align: -3px; animation: pulse 0.8s steps(1) infinite; }
.lp-root .aid-send { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; color: #fff; background: radial-gradient(circle at 50% 30%, #8a2fff, #351c8a 70%); box-shadow: inset 0 1px 1px rgb(255 255 255 / 0.3); }
.lp-root .aid-send svg { width: 16px; height: 16px; }

.lp-root .aid-chart { position: relative; display: flex; flex-direction: column; min-height: 470px; padding: 18px 20px 20px; border: 1px solid var(--line); border-radius: 20px; background: radial-gradient(90% 60% at 70% 110%, rgb(96 38 197 / 0.16), transparent 70%); }
.lp-root .aid-bar { display: flex; align-items: center; gap: 12px; font: 500 14px/18px var(--font); color: var(--ivory-2); }
.lp-root .aid-bar b { font-weight: 600; color: var(--ivory); }
.lp-root .aid-px { margin-right: auto; color: var(--ivory); }
.lp-root .aid-plot { position: relative; flex: 1; min-height: 360px; margin-top: 12px; padding-right: 64px; }
.lp-root .aid-svg { display: block; width: 100%; height: 100%; min-height: 360px; overflow: visible; }
.lp-root .aid-axis { position: absolute; top: 0; right: 0; bottom: 0; width: 60px; border-left: 1px solid var(--line); }
.lp-root .aid-axis span { position: absolute; right: 0; left: 8px; font: 500 11px/14px var(--font); color: var(--ivory-3); transform: translateY(-50%); font-variant-numeric: tabular-nums; }
.lp-root .aid-axis span.now { left: 0; padding: 1px 0 1px 6px; border-radius: 0 3px 3px 0; background: var(--ivory); color: #000; }
.lp-root .aid-time { position: relative; height: 18px; margin: 8px 64px 0 0; border-top: 1px solid var(--line); }
.lp-root .aid-time span { position: absolute; top: 4px; font: 500 11px/14px var(--font); color: var(--ivory-3); transform: translateX(-50%); white-space: nowrap; }
.lp-root .aid-svg .vb { opacity: 0.45; transition: opacity 0.5s var(--ease); }
.lp-root .aid[data-kind='trend'].is-drawn .vb { opacity: 1; }
.lp-root .aid-svg .grid { stroke: rgb(225 214 198 / 0.06); stroke-width: 1; vector-effect: non-scaling-stroke; }
.lp-root .aid-svg .cu line, .lp-root .aid-svg .cd line { stroke-width: 1; vector-effect: non-scaling-stroke; }
.lp-root .aid-svg .cu line { stroke: rgb(99 201 154 / 0.85); }
.lp-root .aid-svg .cu rect { fill: rgb(99 201 154 / 0.85); }
.lp-root .aid-svg .cd line { stroke: rgb(233 134 138 / 0.85); }
.lp-root .aid-svg .cd rect { fill: rgb(233 134 138 / 0.85); }
.lp-root .aid-svg .last { stroke: var(--ivory-3); stroke-width: 1; stroke-dasharray: 2 4; vector-effect: non-scaling-stroke; }
.lp-root .aid-svg .lvl { fill: none; stroke-width: 1.5; vector-effect: non-scaling-stroke; transform-box: fill-box; transform-origin: left center; transform: scaleX(0); transition: transform 0.9s var(--ease); }
.lp-root .aid.is-drawn .lvl { transform: none; }
.lp-root .aid-svg .lvl.sup { stroke: var(--up); }
.lp-root .aid-svg .lvl.res { stroke: var(--down); }
.lp-root .aid-svg .lvl.fib { stroke: rgb(196 163 255 / 0.85); stroke-width: 1; stroke-dasharray: 5 4; }
.lp-root .aid-svg .lvl.fibd { stroke: rgb(196 163 255 / 0.5); stroke-dasharray: 2 4; }
.lp-root .aid-svg .lvl.trend { stroke: var(--accent-ink); stroke-width: 2; }
.lp-root .aid-svg .zone { opacity: 0; transition: opacity 0.6s var(--ease); }
.lp-root .aid.is-drawn .zone { opacity: 1; }
.lp-root .aid-svg .zone.sup { fill: rgb(99 201 154 / 0.09); }
.lp-root .aid-svg .zone.res { fill: rgb(233 134 138 / 0.09); }
.lp-root .aid-svg .zone.fibz { fill: rgb(160 106 255 / 0.13); }
.lp-root .aid-svg .vol { transform-box: fill-box; transform-origin: bottom; transform: scaleY(0); transition: transform 0.6s var(--ease); }
.lp-root .aid.is-drawn .vol { transform: none; }
.lp-root .aid-svg .vu { fill: rgb(99 201 154 / 0.32); }
.lp-root .aid-svg .vd { fill: rgb(233 134 138 / 0.28); }
.lp-root .aid-labels { position: absolute; inset: 0; pointer-events: none; }
.lp-root .aid-labels span { position: absolute; right: 0; z-index: 1; min-width: 60px; padding: 2px 7px; border-radius: 4px; background: #000; box-shadow: inset 0 0 0 1px currentColor; font: 500 11px/15px var(--font); white-space: pre; transform: translateY(-50%); opacity: 0; transition: opacity 0.5s var(--ease) 0.6s; }
.lp-root .aid.is-drawn .aid-labels span { opacity: 1; }
.lp-root .aid-labels .sup { color: var(--up); }
.lp-root .aid-labels .res { color: var(--down); }
.lp-root .aid-labels .fib { color: var(--accent-ink); }
.lp-root .aid-labels .trend { color: var(--accent-ink); }
.lp-root .aid-labels .vol { left: 0; right: auto; color: var(--ivory-2); }
.lp-root .aid.is-off .ov, .lp-root .aid.is-off .aid-labels { opacity: 0; transition: opacity 0.3s; }
.lp-root .aid-fine { margin-top: 16px; }

/* ---- 5. Скринер ------------------------------------------------------------------------- */
.lp-root .sc { margin-top: 44px; padding: 20px; border: 1px solid var(--line); border-radius: 20px; }
.lp-root .sc-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.lp-root .sc-classes { display: inline-flex; padding: 3px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line); }
.lp-root .sc-classes button { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 16px; border: 0; border-radius: 999px; background: none; font: 500 14px/1 var(--font); color: var(--ivory-2); transition: color 0.16s, background 0.25s var(--ease); }
.lp-root .sc-classes button i { font-style: normal; font-size: 12px; color: var(--ivory-4); }
.lp-root .sc-classes button[aria-selected='true'] { color: #000; background: var(--ivory); }
.lp-root .sc-classes button[aria-selected='true'] i { color: rgb(0 0 0 / 0.5); }
.lp-root .sc-fresh { display: inline-flex; align-items: center; gap: 8px; font: 500 13px/1 var(--font); color: var(--ivory-3); }
.lp-root .sc-fresh i { width: 6px; height: 6px; border-radius: 50%; background: var(--up); box-shadow: 0 0 0 3px rgb(99 201 154 / 0.15); }
.lp-root .sc-lens { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 56px; margin-top: 16px; padding: 8px 12px 8px 16px; border-radius: 16px; background: rgb(225 214 198 / 0.04); box-shadow: inset 0 0 0 1px var(--line-2); }
.lp-root .sc-lens-i { width: 18px; height: 18px; color: var(--ivory-3); }
.lp-root .sc-conds { display: contents; }
.lp-root .cond { display: inline-flex; align-items: center; height: 34px; border-radius: 10px; background: #0d0d0f; box-shadow: inset 0 0 0 1px var(--line-2); transition: box-shadow 0.16s; animation: cond-in 0.35s var(--ease) both; }
@keyframes cond-in { from { opacity: 0; transform: scale(0.92); } }
.lp-root .cond:hover { box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.55); }
.lp-root .cond.is-proposed { background: transparent; box-shadow: none; outline: 1px dashed rgb(160 106 255 / 0.75); outline-offset: -1px; }
.lp-root .cond-edit { height: 34px; padding: 0 6px 0 12px; border: 0; background: none; font: 500 14px/1 var(--font); color: var(--ivory); }
.lp-root .cond.is-proposed .cond-edit { padding-right: 12px; color: var(--accent-ink); }
.lp-root .cond-x { display: grid; place-items: center; width: 28px; height: 34px; padding: 0 6px 0 0; border: 0; background: none; color: var(--ivory-3); }
.lp-root .cond-x:hover { color: var(--ivory); }
.lp-root .cond-x svg { width: 14px; height: 14px; }
.lp-root .sc-add-wrap { position: relative; }
.lp-root .sc-add { height: 34px; padding: 0 12px; border: 1px dashed var(--line-2); border-radius: 10px; background: none; font: 500 14px/1 var(--font); color: var(--ivory-2); }
.lp-root .sc-add:hover { color: var(--ivory); border-color: rgb(225 214 198 / 0.4); }
.lp-root .sc-menu { position: absolute; top: 40px; left: 0; z-index: 5; display: grid; min-width: 260px; padding: 6px; border-radius: 12px; background: #050506; box-shadow: inset 0 0 0 1px var(--line-2), 0 20px 40px rgb(0 0 0 / 0.6); animation: cond-in 0.25s var(--ease) both; }
.lp-root .sc-menu[hidden] { display: none; }
.lp-root .sc-menu button { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 38px; padding: 0 10px; border: 0; border-radius: 8px; background: none; font: 500 14px/1 var(--font); color: var(--ivory); text-align: left; }
.lp-root .sc-menu button:hover { background: rgb(225 214 198 / 0.07); }
.lp-root .sc-menu i { font-style: normal; font-size: 12px; color: var(--ivory-3); }
.lp-root .sc-match { margin-left: auto; padding-left: 12px; font: 500 14px/1 var(--font); color: var(--ivory-3); white-space: nowrap; }
.lp-root .sc-match b { margin-left: 4px; font-weight: 500; color: var(--ivory); }
.lp-root .sc-match b { display: inline-block; }
.lp-root .sc-match b.is-bump { animation: bump 0.6s var(--spring); }
@keyframes bump { 30% { color: var(--accent-ink); transform: scale(1.35); } }
.lp-root .sc-ai { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin-top: 10px; padding: 0 4px 0 16px; }
.lp-root .sc-ai-q { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 40px; font: 400 14px/20px var(--font); color: var(--ivory-3); }
.lp-root .sc-ai { flex-wrap: nowrap; padding: 0; }
.lp-root .sc-ai-q { flex: 1; min-width: 0; }
.lp-root .sc-ai-field { display: flex; flex: 1; align-items: center; gap: 10px; min-width: 0; height: 44px; padding: 0 14px; border-radius: 12px; box-shadow: inset 0 0 0 1px var(--line); color: var(--ivory-2); }
.lp-root .sc-ai-field svg { flex: none; width: 15px; height: 15px; color: var(--accent-ink); }
.lp-root .sc-ai-field span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lp-root .sc-ai.is-proposal .sc-ai-q { padding-left: 12px; }
.lp-root .sc-ai-done { display: inline-flex; align-items: center; gap: 6px; color: var(--accent-ink); }
.lp-root .sc-ai-done svg { width: 14px; height: 14px; }
.lp-root .sc-ai-go { height: 44px; padding: 0 18px; font-size: 14px; border-radius: 12px; }
.lp-root .sc-ai-go[hidden] { display: none; }
.lp-root .sc-sum { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.lp-root .sc-sum .stat { padding: 16px 16px 16px 0; }
.lp-root .sc-sum .stat + .stat { padding-left: 16px; border-left: 1px solid var(--line); }
.lp-root .sc-sum .stat strong { font-size: 26px; line-height: 30px; }
.lp-root .sc-sum .ud { display: flex; gap: 3px; height: 3px; margin-top: 2px; max-width: 160px; }
.lp-root .sc-sum .ud i { border-radius: 2px; background: var(--up); transition: flex 0.5s var(--ease); }
.lp-root .sc-sum .ud i + i { background: var(--down); }
.lp-root .sc-views { display: flex; align-items: center; gap: 16px; margin: 16px 0 12px; }
.lp-root .sc-view-seg { display: inline-flex; padding: 3px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--line); }
.lp-root .sc-view-seg button { height: 30px; padding: 0 14px; border: 0; border-radius: 8px; background: none; font: 500 13px/1 var(--font); color: var(--ivory-2); }
.lp-root .sc-view-seg button[aria-pressed='true'] { color: var(--ivory); background: rgb(225 214 198 / 0.1); }
.lp-root .sc-body { position: relative; }
.lp-root .sc-map { position: relative; height: 340px; overflow: hidden; border-radius: 12px; }
.lp-root .sc-map[hidden], .lp-root .sc-table-wrap[hidden] { display: none; }
.lp-root .tile { position: absolute; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 2px; overflow: hidden; padding: 10px; border: 0; border-radius: 0; box-shadow: inset 0 0 0 1px #000; color: #fff; text-align: left; animation: tile-in 0.5s var(--ease) both; animation-delay: inherit; transition: filter 0.16s; }
@keyframes tile-in { from { opacity: 0; transform: scale(0.96); } }
.lp-root .tile:hover { filter: brightness(1.25); z-index: 1; }
.lp-root .tile b { font: 600 14px/16px var(--font); }
.lp-root .tile span { font: 500 12px/14px var(--font); color: rgb(255 255 255 / 0.78); }
.lp-root .tile.big { justify-content: center; align-items: center; }
.lp-root .tile.big b { font-size: 26px; line-height: 30px; letter-spacing: -0.02em; }
.lp-root .tile.big span { font-size: 15px; line-height: 18px; }
.lp-root .tile.tiny { padding: 5px; }
.lp-root .tile.tiny span { display: none; }
.lp-root .tile.tiny b { font-size: 11px; }
.lp-root .sc-tip { position: absolute; top: 0; left: 0; z-index: 6; display: grid; gap: 2px; width: 206px; padding: 12px 13px; border-radius: 10px; background: #050506; box-shadow: inset 0 0 0 1px var(--line-2), 0 14px 30px rgb(0 0 0 / 0.6); font: 400 13px/18px var(--font); color: var(--ivory-2); pointer-events: none; }
.lp-root .sc-tip[hidden] { display: none; }
.lp-root .sc-tip header { display: flex; align-items: baseline; gap: 8px; }
.lp-root .sc-tip b { color: var(--ivory); font-weight: 600; }
.lp-root .sc-tip strong { font: 400 20px/24px var(--font); color: var(--ivory); }
.lp-root .sc-tip strong em { margin-left: 4px; font-size: 13px; }
.lp-root .sc-tip svg { width: 180px; height: 34px; margin: 4px 0; overflow: visible; }
.lp-root .sc-tip svg path { fill: none; stroke-width: 1.5; }
.lp-root .sc-tip svg path.pos { stroke: var(--up); } .lp-root .sc-tip svg path.neg { stroke: var(--down); }
.lp-root .sc-tip small { margin-top: 4px; padding-top: 6px; border-top: 1px solid var(--line); font-size: 12px; color: var(--ivory-3); }
.lp-root .sc-tip em { font-style: normal; }
.lp-root .sc-table-wrap { max-height: 340px; overflow: auto; }
.lp-root .sc-table { width: 100%; border-collapse: collapse; font: 400 14px/18px var(--font); }
.lp-root .sc-table th { position: sticky; top: 0; z-index: 1; height: 38px; padding: 0 12px; background: #000; border-bottom: 1px solid var(--line-2); font: 600 12px/14px var(--font); letter-spacing: 0.1em; text-transform: uppercase; color: var(--ivory-3); text-align: right; white-space: nowrap; }
.lp-root .pn:not(.is-soft) .sc-table th { background: var(--panel); }
.lp-root .sc-table th.c-tk, .lp-root .sc-table th.c-ctx { text-align: left; }
.lp-root .sc-table th button { display: inline-flex; gap: 4px; padding: 0; border: 0; background: none; font: inherit; letter-spacing: inherit; text-transform: inherit; color: inherit; }
.lp-root .sc-table th button:hover, .lp-root .sc-table th[aria-sort='ascending'] button, .lp-root .sc-table th[aria-sort='descending'] button { color: var(--ivory); }
.lp-root .sc-table th i { font-style: normal; }
.lp-root .sc-table td { height: 56px; padding: 0 12px; border-bottom: 1px solid var(--line); text-align: right; white-space: nowrap; color: var(--ivory); }
.lp-root .sc-table tr { transition: background 0.16s; }
.lp-root .sc-table td.pos { color: var(--up); }
.lp-root .sc-table td.neg { color: var(--down); }
.lp-root .sc-body.is-preview .sc-map, .lp-root .sc-body.is-preview .sc-table-wrap { opacity: 0.72; outline: 1px dashed rgb(160 106 255 / 0.6); outline-offset: 4px; border-radius: 12px; }
.lp-root .sc-sum.is-preview strong { color: var(--accent-ink); }
.lp-root .sc-table tbody tr:hover { background: rgb(225 214 198 / 0.04); }
.lp-root .sc-table tr.is-hit { background: var(--accent-soft); }
.lp-root .sc-table td.c-tk { display: flex; align-items: center; gap: 12px; text-align: left; }
.lp-root .sc-table td.c-tk > span:last-child { display: grid; }
.lp-root .sc-table td.c-tk b { font-weight: 600; }
.lp-root .sc-table td.c-tk small { font: 400 12px/16px var(--font); color: var(--ivory-3); }
.lp-root .logo { display: grid; flex: none; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: radial-gradient(circle at 30% 25%, hsl(var(--h) 22% 32%), hsl(var(--h) 18% 12%)); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.1); font: 600 13px/1 var(--font); color: #fff; }
.lp-root .sc-table td.c-ctx { text-align: left; }
.lp-root .sc-table td.c-line svg { width: 96px; height: 28px; margin-left: auto; overflow: visible; }
.lp-root .sc-table td.c-line path { fill: none; stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.lp-root .sc-table td.c-line path.pos { stroke: var(--up); }
.lp-root .sc-table td.c-line path.neg { stroke: var(--down); }
.lp-root .sc-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; height: 100%; min-height: 200px; text-align: center; font: 500 16px/22px var(--font); color: var(--ivory-2); }

/* ---- 6. Доски --------------------------------------------------------------------------- */
.lp-root .boards { min-height: 900px; }
.lp-root .bd { margin-top: 32px; }
.lp-root .bd-ask { display: flex; align-items: center; gap: 12px; padding: 8px 8px 8px 16px; border-radius: 16px; background: rgb(225 214 198 / 0.04); box-shadow: inset 0 0 0 1px var(--line-2); }
.lp-root .bd-q { flex: 1; font: 400 15px/21px var(--font); color: var(--ivory); }
.lp-root .bd-go { flex: none; height: 36px; font-size: 13px; }
.lp-root .bd-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }
.lp-root .bd-steps li { display: flex; align-items: center; gap: 8px; font: 500 12px/15px var(--font); color: var(--ivory-4); transition: color 0.3s; }
.lp-root .bd-steps li i { position: relative; flex: none; width: 14px; height: 14px; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--line-2); transition: background 0.3s, box-shadow 0.3s; }
.lp-root .bd-steps li.now { color: var(--ivory); }
.lp-root .bd-steps li.now i { box-shadow: inset 0 0 0 1.5px var(--accent); animation: pulse 0.9s ease-in-out infinite; }
.lp-root .bd-steps li.done { color: var(--ivory-2); }
.lp-root .bd-steps li.done i { background: var(--accent); box-shadow: none; }
.lp-root .bd-steps li.done i::after { content: ''; position: absolute; top: 3px; left: 5px; width: 3px; height: 6px; border: solid #fff; border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); }
.lp-root .bd-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 18px; }
.lp-root .tile-b { display: flex; flex-direction: column; min-height: 196px; padding: 14px; border: 1px solid var(--line); border-radius: 16px; opacity: 0; transform: translateY(14px); transition: opacity 0.5s var(--ease), transform 0.6s var(--ease), border-color 0.2s; }
.lp-root .tile-b:hover { border-color: var(--line-2); }
.lp-root .bd.is-built .tile-b { opacity: 1; transform: none; }
.lp-root .bd.is-built .tile-b:nth-child(2) { transition-delay: 0.1s; }
.lp-root .bd.is-built .tile-b:nth-child(3) { transition-delay: 0.2s; }
.lp-root .bd.is-built .tile-b:nth-child(4) { transition-delay: 0.3s; }
.lp-root .tile-b header { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.lp-root .tile-b header b { font: 600 13px/18px var(--font); color: var(--ivory); }
.lp-root .tile-b footer { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 10px; margin-top: auto; padding-top: 10px; font: 500 12px/16px var(--font); color: var(--ivory-2); }
.lp-root .tile-b footer span { display: inline-flex; align-items: center; gap: 6px; }
.lp-root .tile-b footer i { width: 10px; height: 2px; border-radius: 1px; }
.lp-root .tile-b footer .k1 { background: var(--accent-ink); }
.lp-root .tile-b footer .k2 { background: var(--ivory-2); }
.lp-root .bd-lines { width: 100%; height: 100px; margin-top: 10px; overflow: visible; }
.lp-root .bd-lines path { fill: none; stroke-width: 1.6; vector-effect: non-scaling-stroke; stroke-linejoin: round; }
.lp-root .bd-lines .l1 { stroke: var(--accent-ink); }
.lp-root .bd-lines .l2 { stroke: var(--ivory-2); }
.lp-root .bd-lines .l3 { stroke: var(--ivory); }
.lp-root .bd-lines .lvl { stroke: var(--down); stroke-dasharray: 4 4; stroke-width: 1; vector-effect: non-scaling-stroke; }
.lp-root .bd-lines .draw { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.4s var(--ease) 0.3s; }
.lp-root .bd.is-built .bd-lines .draw { stroke-dashoffset: 0; }
.lp-root .bars { display: flex; flex: 1; align-items: stretch; gap: 10px; margin-top: 10px; }
.lp-root .bars div { display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: flex-end; gap: 4px; }
.lp-root .bars span { font: 500 11px/14px var(--font); color: var(--ivory-2); }
.lp-root .bars i { width: 100%; max-width: 34px; height: 0; border-radius: 4px 4px 1px 1px; background: linear-gradient(rgb(196 163 255 / 0.9), rgb(96 38 197 / 0.6)); transition: height 0.8s var(--ease); }
.lp-root .bd.is-built .bars i { height: calc(var(--h) * 0.9); }
.lp-root .bars div { min-height: 120px; }
.lp-root .bars small { font: 500 11px/14px var(--font); color: var(--ivory-3); }
.lp-root .heat { display: grid; flex: 1; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 3px; margin-top: 10px; }
.lp-root .heat span { display: flex; flex-direction: column; justify-content: center; padding: 8px; border-radius: 6px; }
.lp-root .heat b { font: 600 12px/15px var(--font); color: #fff; }
.lp-root .heat em { font: 500 11px/14px var(--font); font-style: normal; color: rgb(255 255 255 / 0.75); }
.lp-root .watch .state { display: inline-flex; align-items: center; gap: 6px; font: 500 12px/16px var(--font); color: var(--ivory-3); }
.lp-root .watch .state i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); animation: pulse 1.6s ease-in-out infinite; }

/* Уведомление наблюдателя рядом с доской: показывает, как результат доходит до человека */
.lp-root .side-note > div { display: grid; justify-items: center; gap: 28px; }
.lp-root .float-note { display: flex; gap: 12px; width: 340px; padding: 14px 16px; border-radius: 20px; color: var(--ivory); background: #050506; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.08), 0 24px 48px -20px rgb(0 0 0 / 0.6); text-align: left; opacity: 0; transform: translateY(16px) scale(0.96); transition: opacity 0.5s, transform 0.7s var(--spring); transition-delay: 1.2s; }
.lp-root .boards.is-in + .side .float-note { opacity: 1; transform: none; }
.lp-root .float-note i { display: grid; flex: none; place-items: center; width: 36px; height: 36px; border-radius: 10px; color: #fff; background: linear-gradient(135deg, #8f5cf0, #3b167f); }
.lp-root .float-note i svg { width: 18px; height: 18px; }
.lp-root .float-note b { display: block; font: 600 14px/18px var(--font); }
.lp-root .float-note span { display: block; margin-top: 2px; font: 400 13px/18px var(--font); color: var(--ivory-2); }

/* ---- 7. Маркетплейс --------------------------------------------------------------------- */
.lp-root .market { min-height: 900px; }
.lp-root .mk { margin-top: 28px; }
.lp-root .mk-types { display: flex; gap: 8px; }
.lp-root .mk-card { margin-top: 16px; overflow: hidden; border: 1px solid var(--line); border-radius: 20px; animation: cond-in 0.4s var(--ease) both; }
.lp-root .mk-cover { position: relative; height: 196px; overflow: hidden; background: radial-gradient(80% 90% at 80% 100%, rgb(96 38 197 / 0.45), transparent 70%), linear-gradient(160deg, #0d0c12, #000); }
.lp-root .mk-cover .tag { position: absolute; top: 14px; left: 14px; background: rgb(0 0 0 / 0.6); }
.lp-root .cv { position: absolute; inset: 0; width: 100%; height: 100%; }
.lp-root .cv-course line { stroke: rgb(225 214 198 / 0.4); stroke-width: 1; }
.lp-root .cv-course rect.u { fill: rgb(225 214 198 / 0.7); }
.lp-root .cv-course rect.d { fill: rgb(225 214 198 / 0.25); }
.lp-root .cv-course .cv-lvl { stroke: var(--accent-ink); stroke-dasharray: 4 4; }
.lp-root .cv-course .cv-vol rect { fill: rgb(225 214 198 / 0.12); }
.lp-root .cv-course text { font: 600 8px/1 var(--font); letter-spacing: 0.16em; fill: var(--accent-ink); }
.lp-root .cv-ind rect { fill: rgb(225 214 198 / 0.22); }
.lp-root .cv-ind rect.poc { fill: var(--accent-ink); }
.lp-root .cv-ind path { stroke: rgb(225 214 198 / 0.7); stroke-width: 1.5; }
.lp-root .cv-tpl line { stroke: rgb(225 214 198 / 0.14); }
.lp-root .cv-tpl .eq { stroke: var(--accent-ink); stroke-width: 2; }
.lp-root .mk-points { position: absolute; inset: 0; display: grid; align-content: center; gap: 10px; padding: 24px 28px; background: rgb(0 0 0 / 0.78); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity 0.35s var(--ease); }
.lp-root .mk-card:hover .mk-points, .lp-root .mk-card:focus-within .mk-points { opacity: 1; }
.lp-root .mk-points li { display: flex; align-items: center; gap: 10px; font: 500 15px/20px var(--font); color: var(--ivory); transform: translateY(6px); transition: transform 0.4s var(--ease); }
.lp-root .mk-card:hover .mk-points li { transform: none; }
.lp-root .mk-points svg { flex: none; width: 16px; height: 16px; color: var(--accent-ink); }
.lp-root .mk-body { padding: 18px 20px 20px; }
.lp-root .mk-body h3 { font: 500 22px/28px var(--font); letter-spacing: -0.015em; color: var(--ivory); }
.lp-root .mk-body > p { margin-top: 6px; font: 400 14px/20px var(--font); color: var(--ivory-3); }
.lp-root .mk-author { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; font: 500 14px/18px var(--font); }
.lp-root .ava { display: grid; flex: none; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: radial-gradient(circle at 30% 25%, #3a3540, #121014); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.12); font: 600 12px/1 var(--font); color: var(--ivory); }
.lp-root .vf { display: grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; color: #fff; background: var(--accent); }
.lp-root .vf svg { width: 11px; height: 11px; stroke-width: 3; }
.lp-root .mk-rate { display: inline-flex; align-items: center; gap: 4px; margin-left: auto; color: var(--ivory-2); }
.lp-root .mk-rate svg { width: 14px; height: 14px; fill: var(--ivory); stroke: none; }
.lp-root .mk-rate b { font-weight: 500; color: var(--ivory); }
.lp-root .mk-rate small { font: 400 13px/18px var(--font); color: var(--ivory-3); }
.lp-root .mk-buy { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.lp-root .mk-buy .stat strong { font-size: 28px; line-height: 32px; }
.lp-root .mk-split { margin-top: 20px; }
.lp-root .mk-split-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font: 600 12px/15px var(--font); letter-spacing: 0.14em; text-transform: uppercase; color: var(--ivory-3); }
.lp-root .mk-split-head .fine { letter-spacing: 0; text-transform: none; }
.lp-root .mk-bar { display: flex; gap: 3px; height: 30px; margin-top: 10px; }
.lp-root .mk-bar i { display: flex; align-items: center; padding: 0 10px; border-radius: 6px; background: rgb(225 214 198 / 0.08); box-shadow: inset 0 0 0 1px var(--line); font-style: normal; }
.lp-root .mk-bar i:first-child { background: linear-gradient(90deg, rgb(96 38 197 / 0.55), rgb(160 106 255 / 0.35)); box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.4); }
.lp-root .mk-bar i:last-child { flex: 1; }
.lp-root .mk-bar i:first-child { overflow: hidden; transition: width 1s var(--ease) 0.3s; }
.lp-root .market:not(.is-in) .mk-bar i:first-child { width: 0 !important; padding: 0; }
.lp-root .mk-bar b { font: 500 12px/1 var(--font); color: var(--ivory); }
.lp-root .mk-legend { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; margin-top: 10px; font: 400 13px/18px var(--font); color: var(--ivory-3); }
.lp-root .mk-legend span { display: inline-flex; align-items: center; gap: 6px; }
.lp-root .mk-legend b { font-weight: 500; color: var(--ivory); }
.lp-root .mk-legend i { width: 8px; height: 8px; border-radius: 2px; }
.lp-root .mk-legend .a { background: var(--accent); }
.lp-root .mk-legend .b { background: rgb(225 214 198 / 0.3); }

/* ---- 8. Пост ---------------------------------------------------------------------------- */
.lp-root .social { min-height: 900px; }
.lp-root .post { margin-top: 28px; padding: 18px; border: 1px solid var(--line); border-radius: 20px; }
.lp-root .post > header { display: flex; align-items: center; gap: 10px; }
.lp-root .post > header > div { display: grid; grid-template-columns: auto auto; justify-content: start; align-items: center; column-gap: 6px; flex: 1; }
.lp-root .post > header b { font: 600 15px/20px var(--font); }
.lp-root .post > header small { grid-column: 1 / -1; font: 400 13px/16px var(--font); color: var(--ivory-3); }
.lp-root .post .ava.v { width: 40px; height: 40px; font-size: 15px; background: radial-gradient(circle at 30% 25%, #5b3a9c, #140b28); }
.lp-root .post > p { margin-top: 14px; font: 400 16px/24px var(--font); color: var(--ivory); }
.lp-root .post-chart { margin-top: 14px; padding: 12px 12px 6px; border-radius: 14px; background: rgb(225 214 198 / 0.03); box-shadow: inset 0 0 0 1px var(--line); }
.lp-root .post-chart figcaption { display: flex; align-items: center; gap: 6px; font: 500 12px/16px var(--font); color: var(--ivory-2); }
.lp-root .post-chart figcaption b { color: var(--ivory); }
.lp-root .post-chart figcaption .tag { margin-left: auto; }
.lp-root .pc-plot { position: relative; margin-top: 8px; padding-right: 54px; }
.lp-root .post-chart svg { width: 100%; height: 110px; }
.lp-root .pc-plot .pt { position: absolute; right: 0; padding: 1px 5px; border-radius: 3px; font: 500 10px/13px var(--font); background: #000; box-shadow: inset 0 0 0 1px currentColor; transform: translateY(-50%); font-variant-numeric: tabular-nums; }
.lp-root .pc-plot .pt.r { color: var(--down); }
.lp-root .pc-plot .pt.s { color: var(--up); }
.lp-root .post-chart .pl { fill: none; stroke: var(--accent-ink); stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.lp-root .post-chart .lvl { stroke: var(--down); stroke-dasharray: 4 4; stroke-width: 1; vector-effect: non-scaling-stroke; }
.lp-root .post-chart .lvl.s { stroke: var(--up); }
.lp-root .vote { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 16px; }
.lp-root .vote > button { position: relative; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 2px 8px; padding: 12px 14px 14px; border: 0; border-radius: 14px; background: transparent; box-shadow: inset 0 0 0 1px var(--line-2); text-align: left; transition: box-shadow 0.2s, background 0.2s, transform 0.2s var(--spring); }
.lp-root .vote > button:hover { box-shadow: inset 0 0 0 1px rgb(225 214 198 / 0.4); }
.lp-root .vote > button:active { transform: scale(0.98); }
.lp-root .vote > button[aria-pressed='true'] { background: var(--accent-soft); box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.8); }
.lp-root .vote small { grid-column: 1 / -1; font: 600 12px/15px var(--font); letter-spacing: 0.14em; text-transform: uppercase; color: var(--ivory-3); }
.lp-root .vote strong { font: 400 30px/32px var(--font); letter-spacing: -0.03em; color: var(--ivory); }
.lp-root .vote strong em { margin-left: 2px; font-style: normal; font-size: 15px; color: var(--ivory-3); }
.lp-root .vote svg { width: 20px; height: 20px; margin-bottom: 4px; }
.lp-root .v-bull svg { color: var(--up); }
.lp-root .v-bear svg { color: var(--down); }
.lp-root .v-line { grid-column: 1 / -1; height: 3px; overflow: hidden; border-radius: 2px; background: rgb(233 134 138 / 0.55); }
.lp-root .v-line i { display: block; height: 100%; background: var(--up); transition: width 0.6s var(--ease); }
.lp-root .v-total { grid-column: 1 / -1; }
.lp-root .post-c { display: flex; gap: 10px; margin-top: 14px; padding: 12px; border-radius: 14px; box-shadow: inset 0 0 0 1px var(--line); }
.lp-root .post-c .ava { width: 26px; height: 26px; font-size: 11px; }
.lp-root .post-c small { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font: 400 12px/16px var(--font); color: var(--ivory-3); }
.lp-root .post-c small b { font-weight: 600; color: var(--ivory); }
.lp-root .post-c small em { margin-left: auto; font-style: normal; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--ivory-4); }
.lp-root .post-c p { margin-top: 3px; font: 400 14px/20px var(--font); color: var(--ivory-2); }
.lp-root .post > footer { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); }
.lp-root .pa { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 10px; border: 0; border-radius: 10px; background: none; font: 500 13px/1 var(--font); color: var(--ivory-2); transition: color 0.16s, background 0.16s; }
.lp-root .pa:hover { color: var(--ivory); background: rgb(225 214 198 / 0.06); }
.lp-root .pa svg { width: 17px; height: 17px; }
.lp-root .pa.on { color: var(--down); }
.lp-root .pa.on svg { fill: currentColor; }
.lp-root .pa.ai { margin-left: auto; color: var(--accent-ink); }

/* ---- 9. Сообщество ---------------------------------------------------------------------- */
.lp-root .comm { min-height: 860px; }
.lp-root .cm { margin-top: 28px; overflow: hidden; border: 1px solid var(--line); border-radius: 20px; }
.lp-root .cm-cover { position: relative; height: 104px; background: linear-gradient(160deg, #0e0c14, #000); }
.lp-root .cm-cover svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.lp-root .cm-cover line { stroke: rgb(225 214 198 / 0.06); }
.lp-root .cm-ava { position: absolute; bottom: -26px; left: 18px; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 16px; background: linear-gradient(145deg, #1b1822, #050506); box-shadow: 0 0 0 4px #000, inset 0 0 0 1px rgb(255 255 255 / 0.12); }
.lp-root .cm-ava svg { width: 26px; height: 26px; }
.lp-root .cm-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; padding: 34px 18px 16px; border-bottom: 1px solid var(--line); }
.lp-root .cm-head > div { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; }
.lp-root .cm-head b { font: 600 17px/22px var(--font); }
.lp-root .cm-head small { flex-basis: 100%; font: 400 13px/18px var(--font); color: var(--ivory-3); }
.lp-root .cm-head .cta.sm, .lp-root .cm-head .ghost { height: 38px; flex: none; }
.lp-root .cm-head .ghost svg { color: var(--up); }
.lp-root .rooms li { display: flex; align-items: center; gap: 12px; padding: 12px 18px; border-bottom: 1px solid var(--line); transition: background 0.6s; }
.lp-root .rooms li:last-child { border-bottom: 0; }
.lp-root .rooms li.flash { animation: flash 1.4s var(--ease); }
@keyframes flash { 0% { background: rgb(160 106 255 / 0.14); } 100% { background: transparent; } }
.lp-root .rooms .hash { display: grid; flex: none; place-items: center; width: 34px; height: 34px; border-radius: 10px; box-shadow: inset 0 0 0 1px var(--line-2); font: 500 16px/1 var(--font); color: var(--ivory-3); }
.lp-root .rooms li > div { display: grid; flex: 1; min-width: 0; }
.lp-root .rooms b { font: 500 15px/20px var(--font); }
.lp-root .rooms small { overflow: hidden; font: 400 13px/18px var(--font); color: var(--ivory-3); text-overflow: ellipsis; white-space: nowrap; }
.lp-root .rooms small em { font-style: normal; color: var(--ivory-2); }
.lp-root .rooms .voice { display: inline-flex; align-items: center; gap: 5px; color: var(--accent-ink); }
.lp-root .rooms .voice { gap: 8px; color: var(--ivory-2); }
.lp-root .rooms .voice em { font-style: normal; font-size: 12px; color: var(--ivory-3); }
.lp-root .vplay { display: grid; place-items: center; width: 22px; height: 22px; padding: 0; border: 0; border-radius: 50%; color: #fff; background: var(--accent); pointer-events: auto; }
.lp-root .vplay svg { width: 11px; height: 11px; }
.lp-root .wave { display: inline-flex; align-items: center; gap: 2px; height: 16px; }
.lp-root .wave i { width: 2px; height: calc(var(--h) * 16px); border-radius: 1px; background: rgb(196 163 255 / 0.75); }
.lp-root .voice.is-on .wave i { animation: wave 0.9s ease-in-out infinite alternate; animation-delay: var(--d); }
@keyframes wave { to { transform: scaleY(0.35); } }
.lp-root .rooms .cnt { min-width: 22px; height: 22px; padding: 0 7px; border-radius: 11px; background: rgb(160 106 255 / 0.18); font: 600 12px/22px var(--font); color: var(--accent-ink); text-align: center; }
.lp-root .rooms .cnt.quiet { background: none; }
.lp-root .cm-compose { display: flex; align-items: center; gap: 10px; margin: 6px 12px 12px; padding: 0 6px 0 16px; height: 48px; border-radius: 24px; box-shadow: inset 0 0 0 1px var(--line-2); font: 400 14px/1 var(--font); color: var(--ivory-3); }
.lp-root .cm-compose span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lp-root .cm-mic { display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; color: var(--ivory); background: rgb(225 214 198 / 0.08); }
.lp-root .cm-mic svg { width: 16px; height: 16px; }

/* ---- 10. Доверие ------------------------------------------------------------------------ */
.lp-root .stages > .pn-in { padding-top: 96px; padding-bottom: 72px; }
.lp-root .backdrop { position: absolute; inset: 0; z-index: 0; overflow: hidden; opacity: 0.4; }
.lp-root .backdrop i { position: absolute; top: -20%; width: 16%; height: 150%; background: linear-gradient(90deg, transparent, rgb(225 214 198 / 0.22), transparent); transform: rotate(24deg); animation: beam 16s ease-in-out infinite alternate; }
.lp-root .backdrop i:nth-child(1) { left: 8%; }
.lp-root .backdrop i:nth-child(2) { left: 30%; width: 7%; animation-duration: 21s; animation-delay: -6s; }
.lp-root .backdrop i:nth-child(3) { left: 66%; width: 22%; animation-duration: 26s; animation-delay: -12s; }
.lp-root .backdrop::before, .lp-root .backdrop::after { content: ''; position: absolute; width: 70%; height: 60%; }
.lp-root .backdrop::before { top: 4%; left: -12%; background: radial-gradient(closest-side, rgb(110 52 220 / 0.7), transparent); animation: drift-a 19s ease-in-out infinite alternate; }
.lp-root .backdrop::after { right: -14%; bottom: 10%; background: radial-gradient(closest-side, rgb(160 148 130 / 0.55), transparent); animation: drift-b 23s ease-in-out infinite alternate; }
@keyframes beam { to { transform: translateX(46%) rotate(24deg); } }
@keyframes drift-a { to { transform: translate(30%, 18%) scale(1.15); } }
@keyframes drift-b { to { transform: translate(-28%, -22%) scale(0.9); } }
.lp-root .vignette { position: absolute; inset: 0; z-index: 0; background: radial-gradient(rgb(0 0 0 / 0.08) 0%, rgb(0 0 0 / 0.02) 34%, rgb(0 0 0 / 0.24) 62%, rgb(0 0 0 / 0.58) 88%, #000 100%), linear-gradient(#000 0%, rgb(0 0 0 / 0.34) 10%, rgb(0 0 0 / 0.08) 34%, rgb(0 0 0 / 0.5) 70%, #000 100%); }
.lp-root .stages-top { display: grid; grid-template-columns: 36.64% minmax(0, 1fr); }
.lp-root .stages-top h2 { max-width: 825px; line-height: 1.12; }
.lp-root .stages-top .lead { max-width: 760px; margin-top: 24px; }
.lp-root .tiers { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; margin-top: 88px; }
.lp-root .tiers section { transition: opacity 0.35s var(--ease); }
@media (hover: hover) { .lp-root .tiers:hover section:not(:hover) { opacity: 0.42; } }
.lp-root .tier-tag { display: inline-block; padding: 2px 8px; border-radius: 24px; font: 500 12px/16px var(--font); }
.lp-root .tone-0 { color: var(--ivory-2); box-shadow: inset 0 0 0 1px var(--line-2); }
.lp-root .tone-1 { color: #fff; background: rgb(63 63 63); }
.lp-root .tone-2 { color: #000; background: rgb(184 184 184); }
.lp-root .tone-3 { color: #000; background: rgb(255 208 143); }
.lp-root .tiers h3 { margin-top: 12px; font: 500 34px/40px var(--font); letter-spacing: -0.03em; text-wrap: balance; }
.lp-root .tier-prog h3 { color: var(--ivory-2); }
.lp-root .tier-prog h3 span { display: block; }
.lp-root .tiers p { max-width: 300px; margin-top: 12px; font: 400 16px/22px var(--font); color: var(--ivory-2); }
.lp-root .tribunal { margin-top: 96px; padding-top: 40px; border-top: 1px solid var(--line); }
.lp-root .trb-head { display: grid; grid-template-columns: 36.64% minmax(0, 1fr); align-items: baseline; }
.lp-root .trb-head h3 { font: 500 36px/42px var(--font); letter-spacing: -0.025em; }
.lp-root .trb-track { position: relative; height: 2px; margin-top: 40px; border-radius: 1px; background: var(--line-2); }
.lp-root .trb-fill { position: absolute; inset: 0 auto 0 0; width: 0; border-radius: 1px; background: linear-gradient(90deg, rgb(96 38 197), var(--accent-ink)); box-shadow: 0 0 12px rgb(160 106 255 / 0.6); transition: width 0.9s var(--ease); }
.lp-root .trb-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin-top: -9px; }
.lp-root .trb-steps button { display: grid; gap: 8px; width: 100%; padding: 0; border: 0; background: none; text-align: left; color: var(--ivory); }
.lp-root .trb-steps button::before { content: ''; width: 16px; height: 16px; border-radius: 50%; background: #000; box-shadow: inset 0 0 0 1.5px var(--line-2); transition: box-shadow 0.4s, background 0.4s; }
.lp-root .trb-steps li.done button::before { background: var(--accent); box-shadow: none; }
.lp-root .trb-steps li.now button::before { background: #000; box-shadow: inset 0 0 0 4px var(--accent-ink), 0 0 0 6px rgb(160 106 255 / 0.18); }
.lp-root .trb-n { margin-top: 10px; font: 600 12px/15px var(--font); letter-spacing: 0.14em; color: var(--ivory-3); }
.lp-root .trb-steps b { font: 500 24px/30px var(--font); letter-spacing: -0.02em; color: var(--ivory-2); transition: color 0.3s; }
.lp-root .trb-steps li.now b, .lp-root .trb-steps li.done b { color: var(--ivory); }
.lp-root .trb-steps span:last-child { max-width: 280px; font: 400 15px/22px var(--font); color: var(--ivory-3); transition: color 0.3s; }
.lp-root .trb-steps li.now span:last-child { color: var(--ivory-2); }
.lp-root .stage-phone { position: relative; width: 375px; height: 846px; margin: 120px auto 0; border-radius: 60px; background: #0a0a0c; box-shadow: inset 0 0 0 2px #56565c, inset 0 0 0 10px #17171a, inset 0 0 0 11px #303036, 0 -40px 120px -40px rgb(138 47 255 / 0.4); }
.lp-root .stage-screen { position: absolute; inset: 11px; overflow: hidden; border-radius: 49px; padding: 0 13px; color: #fff; background: #000; }
.lp-root .stage-screen::before { content: ''; position: absolute; top: 12px; left: 50%; width: 104px; height: 30px; margin-left: -52px; border-radius: 20px; background: #000; box-shadow: 0 0 0 1px rgb(255 255 255 / 0.06); }
.lp-root .stage-bar { display: flex; justify-content: space-between; align-items: center; padding: 18px 16px 0; font: 600 14px/18px var(--font); }
.lp-root .stage-icons { display: flex; gap: 4px; }
.lp-root .stage-icons i { width: 14px; height: 9px; border-radius: 2px; background: rgb(255 255 255 / 0.85); }
.lp-root .stage-icons i:first-child { width: 12px; clip-path: polygon(0 100%, 25% 100%, 25% 70%, 50% 70%, 50% 40%, 75% 40%, 75% 0, 100% 0, 100% 100%); }
.lp-root .stage-icons i:last-child { width: 22px; border-radius: 3px; background: none; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.6), inset -6px 0 0 1px #000, inset 0 0 0 3px rgb(255 255 255 / 0.85); }
.lp-root .stage-hello { margin-top: 74px; font: 400 15px/20px var(--font); color: rgb(255 255 255 / 0.8); }
.lp-root .stage-sum { margin-top: 2px; font: 600 30px/40px var(--font); letter-spacing: -0.02em; }
.lp-root .stage-level { display: inline-flex; align-items: center; gap: 4px; margin-top: 4px; padding: 2px 8px 2px 4px; border-radius: 40px; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.22); font: 400 12px/16px var(--font); }
.lp-root .stage-level i { width: 16px; height: 16px; border-radius: 50%; background: linear-gradient(135deg, #b28aff, #5b21b6); }
.lp-root .stage-mark { position: absolute; top: 108px; right: 13px; width: 107px; height: 132px; }
.lp-root .stage-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-top: 46px; }
.lp-root .stage-tiles section, .lp-root .stage-next, .lp-root .stage-offer { border-radius: 16px; background: #000; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.1); }
.lp-root .stage-tiles section { height: 136px; padding: 20px; }
.lp-root .stage-tiles strong { display: block; font: 400 24px/28px var(--font); letter-spacing: -0.02em; color: var(--ivory); }
.lp-root .stage-tiles span, .lp-root .stage-next span { display: block; margin-top: 12px; font: 400 14px/16px var(--font); color: var(--ivory-2); }
.lp-root .stage-next { display: flex; align-items: center; justify-content: space-between; gap: 8px; height: 56px; margin-top: 8px; padding: 0 20px; }
.lp-root .stage-next span { margin: 0; }
.lp-root .stage-next svg { flex: none; width: 16px; height: 16px; }
.lp-root .stage-screen h4 { margin-top: 32px; font: 500 18px/24px var(--font); }
.lp-root .stage-offer { position: relative; height: 244px; margin-top: 24px; padding: 20px; overflow: hidden; background: radial-gradient(70% 80% at 100% 100%, rgb(96 38 197 / 0.32), transparent 70%), #000 !important; }
.lp-root .stage-offer small { display: block; font: 400 14px/16px var(--font); color: var(--ivory-2); }
.lp-root .stage-offer strong { display: block; margin-top: 8px; font: 500 24px/28px var(--font); color: var(--ivory); }
.lp-root .stage-offer b { position: absolute; bottom: 20px; left: 20px; display: flex; align-items: center; height: 40px; padding: 0 20px; border-radius: 999px; color: rgb(16 16 16); background: #fff; font: 600 15px/16px var(--font); }
.lp-root .stage-offer canvas { position: absolute; right: -8px; bottom: 4px; width: 169px; height: 169px; }
.lp-root .stage-home { width: 134px; height: 5px; margin: 14px auto 0; border-radius: 4px; background: rgb(255 255 255 / 0.9); }
.lp-root .stage-note { width: 375px; max-width: 100%; margin: 28px auto 0; text-align: center; }

/* ---- 11. Кредиты ------------------------------------------------------------------------ */
.lp-root .finance { min-height: 860px; }
.lp-root .finance .coin { position: absolute; top: 12px; right: -24px; z-index: 1; width: clamp(220px, 46%, 320px); height: auto; aspect-ratio: 1; opacity: 0.95; }
.lp-root .finance .pn-in { padding-right: 48px; }
.lp-root .finance h2, .lp-root .finance .lead { max-width: min(330px, 50%); }
.lp-root .finance h2 + .lead { max-width: min(380px, 52%); }
.lp-root .packs { margin-top: 40px; }
.lp-root .pk-list { display: grid; border-top: 1px solid var(--line); }
.lp-root .pk-list button { position: relative; display: grid; grid-template-columns: 20px minmax(0, 1fr) 150px 58px; align-items: center; gap: 14px; min-height: 68px; padding: 0 16px; border: 0; border-bottom: 1px solid var(--line); background: none; text-align: left; transition: background 0.2s; }
.lp-root .pk-list button:hover { background: rgb(225 214 198 / 0.03); }
.lp-root .pk-list button[aria-checked='true'] { border-radius: 14px; border-bottom-color: transparent; background: radial-gradient(120% 140% at 0% 50%, rgb(96 38 197 / 0.22), transparent 60%); box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.7); }
.lp-root .pk-list button[aria-checked='true']::after { content: ''; position: absolute; inset: 0; border-radius: 14px; padding: 1px; background: linear-gradient(110deg, transparent 30%, rgb(255 255 255 / 0.7) 50%, transparent 70%) 0 0 / 250% 100%; -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; animation: rim 3.6s linear infinite; pointer-events: none; }
@keyframes rim { from { background-position: 150% 0; } to { background-position: -150% 0; } }
.lp-root .pk-list .dot { width: 18px; height: 18px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px var(--line-2); transition: box-shadow 0.2s; }
.lp-root .pk-list button[aria-checked='true'] .dot { box-shadow: inset 0 0 0 5px var(--accent-ink); }
.lp-root .pk-name { display: grid; }
.lp-root .pk-name b { display: flex; align-items: center; gap: 8px; }
.lp-root .pk-name .tag { height: 18px; padding: 0 6px; font-size: 10px; }
.lp-root .pk-name b { font: 500 16px/20px var(--font); color: var(--ivory); }
.lp-root .pk-name small { font: 400 13px/18px var(--font); color: var(--ivory-3); }
.lp-root .pk-cr { font: 400 20px/24px var(--font); letter-spacing: -0.02em; color: var(--ivory); text-align: right; }
.lp-root .pk-cr em { margin-left: 4px; font-style: normal; font-size: 12px; letter-spacing: 0; color: var(--ivory-3); }
.lp-root .pk-usd { font: 500 15px/20px var(--font); color: var(--ivory-2); text-align: right; }
.lp-root .pk-act { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; margin-top: 24px; }

/* ---- 12. Tyrian Pro -------------------------------------------------------------------- */
.lp-root .pro { position: relative; isolation: isolate; min-height: 640px; background: #000; }
.lp-root .pro .st-hole { position: absolute; inset: 0; z-index: -2; display: block; width: 100%; height: 100%; }
.lp-root .pro-shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, #000 0%, #000 32%, rgb(0 0 0 / 0.7) 46%, transparent 64%); pointer-events: none; }
.lp-root .pro:not(.has-hole)::before { content: ''; position: absolute; inset: 0; z-index: -2; background: radial-gradient(28% 40% at 76% 52%, #000 40%, transparent 41%), radial-gradient(42% 14% at 76% 52%, rgb(255 190 120 / 0.55), transparent 70%), radial-gradient(40% 60% at 76% 52%, rgb(96 38 197 / 0.3), transparent 70%); }
.lp-root .pro > .pn-in { max-width: 560px; padding-top: 56px; padding-bottom: 56px; }
.lp-root .pro-seg { margin-top: 32px; background: rgb(255 255 255 / 0.06); }
.lp-root .pro-seg button { height: 34px; padding: 0 16px; font-size: 13px; letter-spacing: 0.02em; }
.lp-root .pro-seg em { margin-left: 4px; font-style: normal; color: var(--up); }
.lp-root .pro-seg button[aria-pressed='true'] em { color: #2b6b4b; }
.lp-root .pro-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; margin-top: 28px; }
.lp-root .pro-price strong { font: 400 72px/76px var(--font); letter-spacing: -0.05em; color: var(--ivory); }
.lp-root .pro-price span { font: 400 18px/24px var(--font); color: var(--ivory-3); }
.lp-root .pro-price small { flex-basis: 100%; font: 400 15px/20px var(--font); color: var(--ivory-2); }
.lp-root .pro-price small:empty { display: none; }
.lp-root .pro-list { display: grid; margin-top: 28px; border-top: 1px solid var(--line); }
.lp-root .pro-list li { display: grid; grid-template-columns: 132px minmax(0, 1fr); align-items: baseline; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.lp-root .pro-list b { font: 400 22px/26px var(--font); letter-spacing: -0.02em; color: var(--ivory); }
.lp-root .pro-list span { font: 400 15px/22px var(--font); color: var(--ivory-2); }
.lp-root .pro-act { margin-top: 32px; }
.lp-root .pro-fine { max-width: 440px; margin-top: 18px; }
.lp-root .pro[data-narrow] > .pn-in { padding-top: 224px; }
.lp-root .pro[data-narrow] .pro-shade { background: linear-gradient(180deg, transparent 0, transparent 160px, #000 250px); }

/* ---- 13. Приложение для iPhone --------------------------------------------------------- */
.lp-root .app { background: var(--panel); }
.lp-root .app > .pn-in { padding-top: 96px; padding-bottom: 96px; }
.lp-root .app-head { display: grid; grid-template-columns: 36.64% minmax(0, 1fr); row-gap: 20px; }
.lp-root .app-head h2 { grid-column: 2; grid-row: 1 / span 2; }
.lp-root .app-head .lead { grid-column: 2; max-width: 620px; }
.lp-root .app-grid { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 64px; margin-top: 40px; }
.lp-root .app-step { display: flex; flex-direction: column; justify-content: center; min-height: 62vh; max-width: 520px; padding-left: 28px; border-left: 1px solid var(--line); opacity: 0.32; transition: opacity 0.5s var(--ease), border-color 0.5s; }
.lp-root .app-step.on { opacity: 1; border-left-color: var(--accent); }
.lp-root .app-step h3 { margin-top: 18px; font: 500 44px/50px var(--font); letter-spacing: -0.03em; }
.lp-root .app-step p { margin-top: 16px; font: 400 19px/28px var(--font); color: var(--ivory-2); }
.lp-root .app-step .eyebrow b { color: var(--accent-ink); }
.lp-root .app-stick { position: sticky; top: max(72px, calc(50vh - 380px)); align-self: start; height: 800px; }
.lp-root .app-steps { padding-bottom: 22vh; }
.lp-root .app-dots { display: none; }
.lp-root .iphone { position: relative; width: 372px; height: 790px; margin: 0 auto; border-radius: 62px; background: linear-gradient(145deg, #3d3d42, #1c1c20 40%, #2b2b30); box-shadow: inset 0 0 0 1.5px #6a6a70, inset 0 0 0 4px #222226, 0 40px 80px -30px rgb(0 0 0 / 0.9), 0 -30px 120px -40px rgb(138 47 255 / 0.35); }
.lp-root .iphone::before, .lp-root .iphone::after { content: ''; position: absolute; left: -3px; width: 4px; border-radius: 2px 0 0 2px; background: #3a3a3f; }
.lp-root .iphone::before { top: 170px; height: 34px; }
.lp-root .iphone::after { top: 220px; height: 64px; box-shadow: 0 80px 0 #3a3a3f; }
.lp-root .iphone-screen { position: absolute; inset: 10px; overflow: hidden; border-radius: 52px; background: #000; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.05); }
.lp-root .island { position: absolute; top: 12px; left: 50%; z-index: 5; width: 118px; height: 34px; margin-left: -59px; border-radius: 20px; background: #000; }
.lp-root .home-bar { position: absolute; bottom: 8px; left: 50%; z-index: 5; width: 134px; height: 5px; margin-left: -67px; border-radius: 3px; background: rgb(255 255 255 / 0.85); }
.lp-root .screens { position: absolute; inset: 0; }
.lp-root .sx { position: absolute; inset: 0; padding: 0 18px 30px; color: #fff; opacity: 0; transform: translateY(26px) scale(0.98); transition: opacity 0.5s var(--ease), transform 0.6s var(--ease); pointer-events: none; }
.lp-root .sx.past { transform: translateY(-26px) scale(0.98); }
.lp-root .sx.on { opacity: 1; transform: none; pointer-events: auto; }
.lp-root .sb { display: flex; justify-content: space-between; align-items: center; height: 54px; padding: 0 16px; font: 600 15px/1 var(--font); }
.lp-root .sb-i { display: flex; gap: 5px; }
.lp-root .sb-i i { width: 16px; height: 10px; border-radius: 2px; background: #fff; }
.lp-root .sb-i i:first-child { width: 14px; clip-path: polygon(0 100%, 25% 100%, 25% 70%, 50% 70%, 50% 40%, 75% 40%, 75% 0, 100% 0, 100% 100%); }
.lp-root .sb-i i:last-child { width: 24px; border-radius: 3px; background: none; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.5), inset -7px 0 0 1px #000, inset 0 0 0 3px #fff; }
.lp-root .sx-head { display: grid; gap: 2px; margin-top: 10px; }
.lp-root .sx-head b { font: 600 22px/28px var(--font); letter-spacing: -0.01em; }
.lp-root .sx-head small { font: 400 13px/18px var(--font); color: rgb(255 255 255 / 0.5); }
.lp-root .sx-chat { display: grid; gap: 12px; margin-top: 24px; }
.lp-root .sx-chat .me { justify-self: end; max-width: 80%; padding: 10px 14px; border-radius: 18px 18px 4px 18px; background: #26242c; font: 400 15px/20px var(--font); }
.lp-root .sx-chat .ai { display: flex; gap: 10px; }
.lp-root .sx-chat .ai i { display: grid; flex: none; place-items: center; width: 26px; height: 26px; border-radius: 8px; color: var(--accent-ink); background: var(--accent-soft); }
.lp-root .sx-chat .ai i svg { width: 14px; height: 14px; }
.lp-root .sx-chat .ai p { font: 400 15px/22px var(--font); color: rgb(255 255 255 / 0.9); }
.lp-root .sx-chat .ai.cont { padding-left: 36px; }
.lp-root .sx-mini { flex: 1; padding: 10px 12px 8px; border-radius: 14px; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.1); }
.lp-root .sx-mini figcaption { font: 500 11px/14px var(--font); color: rgb(255 255 255 / 0.55); }
.lp-root .sx-mini figcaption b { color: #fff; font-weight: 600; }
.lp-root .sx-mini svg { display: block; width: 100%; height: 70px; margin-top: 6px; }
.lp-root .sx-mini path { fill: none; stroke: #fff; stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.lp-root .sx-mini line { stroke-width: 1; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.lp-root .sx-mini line.r { stroke: var(--down); } .lp-root .sx-mini line.s { stroke: var(--up); }
.lp-root .sx-input { position: absolute; right: 16px; bottom: 34px; left: 16px; display: flex; align-items: center; justify-content: space-between; height: 48px; padding: 0 6px 0 18px; border-radius: 24px; background: #141416; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.08); font: 400 15px/1 var(--font); color: rgb(255 255 255 / 0.4); }
.lp-root .sx-input i { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; color: #fff; background: radial-gradient(circle at 50% 30%, #8a2fff, #351c8a 70%); }
.lp-root .sx-input i svg { width: 15px; height: 15px; transform: rotate(-45deg); }
.lp-root .sx-tf { display: flex; gap: 6px; margin-top: 16px; }
.lp-root .sx-tf span { padding: 6px 10px; border-radius: 8px; font: 500 13px/1 var(--font); color: rgb(255 255 255 / 0.5); }
.lp-root .sx-tf span.on { color: #fff; background: #1d1c22; }
.lp-root .sx-plot { position: relative; margin-top: 12px; padding-right: 50px; }
.lp-root .sx-chart { display: block; width: 100%; height: 250px; overflow: visible; }
.lp-root .sx-chart .cu line, .lp-root .sx-chart .cd line { stroke-width: 1; vector-effect: non-scaling-stroke; }
.lp-root .sx-chart .cu line { stroke: var(--up); } .lp-root .sx-chart .cu rect { fill: var(--up); }
.lp-root .sx-chart .cd line { stroke: var(--down); } .lp-root .sx-chart .cd rect { fill: var(--down); }
.lp-root .sx-plot .pt { position: absolute; right: 0; padding: 1px 4px; border-radius: 3px; font: 600 10px/13px var(--font); background: #000; box-shadow: inset 0 0 0 1px currentColor; transform: translateY(-50%); }
.lp-root .sx-plot .pt.r { color: var(--down); } .lp-root .sx-plot .pt.s { color: var(--up); }
.lp-root .sx-chart .pl { fill: none; stroke: #fff; stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.lp-root .sx-chart .lv { stroke-width: 1; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.lp-root .sx-chart .lv.r { stroke: var(--down); }
.lp-root .sx-chart .lv.s { stroke: var(--up); }
.lp-root .sx-legend { display: flex; gap: 14px; font: 500 12px/1 var(--font); }
.lp-root .sx-legend span::before { content: ''; display: inline-block; width: 12px; height: 2px; margin-right: 6px; vertical-align: 3px; background: currentColor; }
.lp-root .sx-legend .r { color: var(--down); }
.lp-root .sx-legend .s { color: var(--up); }
.lp-root .sx-card { display: flex; gap: 10px; margin-top: 20px; padding: 14px; border-radius: 16px; background: #121114; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.06); }
.lp-root .sx-card i { display: grid; flex: none; place-items: center; width: 26px; height: 26px; border-radius: 8px; color: var(--accent-ink); background: var(--accent-soft); }
.lp-root .sx-card i svg { width: 14px; height: 14px; }
.lp-root .sx-card p { font: 400 14px/20px var(--font); color: rgb(255 255 255 / 0.85); }
.lp-root .sx-post { margin-top: 16px; padding: 14px; border-radius: 18px; background: #0f0e12; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.06); }
.lp-root .sx-post header { display: flex; align-items: center; gap: 8px; }
.lp-root .sx-post header b { font: 600 14px/1 var(--font); }
.lp-root .sx-post header small { margin-left: auto; font: 400 12px/1 var(--font); color: rgb(255 255 255 / 0.4); }
.lp-root .sx-post .ava { width: 26px; height: 26px; font-size: 11px; }
.lp-root .sx-post p { margin-top: 10px; font: 400 14px/20px var(--font); color: rgb(255 255 255 / 0.88); }
.lp-root .sx-vote { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; padding-bottom: 8px; }
.lp-root .sx-vote span { display: flex; align-items: baseline; justify-content: space-between; padding: 8px 10px; border-radius: 10px; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.1); }
.lp-root .sx-vote small { font: 600 10px/1 var(--font); letter-spacing: 0.12em; text-transform: uppercase; color: rgb(255 255 255 / 0.5); }
.lp-root .sx-vote b { font: 400 18px/1 var(--font); }
.lp-root .sx-vote i { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; border-radius: 1px; background: linear-gradient(90deg, var(--up) var(--w), rgb(233 134 138 / 0.6) var(--w)); }
.lp-root .sx-balance { display: grid; gap: 6px; margin-top: 18px; padding: 18px; border-radius: 20px; background: radial-gradient(90% 120% at 100% 0%, rgb(96 38 197 / 0.4), transparent 60%), #0c0b10; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.07); }
.lp-root .sx-balance small { font: 600 10px/1 var(--font); letter-spacing: 0.14em; text-transform: uppercase; color: rgb(255 255 255 / 0.5); }
.lp-root .sx-balance strong { font: 400 40px/44px var(--font); letter-spacing: -0.04em; }
.lp-root .sx-balance em { margin-left: 6px; font-style: normal; font-size: 14px; letter-spacing: 0; color: rgb(255 255 255 / 0.5); }
.lp-root .sx-pro { position: relative; margin-top: 12px; padding: 18px; overflow: hidden; border-radius: 20px; background: radial-gradient(50% 30% at 85% 30%, rgb(255 190 120 / 0.35), transparent 70%), radial-gradient(22% 30% at 85% 30%, #000 60%, transparent 61%), #050506; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.07); }
.lp-root .sx-pro strong { display: block; margin-top: 10px; font: 400 32px/36px var(--font); letter-spacing: -0.03em; }
.lp-root .sx-pro strong em { font-style: normal; font-size: 14px; color: rgb(255 255 255 / 0.5); }
.lp-root .sx-pro p { margin-top: 4px; font: 400 13px/18px var(--font); color: rgb(255 255 255 / 0.7); }
.lp-root .sx-pro b { display: inline-flex; align-items: center; height: 36px; margin-top: 14px; padding: 0 16px; border-radius: 18px; background: radial-gradient(ellipse 80% 80% at 50% 50%, #8a2fff 0%, #4a21a7 40%, #170840 90%); font: 500 13px/1 var(--font); }
.lp-root .sx-packs { display: grid; gap: 8px; margin-top: 12px; }
.lp-root .sx-packs span { display: grid; grid-template-columns: 1fr auto auto; gap: 10px; align-items: center; height: 46px; padding: 0 14px; border-radius: 14px; box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.08); font: 500 14px/1 var(--font); }
.lp-root .sx-packs span.on { box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.8); background: rgb(160 106 255 / 0.1); }
.lp-root .sx-packs em { font-style: normal; color: rgb(255 255 255 / 0.8); }
.lp-root .sx-packs i { font-style: normal; color: rgb(255 255 255 / 0.5); }
.lp-root .sx-tabs { position: absolute; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: repeat(5, 1fr); height: 82px; padding: 8px 6px 0; background: linear-gradient(rgb(0 0 0 / 0), #000 30%); border-top: 1px solid rgb(255 255 255 / 0.06); }
.lp-root .sx-tabs span { display: grid; justify-items: center; align-content: start; gap: 4px; font: 500 10px/12px var(--font); color: rgb(255 255 255 / 0.42); }
.lp-root .sx-tabs span.on { color: #fff; }
.lp-root .sx-tabs svg { width: 22px; height: 22px; }
.lp-root .sx-post + .sx-post { margin-top: 10px; }
.lp-root .sx.scr-push { background: radial-gradient(120% 50% at 50% 0%, #2a1f4a, #0e0c14 60%, #000); }
.lp-root .sx-lock { display: grid; justify-items: center; padding-top: 70px; }
.lp-root .sx-lock .d { font: 500 18px/1 var(--font); color: rgb(255 255 255 / 0.85); }
.lp-root .sx-lock .tm { margin-top: 8px; font: 300 84px/1 var(--font); letter-spacing: -0.04em; color: rgb(255 255 255 / 0.9); }
.lp-root .sx-n { display: flex; gap: 10px; margin-top: 10px; padding: 12px; border-radius: 20px; background: rgb(255 255 255 / 0.1); box-shadow: inset 0 0 0 1px rgb(255 255 255 / 0.1); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); opacity: 0; transform: translateY(-12px) scale(0.94); transition: opacity 0.4s, transform 0.6s var(--spring); }
.lp-root .sx.on .sx-n { opacity: 1; transform: none; transition-delay: calc(0.3s + var(--i) * 0.35s); }
.lp-root .sx-lock + .sx-n { margin-top: 40px; }
.lp-root .sx-n i { display: grid; flex: none; place-items: center; width: 36px; height: 36px; border-radius: 10px; color: #fff; background: linear-gradient(135deg, #8f5cf0, #3b167f); }
.lp-root .sx-n i svg { width: 18px; height: 18px; }
.lp-root .sx-n > div { flex: 1; min-width: 0; }
.lp-root .sx-n b { font: 600 14px/18px var(--font); }
.lp-root .sx-n p { font: 400 13px/18px var(--font); color: rgb(255 255 255 / 0.85); }
.lp-root .sx-n small { font: 400 12px/18px var(--font); color: rgb(255 255 255 / 0.5); }

/* ---- 14. Безопасность ------------------------------------------------------------------- */
.lp-root .sec-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.9fr) minmax(0, 0.85fr); gap: 40px; align-items: center; }
.lp-root .sec-text h2 + .lead { max-width: 440px; }
.lp-root .sec-steps { margin-top: 32px; border-top: 1px solid var(--line); }
.lp-root .sec-steps li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; align-items: center; gap: 14px; min-height: 62px; border-bottom: 1px solid var(--line); }
.lp-root .sec-steps li > i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: var(--ivory-3); box-shadow: inset 0 0 0 1px var(--line-2); transition: color 0.3s, background 0.3s, box-shadow 0.3s; }
.lp-root .sec-steps li.on > i { color: #fff; background: var(--accent); box-shadow: none; }
.lp-root .sec-steps li > i svg { width: 14px; height: 14px; }
.lp-root .sec-steps li > span { display: grid; }
.lp-root .sec-steps b { font: 500 16px/20px var(--font); }
.lp-root .sec-steps small { font: 400 13px/18px var(--font); color: var(--ivory-3); }
.lp-root .sec-steps .chip { height: 30px; font-size: 12px; }
.lp-root .sec-shield { position: relative; aspect-ratio: 1; max-width: 400px; width: 100%; margin: 0 auto 54px; }
.lp-root .sec-shield canvas { position: absolute; inset: 14%; width: 72%; height: 72%; }
.lp-root .sec-ring { position: absolute; inset: 0; width: 100%; height: 100%; }
.lp-root .sec-ring circle { fill: none; stroke: var(--line-2); stroke-width: 3; stroke-linecap: round; transition: stroke 0.5s var(--ease), filter 0.5s, stroke-dasharray 0.6s var(--ease); }
.lp-root .sec[data-level='5'] .sec-ring circle { stroke-linecap: butt; }
.lp-root .sec-ring circle.on { stroke: var(--accent-ink); filter: drop-shadow(0 0 4px rgb(160 106 255 / 0.7)); }
.lp-root .sec-shield canvas { transition: filter 0.8s var(--ease); }
.lp-root .sec[data-level='5'] .sec-shield canvas { filter: drop-shadow(0 0 28px rgb(160 106 255 / 0.5)); }
.lp-root .sec[data-level='5'] .sec-ring circle.on { stroke: #e6d9ff; filter: drop-shadow(0 0 6px rgb(160 106 255 / 0.95)); }
.lp-root .sec[data-level='5'] .sec-level strong { color: var(--accent-ink); }
.lp-root .sec-level { position: absolute; bottom: -54px; left: 50%; display: grid; justify-items: center; gap: 2px; transform: translateX(-50%); white-space: nowrap; }
.lp-root .sec-level small { font: 600 12px/15px var(--font); letter-spacing: 0.14em; text-transform: uppercase; color: var(--ivory-3); }
.lp-root .sec-level strong { font: 400 22px/26px var(--font); letter-spacing: -0.02em; }
.lp-root .sec-cards { display: grid; gap: 12px; }
.lp-root .sec-cards section { padding: 20px; border: 1px solid var(--line); border-radius: 20px; }
.lp-root .sec-cards header { display: flex; align-items: center; justify-content: space-between; }
.lp-root .otp-ring { width: 24px; height: 24px; transform: rotate(-90deg); }
.lp-root .otp-ring circle { fill: none; stroke: var(--line-2); stroke-width: 3; }
.lp-root .otp-ring .otp-arc { stroke: var(--accent-ink); stroke-dasharray: 94.25; stroke-linecap: round; transition: stroke-dashoffset 0.25s linear, stroke 0.3s; }
.lp-root .otp-late .otp-arc { stroke: var(--down); }
.lp-root .otp-code { margin-top: 14px; font: 300 46px/52px var(--font); letter-spacing: 0.06em; color: var(--ivory); white-space: nowrap; }
.lp-root .otp-code span { display: inline-block; }
.lp-root .otp-code.roll span { animation: roll 0.45s var(--ease) both; }
@keyframes roll { from { opacity: 0; transform: translateY(-40%); filter: blur(4px); } }
.lp-root .otp p, .lp-root .passkey p { margin-top: 8px; }
.lp-root .pk-btn { display: flex; align-items: center; gap: 14px; width: 100%; margin-top: 14px; padding: 12px 14px; border: 0; border-radius: 14px; background: linear-gradient(#141416, #050506); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.08), inset 0 0 0 1px rgb(255 255 255 / 0.08); text-align: left; transition: box-shadow 0.3s; }
.lp-root .pk-btn:hover { box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.1), inset 0 0 0 1px rgb(160 106 255 / 0.55); }
.lp-root .pk-icon { flex: none; width: 40px; height: 40px; color: var(--ivory-2); }
.lp-root .pk-icon .pk-check { stroke: var(--up); stroke-width: 2.6; stroke-dasharray: 30; stroke-dashoffset: 30; opacity: 0; }
.lp-root .pk-btn.is-scan .pk-icon { color: var(--accent-ink); animation: pulse 0.8s ease-in-out infinite; }
.lp-root .pk-btn.is-ok .pk-icon path:not(.pk-check) { opacity: 0.2; transition: opacity 0.3s; }
.lp-root .pk-btn.is-ok .pk-check { opacity: 1; stroke-dashoffset: 0; transition: stroke-dashoffset 0.5s var(--ease); }
.lp-root .pk-btn.is-ok { box-shadow: inset 0 0 0 1px rgb(99 201 154 / 0.6); }
.lp-root .pk-text { font: 500 16px/20px var(--font); color: var(--ivory); }

/* ---- 15. Обещания ---------------------------------------------------------------------- */
.lp-root .promise > .pn-in { display: flex; flex-direction: column; padding-top: 88px; padding-bottom: 88px; }
.lp-root .promise h2 { line-height: 1.12; }
.lp-root .promise-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 36px; margin-top: 64px; text-align: center; }
.lp-root .promise-grid canvas { display: block; width: 240px; height: 240px; margin: 0 auto; }
.lp-root .promise h3 { margin-top: 26px; font: 400 32px/38px var(--font); letter-spacing: -0.02em; color: var(--ivory); }
.lp-root .promise-cta { align-self: center; margin-top: 64px; }
.lp-root .promise-grid p { max-width: 330px; margin: 14px auto 0; font: 400 16px/24px var(--font); color: var(--ivory-2); }

/* ---- 16. Все разделы ------------------------------------------------------------------- */
.lp-root .all-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin: 48px -22px 0; }
/* Только внутренние линии: блок держит панель, второй рамки вокруг клеток нет */
.lp-root .all-grid li { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.lp-root .all-grid li:nth-child(5n) { border-right: 0; }
.lp-root .all-grid li:nth-last-child(-n+5) { border-bottom: 0; }
.lp-root .all-grid a, .lp-root .all-grid button { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; width: 100%; height: 100%; min-height: 168px; padding: 22px; border: 0; background: none; text-align: left; text-decoration: none; color: var(--ivory); transition: background 0.3s; }
.lp-root .all-grid a:hover, .lp-root .all-grid button:hover { background: radial-gradient(90% 90% at 0% 0%, rgb(96 38 197 / 0.2), transparent 70%); }
.lp-root .all-grid i { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 18px; border-radius: 12px; color: var(--ivory); box-shadow: inset 0 0 0 1px var(--line-2); transition: color 0.3s, box-shadow 0.3s; }
.lp-root .all-grid a:hover i, .lp-root .all-grid button:hover i { color: var(--accent-ink); box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.6); }
.lp-root .all-grid i svg { width: 20px; height: 20px; }
.lp-root .all-grid b { font: 500 18px/22px var(--font); }
.lp-root .all-grid span { font: 400 14px/20px var(--font); color: var(--ivory-3); }
.lp-root .all-grid a > svg { position: absolute; top: 24px; right: 20px; width: 16px; height: 16px; color: var(--ivory-4); transition: transform 0.3s var(--ease), color 0.3s; }
.lp-root .all-grid a:hover > svg { color: var(--ivory); transform: translateX(3px); }

/* ---- 17. Вопросы ----------------------------------------------------------------------- */
.lp-root .faq .pn-in { padding-top: 64px; padding-bottom: 64px; }
.lp-root .faq-grid { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 64px; align-items: start; }
.lp-root .faq-grid h2 + .lead { max-width: 380px; }
.lp-root .faq-help { margin-top: 32px; }

/* ---- Тёмная тема: страница вокруг панелей --------------------------------------------- */
html[data-theme='dark'] .lp-root .side { color: var(--ivory-2); }
html[data-theme='dark'] .lp-root .intro { color: var(--ivory); }
html[data-theme='dark'] .lp-root .final h2 { color: var(--ivory); }

/* ---- Окно у́же 1440 --------------------------------------------------------------------- */
@media (max-width: 1439.98px) {
  .lp-root .tiers h3 { font-size: clamp(28px, 2.8vw, 40px); line-height: 1.2; }
  .lp-root .app-step h3 { font-size: clamp(32px, 3vw, 44px); line-height: 1.15; }
  .lp-root .pk-list button { grid-template-columns: 20px minmax(0, 1fr) 150px 52px; }
}

/* Панель кредитов у́же 650: монета уходит в угол, тексту вся ширина */
@media (min-width: 860px) and (max-width: 1379.98px) {
  .lp-root .finance .coin { top: 20px; right: 16px; width: 170px; }
  .lp-root .finance h2 { max-width: calc(100% - 150px); }
  .lp-root .finance h2 + .lead { max-width: none; }
}

@media (max-width: 1279.98px) {
  .lp-root .sec-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); }
  .lp-root .sec-cards { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; }
  .lp-root .pk-name .tag { display: none; }
  .lp-root .pk-name small { display: none; }
  .lp-root .bd-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 1099.98px) {
  .lp-root .intro { left: var(--gutter); top: 56px; }
  .lp-root .intro strong { font-size: 56px; line-height: 68px; }
  .lp-root .intro span { margin-top: 20px; }
  .lp-root .split-head { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .lp-root .all-grid { grid-template-columns: 1fr 1fr; }
  .lp-root .all-grid li:nth-child(5n) { border-right: 1px solid var(--line); }
  .lp-root .all-grid li:nth-child(2n) { border-right: 0; }
  .lp-root .all-grid li:nth-last-child(-n+5) { border-bottom: 1px solid var(--line); }
  .lp-root .all-grid li:nth-last-child(-n+2) { border-bottom: 0; }
  .lp-root .split-head .lead { margin: 0; }
  .lp-root .aid { grid-template-columns: minmax(0, 1fr); }
  .lp-root .tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-root .app-grid { grid-template-columns: minmax(0, 1fr) 360px; gap: 32px; }
  .lp-root .iphone { transform: scale(0.86); transform-origin: top center; }
  .lp-root .app-stick { height: 700px; }
  .lp-root .hero-free b { font-size: 28px; }
  .lp-root .bd-steps { grid-template-columns: 1fr 1fr; }
}

/* ---- Телефон --------------------------------------------------------------------------- */
@media (max-width: 859.98px) {
  .lp-root .intro { position: static; min-height: 0; margin: 4px 0 18px; }
  .lp-root .intro strong { font-size: 52px; line-height: 60px; }
  .lp-root .intro span { margin: 26px 0 0 8px; font-size: 15px; line-height: 20px; }
  .lp-root .hero, .lp-root .hero .pn-in, .lp-root .service, .lp-root .boards, .lp-root .market, .lp-root .social, .lp-root .comm, .lp-root .finance { min-height: 0; }
  .lp-root .hero-free { grid-template-columns: minmax(0, 1fr); margin-top: 24px; }
  .lp-root .hero-free li { display: flex; align-items: baseline; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--line); }
  .lp-root .hero-free li + li { padding-left: 0; border-left: 0; }
  .lp-root .hero-free b { min-width: 44px; font-size: 26px; line-height: 30px; }
  .lp-root .hero-act { justify-content: stretch; }
  .lp-root .hero-act > * { flex: 1; }
  .lp-root .object { height: 380px; }
  .lp-root .side.quote { top: 0; }
  .lp-root .service .pn-in { min-height: 0; }
  .lp-root .phone-box { height: 380px; margin-top: 24px; }
  .lp-root .phone { width: 320px; margin-left: -160px; }
  .lp-root .phone-note { left: 10px; width: 280px; }
  .lp-root .aid { margin-top: 28px; }
  .lp-root .aid-chat { min-height: 0; padding: 14px; }
  .lp-root .aid-log { min-height: 260px; }
  .lp-root .ai-lines, .lp-root .ai-foot { padding-left: 0; }
  .lp-root .ai-lines { padding-left: 14px; }
  .lp-root .aid-chart { min-height: 0; padding: 14px; }
  .lp-root .aid-svg { min-height: 260px; }
  .lp-root .aid-labels span { font-size: 10px; }
  .lp-root .sc { margin-top: 28px; padding: 12px; }
  .lp-root .sc-top { flex-wrap: wrap; }
  .lp-root .sc-lens { padding: 8px; }
  .lp-root .sc-match { flex-basis: 100%; margin: 4px 0 0; padding: 0 4px; }
  .lp-root .sc-ai { flex-wrap: wrap; padding: 0; }
  .lp-root .sc-ai-q { flex-basis: 100%; }
  .lp-root .sc-ai-go { width: 100%; }
  .lp-root .sc-ai-field { height: auto; min-height: 44px; padding: 11px 14px; }
  .lp-root .sc-ai-field span { white-space: normal; }
  .lp-root .sc-sum { grid-template-columns: 1fr 1fr; }
  .lp-root .sc-sum .stat:nth-child(3) { padding-left: 0; border-left: 0; }
  .lp-root .sc-sum .stat:nth-child(n+3) { border-top: 1px solid var(--line); }
  .lp-root .sc-sum .stat strong { font-size: 22px; }
  .lp-root .sc-sum .stat { padding-right: 8px; }
  .lp-root .sc-sum .stat strong { white-space: nowrap; }  /* «11,4 трлн $» не делится: у .stat колонка шаблона minmax(0, 1fr) */
  .lp-root .sc-sum .stat small { letter-spacing: 0.08em; }  /* «КАПИТАЛИЗАЦИЯ» и «РОСТ / ПАДЕНИЕ» в одну строку в ячейке 2 × 2 */
  .lp-root .sc-views .fine { display: none; }
  .lp-root .sc-map { height: 300px; }
  .lp-root .sc-table .c-cap, .lp-root .sc-table .c-ctx, .lp-root .sc-table .c-line { display: none; }
  .lp-root .sc-table td, .lp-root .sc-table th { padding: 0 8px; }
  .lp-root .sc-table td.c-tk small { max-width: 130px; overflow: hidden; text-overflow: ellipsis; }
  .lp-root .bd-grid { grid-template-columns: minmax(0, 1fr); }
  .lp-root .bd-ask { flex-wrap: wrap; }
  .lp-root .mk-types { flex-wrap: wrap; }
  .lp-root .mk-buy { flex-wrap: wrap; }
  .lp-root .mk-buy .cta { flex: 1 1 100%; }
  .lp-root #market .side.low, .lp-root #communities .side.low { padding-bottom: 22px; }
  .lp-root .float-note { width: 100%; max-width: 340px; }
  .lp-root .vote strong { font-size: 26px; }
  .lp-root .pa span { display: none; }
  .lp-root .pa.ai span { display: inline; }
  .lp-root .stages > .pn-in { padding-top: 44px; padding-bottom: 40px; }
  .lp-root .stages-top, .lp-root .trb-head { grid-template-columns: minmax(0, 1fr); }
  .lp-root .stages-top h2 { margin-top: 20px; }
  .lp-root .tiers { grid-template-columns: minmax(0, 1fr); gap: 24px; margin-top: 40px; }
  .lp-root .tiers h3 { font-size: 30px; line-height: 36px; }
  .lp-root .tiers p { max-width: none; }
  .lp-root .tribunal { margin-top: 48px; padding-top: 28px; }
  .lp-root .trb-head h3 { margin-top: 12px; font-size: 26px; line-height: 32px; }
  .lp-root .trb-track { display: none; }
  .lp-root .trb-steps { grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 20px; }
  .lp-root .trb-steps li { padding: 14px 0; border-top: 1px solid var(--line); }
  .lp-root .trb-steps button { grid-template-columns: 16px 1fr; column-gap: 12px; }
  .lp-root .trb-steps button::before { grid-row: span 3; margin-top: 4px; }
  .lp-root .trb-n { margin-top: 0; }
  .lp-root .trb-steps b { font-size: 20px; line-height: 26px; }
  .lp-root .stage-phone { margin: 48px 0 -118px 50%; transform: translateX(-50%) scale(0.86); transform-origin: top center; }
  .lp-root .finance .coin { position: relative; top: auto; right: auto; display: block; width: 260px; height: 260px; margin: -10px auto -30px; }
  .lp-root .finance h2, .lp-root .finance .lead, .lp-root .finance h2 + .lead { max-width: none; }
  .lp-root .finance { display: flex; flex-direction: column; }
  .lp-root .pk-list button { grid-template-columns: 18px minmax(0, 1fr) auto; gap: 10px; min-height: 64px; padding: 0 10px; }
  .lp-root .pk-name .tag { display: none; }
  .lp-root .pk-usd { display: none; }
  .lp-root .pk-cr { font-size: 17px; }
  .lp-root .pk-name small { display: none; }
  .lp-root .pk-list button { min-height: 56px; }
  .lp-root .pk-act .cta { width: 100%; }
  .lp-root .pro > .pn-in { padding-bottom: 32px; }
  .lp-root .pro-price strong { font-size: 56px; line-height: 60px; }
  .lp-root .pro-list li { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .lp-root .pro-act .cta { width: 100%; }
  .lp-root .app > .pn-in { padding-top: 44px; padding-bottom: 44px; }
  .lp-root .app-head { grid-template-columns: minmax(0, 1fr); }
  .lp-root .app-head h2, .lp-root .app-head .lead { grid-column: 1; grid-row: auto; }
  .lp-root .app-grid { display: flex; flex-direction: column-reverse; gap: 20px; margin-top: 28px; }
  .lp-root .app-stick { position: static; min-width: 0; width: 100%; height: auto; padding-top: 0; }
  .lp-root .app-dots { display: flex; gap: 6px; overflow-x: auto; margin-bottom: 16px; scrollbar-width: none; }
  .lp-root .app-dots::-webkit-scrollbar { display: none; }
  .lp-root .app-dots button { display: inline-flex; flex: none; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border: 0; border-radius: 999px; background: none; box-shadow: inset 0 0 0 1px var(--line); font: 500 13px/1 var(--font); color: var(--ivory-3); }
  .lp-root .app-dots button span { font-size: 11px; color: var(--ivory-4); }
  .lp-root .app-dots button[aria-selected='true'] { color: #000; background: var(--ivory); box-shadow: none; }
  .lp-root .app-dots button[aria-selected='true'] span { color: rgb(0 0 0 / 0.5); }
  .lp-root .iphone { left: 50%; margin: 0 0 -118px -186px; transform: scale(0.85); }
  .lp-root .app-steps { padding-bottom: 0; }
  .lp-root .app-step { display: none; min-height: 0; padding-left: 0; border-left: 0; }
  .lp-root .app-step.on { display: flex; opacity: 1; }
  .lp-root .app-step h3 { font-size: 28px; line-height: 34px; }
  .lp-root .app-step p { font-size: 16px; line-height: 24px; }
  .lp-root .sec-grid { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .lp-root .sec-shield { max-width: 300px; }
  .lp-root .sec-cards { grid-template-columns: minmax(0, 1fr); }
  .lp-root .otp-code { font-size: 40px; }
  .lp-root .promise > .pn-in { padding-top: 44px; padding-bottom: 48px; }
  .lp-root .promise-grid { grid-template-columns: minmax(0, 1fr); gap: 40px; margin-top: 36px; }
  .lp-root .promise-grid canvas { width: 200px; height: 200px; }
  .lp-root .promise h3 { font-size: 26px; line-height: 32px; }
  .lp-root .promise-cta { align-self: stretch; margin-top: 40px; }
  .lp-root .all-grid { grid-template-columns: 1fr 1fr; margin: 28px -14px 0; }
  .lp-root .all-grid a, .lp-root .all-grid button { min-height: 0; padding: 16px 14px; }
  .lp-root .all-grid i { margin-bottom: 8px; width: 34px; height: 34px; }
  .lp-root .all-grid b { font-size: 16px; }
  .lp-root .all-grid span { font-size: 13px; line-height: 18px; }
  .lp-root .all-grid a > svg { display: none; }
  .lp-root .faq .pn-in { padding-top: 32px; padding-bottom: 32px; }
  .lp-root .faq-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .lp-root .faq-help { margin-top: 20px; }
}

/* Узкий планшет (560…860): один столбец панелей, но содержимое примеров ещё помещается в несколько колонок */
@media (min-width: 560px) and (max-width: 859.98px) {
  .lp-root .bd-grid { grid-template-columns: 1fr 1fr; }
  .lp-root .sc-sum { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .lp-root .sc-sum .stat:nth-child(3) { padding-left: 16px; border-left: 1px solid var(--line); }
  .lp-root .sc-sum .stat:nth-child(n+3) { border-top: 0; }
  .lp-root .sc-table .c-cap { display: table-cell; }
  .lp-root .sec-cards { grid-template-columns: 1fr 1fr; }
  .lp-root .hero-free { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .lp-root .hero-free li { display: grid; border-bottom: 0; }
  .lp-root .hero-free li + li { padding-left: 16px; border-left: 1px solid var(--line); }
  .lp-root .tiers { grid-template-columns: 1fr 1fr; }
  .lp-root .promise-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
  .lp-root .promise-grid canvas { width: 160px; height: 160px; }
  .lp-root .promise h3 { font-size: 22px; line-height: 28px; }
}

@media (max-width: 419.98px) {
  .lp-root .phone { width: 300px; margin-left: -150px; }
  .lp-root .phone-note { width: 262px; }
  .lp-root .iphone { transform: scale(0.8); margin-bottom: -158px; }
  .lp-root .vote > button { padding: 10px 12px 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .lp-root .backdrop i, .lp-root .backdrop::before, .lp-root .backdrop::after, .lp-root .pk-list button[aria-checked='true']::after { animation: none; }
  .lp-root .phone-note, .lp-root .tile-b, .lp-root .sx, .lp-root .sx-n, .lp-root .aid-svg .lvl, .lp-root .bars i, .lp-root .bd-lines .draw { transition: none !important; }
  .lp-root .tile, .lp-root .cond, .lp-root .mk-card { animation: none; }
}

/* tyrian/tyrian-look.css */
/* Лендинг Tyrian Trade: примеры интерфейса в новом виде (светлые в светлой теме, общая культура «Студии»).
 * Общие токены, панели, шапка и подвал: ../shared/look.css. */

html[data-theme='light'] .lp-root[data-look] .pk-btn { background: linear-gradient(#fff, #f3f2f6); box-shadow: inset 0 1px 0 #fff, inset 0 0 0 1px rgb(16 15 20 / 0.1); }
html[data-theme='light'] .lp-root[data-look] .pk-btn:hover { box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.55); }
html[data-theme='light'] .lp-root[data-look] .pk-btn.is-ok { box-shadow: inset 0 0 0 1px rgb(19 137 92 / 0.6); }

/* ---- Примеры интерфейса: прежние «слоновая кость с прозрачностью» и чёрные подложки ------- */
.lp-root[data-look] .msg.me { background: rgb(var(--ink) / 0.07); }
html[data-theme='light'] .lp-root[data-look] .msg-att { background: rgb(16 15 20 / 0.06); }
.lp-root[data-look] .aid-input { background: rgb(var(--ink) / 0.04); }
.lp-root[data-look] .aid-input.is-typing { box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.6); }
.lp-root[data-look] .aid-axis span.now { color: var(--on-ink); }
.lp-root[data-look] .aid-svg .grid { stroke: rgb(var(--ink) / 0.07); }
.lp-root[data-look] .aid-labels span { background: var(--solid); }
html[data-theme='light'] .lp-root[data-look] .aid-chart { background: radial-gradient(90% 60% at 70% 110%, rgb(160 106 255 / 0.1), transparent 70%); }
html[data-theme='light'] .lp-root[data-look] .aid-svg .cu line { stroke: rgb(19 137 92 / 0.9); }
html[data-theme='light'] .lp-root[data-look] .aid-svg .cu rect { fill: rgb(19 137 92 / 0.85); }
html[data-theme='light'] .lp-root[data-look] .aid-svg .cd line { stroke: rgb(207 63 76 / 0.9); }
html[data-theme='light'] .lp-root[data-look] .aid-svg .cd rect { fill: rgb(207 63 76 / 0.85); }
html[data-theme='light'] .lp-root[data-look] .aid-svg .vu { fill: rgb(19 137 92 / 0.22); }
html[data-theme='light'] .lp-root[data-look] .aid-svg .vd { fill: rgb(207 63 76 / 0.2); }
html[data-theme='light'] .lp-root[data-look] .aid-svg .lvl.fib { stroke: rgb(123 63 242 / 0.85); }
html[data-theme='light'] .lp-root[data-look] .aid-svg .lvl.fibd { stroke: rgb(123 63 242 / 0.5); }
.lp-root[data-look] .sc-classes button[aria-selected='true'] { color: var(--on-ink); }
html[data-theme='light'] .lp-root[data-look] .sc-classes button[aria-selected='true'] i { color: rgb(255 255 255 / 0.6); }
.lp-root[data-look] .sc-lens, .lp-root[data-look] .bd-ask { background: rgb(var(--ink) / 0.035); }
html[data-theme='light'] .lp-root[data-look] .cond { background: #fff; box-shadow: inset 0 0 0 1px var(--line-2), 0 1px 2px rgb(40 30 70 / 0.06); }
html[data-theme='light'] .lp-root[data-look] .cond:hover { box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.55); }
html[data-theme='light'] .lp-root[data-look] .cond.is-proposed { background: transparent; box-shadow: none; }
.lp-root[data-look] .sc-add:hover { border-color: rgb(var(--ink) / 0.4); }
.lp-root[data-look] .sc-menu, .lp-root[data-look] .sc-tip { background: var(--solid); box-shadow: inset 0 0 0 1px var(--line-2), 0 20px 40px var(--shade); }
.lp-root[data-look] .sc-menu button:hover { background: rgb(var(--ink) / 0.07); }
.lp-root[data-look] .sc-view-seg button[aria-pressed='true'] { background: rgb(var(--ink) / 0.1); }
.lp-root[data-look] .sc-table th, .lp-root[data-look] .pn:not(.is-soft) .sc-table th { background: var(--solid); }
.lp-root[data-look] .sc-table tbody tr:hover { background: rgb(var(--ink) / 0.04); }
.lp-root[data-look] .sc-table tr.is-hit { background: var(--accent-soft); }
html[data-theme='light'] .lp-root[data-look] .logo { box-shadow: inset 0 0 0 1px rgb(0 0 0 / 0.08); }
/* Тепловая карта и мини-карта считаются в скрипте тёмными оттенками: в светлой теме тот же рисунок, но
   светлота вывернута (оттенок сохраняется), подписи становятся тёмными. */
html[data-theme='light'] .lp-root[data-look] :is(.sc-map, .heat) { filter: invert(1) hue-rotate(180deg) saturate(1.3); }
.lp-root[data-look] .float-note { background: var(--solid); box-shadow: inset 0 0 0 1px var(--line), 0 24px 48px -20px var(--shade); }
html[data-theme='light'] .lp-root[data-look] .mk-cover { background: radial-gradient(80% 90% at 80% 100%, rgb(160 106 255 / 0.2), transparent 70%), linear-gradient(160deg, #f7f6fa, #ebe8f1); }
html[data-theme='light'] .lp-root[data-look] .mk-cover .tag { background: rgb(255 255 255 / 0.75); }
.lp-root[data-look] .cv-course line { stroke: rgb(var(--ink) / 0.4); }
.lp-root[data-look] .cv-course rect.u { fill: rgb(var(--ink) / 0.7); }
.lp-root[data-look] .cv-course rect.d { fill: rgb(var(--ink) / 0.25); }
.lp-root[data-look] .cv-course .cv-vol rect { fill: rgb(var(--ink) / 0.12); }
.lp-root[data-look] .cv-ind rect { fill: rgb(var(--ink) / 0.22); }
.lp-root[data-look] .cv-ind rect.poc { fill: var(--accent-ink); }
.lp-root[data-look] .cv-ind path { stroke: rgb(var(--ink) / 0.7); }
.lp-root[data-look] .cv-tpl line { stroke: rgb(var(--ink) / 0.14); }
html[data-theme='light'] .lp-root[data-look] .mk-points { background: rgb(255 255 255 / 0.86); }
html[data-theme='light'] .lp-root[data-look] .ava { color: #101014; background: radial-gradient(circle at 30% 25%, #fff, #e3e0ea); box-shadow: inset 0 0 0 1px rgb(16 15 20 / 0.1); }
html[data-theme='light'] .lp-root[data-look] .post .ava.v { color: #fff; background: radial-gradient(circle at 30% 25%, #8f5cf0, #3b167f); }
.lp-root[data-look] .mk-bar i { background: rgb(var(--ink) / 0.07); }
.lp-root[data-look] .mk-bar i:first-child { background: linear-gradient(90deg, rgb(96 38 197 / 0.55), rgb(160 106 255 / 0.35)); }
html[data-theme='light'] .lp-root[data-look] .mk-bar i:first-child { background: linear-gradient(90deg, rgb(123 63 242 / 0.3), rgb(160 106 255 / 0.16)); }
.lp-root[data-look] .mk-legend .b { background: rgb(var(--ink) / 0.3); }
.lp-root[data-look] .post-chart { background: rgb(var(--ink) / 0.025); }
.lp-root[data-look] .pc-plot .pt { background: var(--solid); }
.lp-root[data-look] .vote > button:hover { box-shadow: inset 0 0 0 1px rgb(var(--ink) / 0.4); }
.lp-root[data-look] .vote > button[aria-pressed='true'] { background: var(--accent-soft); box-shadow: inset 0 0 0 1px rgb(160 106 255 / 0.8); }
.lp-root[data-look] .pa:hover { background: rgb(var(--ink) / 0.06); }
html[data-theme='light'] .lp-root[data-look] .cm-cover { background: linear-gradient(160deg, #f6f4f9, #ebe8f1); }
.lp-root[data-look] .cm-cover line { stroke: rgb(var(--ink) / 0.07); }
html[data-theme='light'] .lp-root[data-look] .cm-ava { background: linear-gradient(145deg, #fff, #eeecf2); box-shadow: 0 0 0 4px var(--solid), inset 0 0 0 1px rgb(16 15 20 / 0.12); }
html[data-theme='light'] .lp-root[data-look] .cm-ava svg path { fill: #101014; }
.lp-root[data-look] .cm-mic { background: rgb(var(--ink) / 0.07); }
.lp-root[data-look] .trb-steps button::before { background: var(--solid); }
.lp-root[data-look] .trb-steps li.done button::before { background: var(--accent); }
.lp-root[data-look] .trb-steps li.now button::before { background: var(--solid); }
.lp-root[data-look] .pk-list button:hover { background: rgb(var(--ink) / 0.03); }
.lp-root[data-look] .pk-list button[aria-checked='true'] { background: radial-gradient(120% 140% at 0% 50%, rgb(96 38 197 / 0.2), transparent 60%); }
html[data-theme='light'] .lp-root[data-look] .pk-list button[aria-checked='true'] { background: radial-gradient(120% 140% at 0% 50%, rgb(160 106 255 / 0.12), transparent 60%); }
html[data-theme='light'] .lp-root[data-look] .pk-list button[aria-checked='true']::after { background: linear-gradient(110deg, transparent 30%, rgb(160 106 255 / 0.9) 50%, transparent 70%) 0 0 / 250% 100%; }
html[data-theme='light'] .lp-root[data-look] .sec[data-level='5'] .sec-ring circle.on { stroke: var(--accent); }
html[data-theme='light'] .lp-root[data-look] .sec-ring circle.on { filter: none; }
html[data-theme='light'] .lp-root[data-look] .sec[data-level='5'] .sec-shield canvas { filter: none; }
.lp-root[data-look] .app-dots button[aria-selected='true'] { color: var(--on-ink); }
html[data-theme='light'] .lp-root[data-look] .app-dots button[aria-selected='true'] span { color: rgb(255 255 255 / 0.6); }

/* Доверие: лучи и дымка за текстом. В светлой теме это мягкий дневной свет, без чёрной виньетки */
html[data-theme='light'] .lp-root[data-look] .stages .backdrop { opacity: 0.55; }
html[data-theme='light'] .lp-root[data-look] .stages .backdrop i { background: linear-gradient(90deg, transparent, rgb(255 255 255 / 0.9), transparent); }
html[data-theme='light'] .lp-root[data-look] .stages .backdrop::before { background: radial-gradient(closest-side, rgb(160 106 255 / 0.28), transparent); }
html[data-theme='light'] .lp-root[data-look] .stages .backdrop::after { background: radial-gradient(closest-side, rgb(214 200 255 / 0.4), transparent); }
html[data-theme='light'] .lp-root[data-look] .stages .vignette { display: none; }

/* Пустая панель со знаком: предмет стоит в своём свете */
.lp-root[data-look] .object { isolation: isolate; }
.lp-root[data-look] .object::before { content: ''; position: absolute; inset: 0; z-index: 0; background: var(--lk-stage, none); pointer-events: none; }
.lp-root[data-look] .object canvas { z-index: 1; }

/* «Студия»: дымка в «Доверии» нейтральная, без фиолетового пятна */
.lp-root[data-look='b'] .stages .backdrop::before { background: radial-gradient(closest-side, rgb(255 255 255 / 0.1), transparent); }
html[data-theme='light'] .lp-root[data-look='b'] .stages .backdrop::before { background: radial-gradient(closest-side, rgb(255 255 255 / 0.9), transparent); }
html[data-theme='light'] .lp-root[data-look='b'] .stages .backdrop::after { background: radial-gradient(closest-side, rgb(220 222 228 / 0.5), transparent); }

/* «Студия»: кольцо защиты без свечения, только цвет */
.lp-root[data-look='b'] .sec-ring circle.on, .lp-root[data-look='b'] .sec[data-level='5'] .sec-ring circle.on { filter: none; }
.lp-root[data-look='b'] .sec[data-level='5'] .sec-shield canvas { filter: none; }