/* VELAR V20 homepage — «Знак — это данные». One dark theme for the whole page.
   Plan: docs/v20-homepage-plan.md. Rules: docs/research/v20/R3-skills-constitution.md. */

/* Metric-matched fallbacks (docs/research/v20/R6-type-color.md §6.2): while a web font loads, the
   fallback occupies the same width, so nothing reflows on swap. */
@font-face{font-family:'Science Gothic Fallback';src:local('Verdana');size-adjust:103.93%;ascent-override:104.69%;descent-override:37.33%;line-gap-override:0%}
@font-face{font-family:'Science Gothic Fallback R';src:local('Roboto');size-adjust:116.32%;ascent-override:93.53%;descent-override:33.36%;line-gap-override:0%}
@font-face{font-family:'Onest Fallback';src:local('Arial');size-adjust:103.96%;ascent-override:93.3%;descent-override:29.34%;line-gap-override:0%}
@font-face{font-family:'Onest Fallback R';src:local('Roboto');size-adjust:103.3%;ascent-override:93.9%;descent-override:29.53%;line-gap-override:0%}

body.velar-lab{
  /* Cinematic palette (owner's choice, 29.09): near-black with a warm undertone, lit by amber,
     ember and gold. Gains stay neutral outside the market chart; loss is the semantic colour. */
  --void:#06070B;--base:#0B0D12;--surface:#12151C;--raised:#1A1E27;--overlay:#242935;
  --bone:#F3EEE6;--text-2:#D6D2CB;--text-3:#ABA69E;--text-4:#6E6A64;
  /* chart-interface.css объявляет :root{--muted:#54647a} (светлая тема) и грузится раньше
     этого файла, не переопределяя токен для тёмной страницы: .section-heading>p получал
     #54647A на #06070B — 3,34:1, ниже 4,5 (1.4.3 AA). Здесь токен возвращается к тёмной
     палитре: #8A94A6 на #06070B — 6,58:1. */
  --muted:#8A94A6;
  --rule:#23262E;--rule-strong:#5E626B;
  --amber:#FFB240;--amber-ink:#1F1405;--ember:#FF5C36;--gold:#FFD37A;--focus:#FFD37A;--loss:#FF7B6E;--gain:var(--bone);
  --up:#2FD49A;--down:#FF5C5C;--glow:rgb(255 178 64/.28);
  --hatch:repeating-linear-gradient(135deg,rgb(238 235 229/.2) 0 1px,transparent 1px 6px);
  --font-display:'Science Gothic','Science Gothic Fallback','Science Gothic Fallback R','Onest',sans-serif;
  --font-text:'Onest','Onest Fallback','Onest Fallback R','Noto Sans Georgian','Noto Sans Armenian','Noto Sans Math',system-ui,sans-serif;
  --font-mono:'Geist Mono','Noto Sans Math',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --interface-font:var(--font-text);--font:var(--font-text);
  --ease-out:cubic-bezier(.22,1,.36,1);--ease-in-out:cubic-bezier(.65,0,.35,1);
  --ease-enter:cubic-bezier(.05,.7,.1,1);--ease-exit:cubic-bezier(.3,0,.8,.15);
  --dur-press:90ms;--dur-hover:160ms;--dur-out:240ms;--dur-panel-in:240ms;--dur-panel-out:160ms;--dur-reveal:640ms;
  --r-control:2px;--r-panel:4px;
  /* The sign's outline travels inside the stylesheet: a separate request would hold back the
     first screen's largest paint. Source files: assets/brand/btc-sign.svg, v-mark.svg. */
  --sign-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22159.671%20-1564.69%201261.65%201726.49%22%20width%3D%221261.65%22%20height%3D%221726.49%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M435.4%20161.8V-339.3H659.9V161.8ZM760.5%20161.8V-339.3H985V161.8ZM159.7%200V-1400H1024.9Q1117.9%20-1400%201188.9%20-1380Q1259.9%20-1360%201308%20-1318.6Q1356%20-1277.3%201380.7%20-1213.7Q1405.3%20-1150.1%201405.3%20-1063.2V-997.5Q1405.3%20-895.9%201362.5%20-824.2Q1319.6%20-752.5%201229.8%20-709.9Q1330.9%20-667.9%201376.1%20-588.3Q1421.3%20-508.7%201421.3%20-395.6V-333.1Q1421.3%20-246%201397.2%20-182.8Q1373.1%20-119.5%201325.6%20-79.1Q1278.1%20-38.6%201206.8%20-19.3Q1135.5%200%201040.9%200ZM632.7%20-339.3H858.9Q900.9%20-339.3%20920.2%20-357.6Q939.5%20-375.9%20939.5%20-409.6V-470.9Q939.5%20-506.7%20920.2%20-524.4Q900.9%20-542%20858.9%20-542H632.7ZM632.7%20-869.9H854.4Q896.4%20-869.9%20915.7%20-887.6Q935.1%20-905.3%20935.1%20-941.1V-993.3Q935.1%20-1027%20915.7%20-1045.3Q896.4%20-1063.6%20854.4%20-1063.6H632.7ZM435.4%20-1063.6V-1564.7H659.9V-1063.6ZM760.5%20-1063.6V-1564.7H985V-1063.6Z%22%2F%3E%3C%2Fsvg%3E");
  --mark-mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-2.4%20-1400%201547%201400%22%20width%3D%221547%22%20height%3D%221400%22%3E%3Cpath%20fill%3D%22%23fff%22%20d%3D%22M621.7%200%20-2.4%20-1400H424.8L792.6%20-505.6L1152.8%20-1400H1544.5L938.7%200Z%22%2F%3E%3C%2Fsvg%3E");
  --gutter:48px;--pitch:4px;
  /* One 2 px square per 4 px cell, drawn as a gradient: an image here would make the decorative
     sign the page's largest contentful element, and the headline must be that. */
  --dot:conic-gradient(at 2px 2px,transparent 270deg,#D08A33 0);
  color-scheme:dark;margin:0;background:var(--void);color:var(--bone);
  font-family:var(--font-text);font-size:16px;line-height:1.6;font-synthesis:none;
  font-variant-numeric:proportional-nums;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
}
html:lang(ka) body.velar-lab{--font-display:'Noto Sans Georgian','Onest','Noto Sans Math',sans-serif;--font-text:'Noto Sans Georgian','Onest','Onest Fallback','Noto Sans Math',system-ui,sans-serif}
html:lang(hy) body.velar-lab{--font-display:'Noto Sans Armenian','Onest','Noto Sans Math',sans-serif;--font-text:'Noto Sans Armenian','Onest','Onest Fallback','Noto Sans Math',system-ui,sans-serif}
html:has(body.velar-lab){background:#090B0F;scroll-padding-top:88px;scrollbar-color:#757B83 #090B0F}
body.velar-lab ::selection{background:#F8BC49;color:#24180A}
body.velar-lab :focus-visible{outline:2px solid var(--focus);outline-offset:2px}
body.velar-lab input,body.velar-lab select,body.velar-lab textarea{caret-color:var(--amber);accent-color:var(--amber)}
body.velar-lab h1,body.velar-lab h2,body.velar-lab h3{color:var(--bone);font-family:var(--font-display);font-weight:540;text-wrap:balance}
body.velar-lab p{text-wrap:pretty}
body.velar-lab a{color:inherit}
body.velar-lab .wrap{max-width:1440px;margin-inline:auto;padding-inline:var(--gutter);box-sizing:border-box}
body.velar-lab .ui-icon{width:16px;height:16px;flex:none}

/* Skip link: visible on focus, readable on the dark ground. */
body.velar-lab .skip-link{background:var(--bone);color:var(--void);border:0;border-radius:var(--r-control);font-weight:600}

/* DEMO band: hatch means synthetic, everywhere on the page. It is painted first and never moves. */
body.velar-lab .demo-strip{display:flex;align-items:center;justify-content:flex-start;gap:14px;min-height:32px;padding:6px var(--gutter);background:var(--void);color:var(--text-3);font-size:12px;line-height:1.35;font-weight:500;border-bottom:1px solid var(--rule);text-align:left}
body.velar-lab .demo-strip .demo-tab{flex:none;display:inline-grid;place-items:center;min-width:56px;height:20px;padding:0 8px;box-sizing:border-box;border:1px solid var(--rule-strong);background:var(--hatch),var(--base);color:var(--bone);font:500 11px/1 var(--font-mono);letter-spacing:.12em}

/* Header: sticky and quiet. The hatched DEMO tag beside the wordmark keeps the page's status in
   view on every screen; the band above it scrolls away with the first screen. */
body.velar-lab .site-header{position:sticky;top:0;z-index:30;height:64px;display:flex;align-items:center;gap:32px;max-width:none;padding-inline:var(--gutter);margin:0;background:rgb(9 11 15/.86);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--rule)}
body.velar-lab .site-header .brand-wordmark{display:inline-flex;align-items:center;min-height:44px;color:var(--bone);text-decoration:none;flex:none}
body.velar-lab .site-header .brand-wordmark svg{display:block;width:92px;height:auto}
body.velar-lab .header-demo{flex:none;display:inline-grid;place-items:center;height:22px;padding:0 8px;margin-left:-16px;border:1px solid var(--rule-strong);background:var(--hatch),var(--base);color:var(--bone);font:500 12px/1 var(--font-mono);letter-spacing:.12em;border-radius:var(--r-control)}
body.velar-lab .site-header .desktop-nav{display:flex;gap:28px;margin-inline:auto;color:var(--text-2);font-size:14px;font-weight:500}
body.velar-lab .site-header .desktop-nav a{display:inline-flex;align-items:center;min-height:44px;color:inherit;text-decoration:none;white-space:nowrap;transition:color var(--dur-out) var(--ease-out)}
body.velar-lab .site-header .header-tools{display:flex;align-items:center;gap:12px;margin-left:auto}
body.velar-lab .language-control.language-compact{width:auto;height:44px;border:1px solid var(--rule-strong);border-radius:var(--r-control);background:transparent;color:var(--bone)}
body.velar-lab .language-control.language-compact .language-current{color:var(--bone);font:500 12px/1 var(--font-mono);letter-spacing:.04em}
body.velar-lab .landing-menu-button{display:none;width:44px;height:44px;align-items:center;justify-content:center;border:1px solid var(--rule-strong);border-radius:var(--r-control);background:transparent;color:var(--bone);cursor:pointer}

/* Buttons. Two shapes only: the amber primary and a hairline outline. */
body.velar-lab .button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:44px;padding:0 18px;border-radius:var(--r-control);border:1px solid transparent;font:600 15px/1 var(--font-text);letter-spacing:0;text-decoration:none;cursor:pointer;box-shadow:none;transition:background-color var(--dur-out) var(--ease-out),border-color var(--dur-out) var(--ease-out),color var(--dur-out) var(--ease-out),transform var(--dur-press) var(--ease-out)}
body.velar-lab .button-outline,body.velar-lab .header-account{background:transparent;border-color:var(--rule-strong);color:var(--bone);font-size:14px;font-weight:500;min-height:44px;padding:0 16px}
body.velar-lab .lab-cta{min-height:56px;padding:0 24px;background:var(--amber);color:var(--amber-ink);border-color:var(--amber);font-size:16px}
/* The bare primary .button had no fill of its own: landing-referral.js emits retry
   actions as <button class="button"> with nothing else, so they read as plain text
   while remaining pressable. Give that shape the amber primary it claims to be. */
body.velar-lab .landing-referral-calculator [data-referral-retry]{min-height:44px;padding:0 16px;background:var(--amber);color:var(--amber-ink);border-color:var(--amber);font-size:14px;font-weight:600}
body.velar-lab .button:active{transform:scale(.98);transition-duration:var(--dur-press)}
@media(hover:hover) and (pointer:fine){
  body.velar-lab .site-header .desktop-nav a:hover{color:var(--bone);transition-duration:0s}
  body.velar-lab .button-outline:hover,body.velar-lab .header-account:hover{border-color:var(--bone);transition-duration:0s}
  body.velar-lab .lab-cta:hover{background:#FAC862;transition-duration:0s}
  body.velar-lab .landing-referral-calculator [data-referral-retry]:hover{background:var(--gold);border-color:var(--gold);transition-duration:0s}
}

/* ——— Hero ——— */
body.velar-lab .lab-hero{position:relative;overflow-x:clip;display:flex;flex-direction:column;justify-content:space-between;min-height:calc(100svh - 96px);box-sizing:border-box;padding-top:clamp(40px,8vh,104px)}
body.velar-lab .lab-hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:24px;align-items:center;width:100%}
/* The headline is sized from its own column: the column width over the widest line in em
   (hero-sizes-v20.css, from font metrics), capped per breakpoint. .98 covers rasterising. */
body.velar-lab .lab-hero-copy{container-type:inline-size}
body.velar-lab .lab-h1{margin:0;font-size:min(var(--h1-cap,128px),calc(100cqi / var(--h1-em,7) * .98));line-height:.92;letter-spacing:var(--h1-track,-.014em);font-weight:540}
html:lang(ka) body.velar-lab .lab-h1,html:lang(hy) body.velar-lab .lab-h1{line-height:1.12;letter-spacing:0;font-weight:680}
/* Each line is its own mask. The padding keeps descenders and diacritics out of the clip at rest. */
body.velar-lab .lab-line{display:block;overflow:hidden;padding-block:.14em;margin-block:-.14em}
body.velar-lab .lab-line-text{display:inline-block}
body.velar-lab .hero-description{margin:32px 0 0;max-width:30em;color:var(--text-2);font-size:20px;line-height:1.5;font-weight:400}
body.velar-lab .hero-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:12px 28px;margin-top:36px}
body.velar-lab .hero-secondary{display:inline-flex;align-items:center;min-height:44px;color:var(--bone);font-size:16px;font-weight:500;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;text-decoration-color:var(--rule-strong);transition:text-decoration-color var(--dur-out) var(--ease-out)}
@media(hover:hover) and (pointer:fine){body.velar-lab .hero-secondary:hover{text-decoration-color:var(--bone);transition-duration:0s}}
body.velar-lab .hero-footnote{margin:24px 0 0;max-width:28em;color:var(--text-2);font-size:14px;line-height:21px}

/* The sign: 1 152 synthetic hours drawn as a dot lattice in the shape of the Science Gothic ₿.
   The unlit lattice around it is the display panel; both share one origin and pitch. */
body.velar-lab .lab-sign-block{display:grid;justify-items:center;align-content:center;gap:14px}
body.velar-lab .lab-sign-label{margin:0;color:var(--text-3);font:500 11px/14px var(--font-mono);letter-spacing:.04em;white-space:nowrap}
body.velar-lab .lab-sign{position:relative;height:min(58vh,540px);aspect-ratio:1262/1726}
body.velar-lab .lab-sign-dots,body.velar-lab .lab-sign-graticule{position:absolute;display:block;background-image:var(--dot);background-size:var(--pitch) var(--pitch);background-position:0 0}
body.velar-lab .lab-sign-dots{inset:0;-webkit-mask:var(--sign-mask) 0 0/100% 100% no-repeat;mask:var(--sign-mask) 0 0/100% 100% no-repeat}
body.velar-lab .lab-sign-graticule{inset:-24px -64px;opacity:.07}
body.velar-lab .lab-rail{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;width:min(100%,calc(min(58vh,540px)*.731 + 128px));color:var(--text-3);font:500 11px/1 var(--font-mono);transform-origin:left center}
body.velar-lab .lab-rail i{height:5px;border-bottom:1px solid var(--rule-strong);background:linear-gradient(90deg,var(--rule-strong) 1px,transparent 1px) 0 0/calc((100% - 1px)/47) 100% repeat-x}
body.velar-lab .lab-hero-foot{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;padding-block:28px 24px}
body.velar-lab .lab-data-caption{margin:0;max-width:44em;color:var(--text-3);font-size:13px;line-height:20px}
body.velar-lab .lab-motion{display:inline-flex;align-items:center;gap:10px;flex:none;min-height:44px;padding:0 14px;border:1px solid var(--rule);border-radius:var(--r-control);background:transparent;color:var(--text-2);font:500 13px/1 var(--font-text);cursor:pointer;transition:border-color var(--dur-out) var(--ease-out),color var(--dur-out) var(--ease-out)}
body.velar-lab .lab-motion:active{transform:scale(.98)}
body.velar-lab .lab-motion[aria-pressed="true"]{color:var(--bone);border-color:var(--rule-strong)}
@media(hover:hover) and (pointer:fine){body.velar-lab .lab-motion:hover{color:var(--bone);border-color:var(--rule-strong);transition-duration:0s}}

/* The narrator draws the same lattice once it is ready; until then, and whenever it stops, the
   CSS poster is the sign. The canvas never takes pointer input and never covers the header. */
body.velar-lab .lab-narrator{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:20}
/* Another language: the Russian prerender stays hidden until the app has rendered the chosen one
   (boot-lang.js); if the app never does, it is shown after 3 s rather than leaving a blank page. */
html[data-lang-pending] #app{visibility:hidden;animation:lab-lang-reveal 0s 3s forwards}
@keyframes lab-lang-reveal{to{visibility:visible}}
body.velar-lab .lab-sign[data-narrator] .lab-sign-dots{visibility:hidden}
body.velar-lab .lab-sign-still{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
/* The caption describes the data frame; without one (no script yet, or none at all) it stays out. */
body.velar-lab:not([data-sign="data"]) .lab-data-caption{visibility:hidden}
body.velar-lab .lab-loupe{position:fixed;left:0;top:0;z-index:21;pointer-events:none;padding:6px 9px;background:rgb(23 27 32/.94);border:1px solid var(--rule-strong);border-radius:var(--r-control);color:var(--bone);font:500 12px/16px var(--font-mono);white-space:nowrap;font-variant-numeric:tabular-nums}
body.velar-lab .lab-loupe[hidden]{display:none}

/* Entrance: once per visit, CSS only, finished by focus, pause or reduced motion. Text is never
   invisible — headlines only rise inside their mask; supporting lines start at 35 % opacity. */
@media(prefers-reduced-motion:no-preference){
  body.velar-lab .hero-opening:not([data-hero-ready]) .lab-line-text{animation:lab-rise var(--dur-reveal) var(--ease-out) both}
  body.velar-lab .hero-opening:not([data-hero-ready]) .lab-line+.lab-line .lab-line-text{animation-delay:90ms}
  body.velar-lab .hero-opening:not([data-hero-ready]) .hero-description{animation:lab-settle 480ms var(--ease-out) 180ms both}
  body.velar-lab .hero-opening:not([data-hero-ready]) .lab-sign-dots{animation:lab-print 900ms linear 120ms both}
}
@keyframes lab-rise{from{transform:translateY(.42em)}}
@keyframes lab-settle{from{opacity:.35;transform:translateY(10px)}}
@keyframes lab-print{from{clip-path:inset(100% 0 0 0)}}
@keyframes lab-draw{from{transform:scaleX(0)}}

/* ——— Component structure ———
   Grids and sizes of the terminal, strategies, calculator and dossier, carried over from V12 without
   any of its colour, shadow or type rules. The V20 skin below decides how everything looks. */
body.velar-lab .market-top{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-bottom:22px}
body.velar-lab .market-identity{display:flex;gap:14px;align-items:center;min-width:0}
body.velar-lab .market-identity .crypto-icon{width:38px;height:38px}
body.velar-lab .market-identity strong{display:block}
body.velar-lab .market-identity small{display:block;margin-top:3px}
body.velar-lab :is(.market-pairs,.market-intervals,.market-display-modes){display:flex;flex-wrap:wrap;gap:3px;padding:3px;max-width:100%}
body.velar-lab :is(.market-pairs,.market-intervals,.market-display-modes) button{min-height:44px;min-width:0;padding:9px 13px;white-space:normal;overflow-wrap:anywhere}
body.velar-lab .market-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:16px 0}
body.velar-lab .market-workspace{display:grid;grid-template-columns:minmax(0,1fr) 228px;grid-template-areas:'plot rail';gap:28px;padding-top:24px}
body.velar-lab .market-plot{grid-area:plot;min-width:0}
body.velar-lab .market-sidebar{grid-area:rail;min-width:0;padding:0 0 0 24px}
body.velar-lab .market-quote-row{display:grid;gap:22px;padding-bottom:24px}
body.velar-lab :is(.market-quote,.market-change){min-width:0}
body.velar-lab :is(.market-quote,.market-change)>span{display:block}
body.velar-lab .market-quote strong{display:block;margin-top:8px;overflow-wrap:anywhere}
body.velar-lab .market-quote small{display:block;margin-top:8px}
body.velar-lab .market-change>strong{display:block;margin-top:6px;overflow-wrap:anywhere}
body.velar-lab .market-sidebar .chart-method{margin:20px 0 0}
body.velar-lab .market-chart-controls{align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:18px}
body.velar-lab .market-zoom-controls{display:flex;gap:5px;flex-wrap:wrap}
body.velar-lab .market-zoom-controls button{min-width:44px;min-height:44px;padding:8px 12px}
body.velar-lab .ohlc-readout{display:grid;grid-template-columns:minmax(0,1fr);gap:0}
body.velar-lab .ohlc-readout>div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:13px 0;min-width:0}
body.velar-lab .ohlc-readout span{overflow-wrap:anywhere}
body.velar-lab .ohlc-readout strong{text-align:right;overflow-wrap:anywhere}
body.velar-lab .market-canvas{height:420px}
body.velar-lab .market-chart .chart-canvas{height:370px}
body.velar-lab .market-selected{display:flex;justify-content:space-between;gap:8px 20px;flex-wrap:wrap;padding-top:16px;margin-top:12px;font-variant-numeric:tabular-nums}
body.velar-lab .market-chart-unit{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:10px 0}
body.velar-lab :is(.market-chart,.calculator-chart-panel .chart-frame){grid-template-columns:minmax(0,1fr) var(--chart-axis-width);gap:var(--chart-gap)}
body.velar-lab :is(.market-svg-fallback,.calculator-chart-panel) .chart-xlabels{margin-right:calc(var(--chart-axis-width) + var(--chart-gap))}
body.velar-lab .market-volume{height:40px;margin:8px calc(var(--chart-axis-width) + var(--chart-gap)) 0 0}
body.velar-lab .market-volume svg{width:100%;height:40px;display:block}
body.velar-lab .market-terminal .chart-probe{grid-template-columns:minmax(100px,.35fr) minmax(0,1fr)}
body.velar-lab .story-layout{display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr);gap:clamp(36px,5vw,72px);align-items:start}
body.velar-lab .story-copy{display:grid;grid-template-columns:minmax(0,1fr);gap:26px;padding-top:6px}
body.velar-lab .story-step{display:block;padding:0;min-width:0}
body.velar-lab .story-step>span{display:none}
body.velar-lab .story-step h3{overflow-wrap:anywhere}
body.velar-lab .story-step p{margin-top:10px;max-width:36ch}
body.velar-lab .story-copy>.text-link{margin:0;justify-self:start}
body.velar-lab .story-visual{padding:0;min-width:0}
body.velar-lab .story-visual .portfolio-dossier{padding-left:32px;overflow:visible}
body.velar-lab .dossier-heading{display:flex;align-items:center;flex-wrap:wrap;gap:10px 16px;padding:0 0 18px}
body.velar-lab .dossier-heading .crypto-icon{width:24px;height:24px;display:inline-block}
body.velar-lab .dossier-coins{margin-left:auto;display:flex;gap:5px;align-items:center}
body.velar-lab .preview-demo{padding:3px 6px}
body.velar-lab .portfolio-dossier .preview-content{display:block;padding:28px 0 0}
body.velar-lab .preview-overview{display:block;min-width:0;padding-bottom:24px}
body.velar-lab .story-visual .preview-balance{margin-top:14px;overflow-wrap:anywhere}
body.velar-lab .story-visual .preview-balance small{display:block;margin:10px 0}
body.velar-lab .preview-return{margin-top:12px;font-variant-numeric:tabular-nums}
body.velar-lab .preview-allocation{display:flex;gap:4px;height:8px;overflow:hidden;margin:4px 0 16px}
body.velar-lab .preview-allocation span{min-width:0}
body.velar-lab .preview-positions>div{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:14px;padding:18px 0}
body.velar-lab .preview-positions .crypto-icon{width:30px;height:30px}
body.velar-lab .preview-positions strong{display:block;overflow-wrap:anywhere}
body.velar-lab .preview-positions small{display:block;margin-top:4px}
body.velar-lab .preview-positions>div>span:last-child{overflow-wrap:anywhere}
body.velar-lab .preview-hold-map{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 24px;padding:26px 0}
body.velar-lab .preview-hold-map>h3{grid-column:1/-1;margin:0}
body.velar-lab .hold-entry{display:grid;grid-template-columns:minmax(0,1fr);gap:7px;min-width:0}
body.velar-lab .hold-entry>span{overflow-wrap:anywhere}
body.velar-lab .hold-entry>b{overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
body.velar-lab .hold-track{height:4px;overflow:hidden;margin-top:3px}
body.velar-lab .hold-track>i{display:block;height:100%;width:var(--hold-progress,0%);max-width:100%}
body.velar-lab .preview-bottom{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:20px;margin-top:24px;padding:0;align-items:end}
body.velar-lab .preview-bottom>div{min-width:0}
body.velar-lab .preview-bottom strong{display:block;margin-top:7px;overflow-wrap:anywhere}
body.velar-lab .preview-bottom>a{width:44px;height:44px;display:grid;place-items:center}
body.velar-lab .strategy-explorer{display:grid;grid-template-columns:minmax(260px,280px) minmax(0,1fr);gap:36px;align-items:start}
body.velar-lab .strategy-selector{display:flex;flex-direction:column;gap:10px}
body.velar-lab .strategy-choice{display:grid;grid-template-columns:46px minmax(0,1fr) 18px;grid-template-rows:auto auto;gap:5px 12px;align-items:center;min-height:106px;width:100%;padding:20px 16px;text-align:left}
body.velar-lab .strategy-choice-index{display:none}
body.velar-lab .strategy-choice-coins{grid-column:1;grid-row:1/3;display:flex;align-items:center;min-width:0}
body.velar-lab .strategy-choice-coins .crypto-icon{width:34px;height:34px;flex:none}
body.velar-lab .strategy-choice-coins .crypto-icon+.crypto-icon{width:27px;height:27px;margin-left:-15px;margin-top:20px}
body.velar-lab .strategy-choice>strong{grid-column:2;grid-row:1;overflow-wrap:break-word;hyphens:auto}
/* Long compound words in these languages: a smaller face and real hyphenation, not a break inside a syllable. */
html:is(:lang(ky),:lang(hy),:lang(ka)) body.velar-lab .strategy-choice>strong{font-size:16px}
html:lang(hy) body.velar-lab .chapter-heading h2{hyphens:auto}
body.velar-lab .strategy-choice>small{grid-column:2;grid-row:2}
body.velar-lab .strategy-choice>span:last-child{grid-column:3;grid-row:1/3}
body.velar-lab .strategy-panels{min-width:0}
body.velar-lab .strategy-v12{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);grid-template-areas:'art art' 'summary numbers' 'footer footer';gap:28px 32px;min-width:0;padding:8px 0 0;align-items:center}
body.velar-lab .strategy-v12[hidden]{display:none!important}
body.velar-lab .mechanism-art{grid-area:art;position:relative;min-width:0;width:100%;height:300px;max-width:680px;align-self:center;justify-self:center;padding:0}
body.velar-lab .strategy-summary{grid-area:summary;min-width:0}
body.velar-lab .strategy-summary h3{margin:14px 0 16px;overflow-wrap:anywhere}
body.velar-lab .strategy-numbers{grid-area:numbers;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-self:end;margin:0;padding-top:20px}
body.velar-lab .strategy-numbers dd{margin:8px 0 0;overflow-wrap:anywhere}
body.velar-lab .strategy-numbers dd span{margin-left:4px}
body.velar-lab .strategy-footer{grid-area:footer;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding-top:20px}
body.velar-lab .strategy-open{display:flex;align-items:center;gap:12px;min-height:44px;padding:8px 0;text-align:left}
body.velar-lab .strategy-open>span{display:grid;place-items:center;min-width:34px;height:34px}
body.velar-lab .calculator-workbench{--chart-axis-width:84px;--chart-gap:12px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'head head' 'inputs result' 'chart chart';gap:0;align-items:stretch;overflow:visible}
body.velar-lab .calculator-workbench-heading{grid-area:head;display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px;padding:22px 32px}
body.velar-lab .calculator-workbench-heading>b{padding:3px 6px}
body.velar-lab .calculator-workbench-heading>span:last-child{margin-left:auto}
body.velar-lab .lab-form{padding:0;gap:14px}
body.velar-lab .lab-form label{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:5px 12px}
body.velar-lab .lab-form input[type='range']{min-height:44px;width:100%;margin:0}
body.velar-lab .calculator-result{grid-area:result;padding:32px;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 24px;align-content:start}
body.velar-lab .calculator-result>.eyebrow{grid-column:1/-1}
body.velar-lab .calculator-result h2{grid-column:1/-1;margin:16px 0 0}
body.velar-lab .calculator-result>output{grid-column:1/-1;margin:15px 0 0;overflow-wrap:anywhere}
body.velar-lab .calculator-result>span:not(.eyebrow){grid-column:1/-1;margin-top:8px}
body.velar-lab .calculator-result .result-line{padding:16px 0 0;display:block;align-self:stretch;margin-top:26px}
body.velar-lab .calculator-result .result-line strong{display:block;text-align:left;margin-top:8px;overflow-wrap:anywhere}
body.velar-lab .calculator-result .scenario-comparison{padding:16px 0 0;margin-top:26px}
body.velar-lab .calculator-result .scenario-comparison>strong{margin-top:8px;overflow-wrap:anywhere}
body.velar-lab .calculator-result>p{grid-column:1/-1;margin:20px 0}
body.velar-lab .calculator-result>.button{grid-column:1/-1;justify-self:start;min-height:48px;max-width:100%}
body.velar-lab .calculator-chart-panel{grid-area:chart;padding:28px 32px;margin:0;min-width:0}
body.velar-lab .calculator-chart-panel .chart-canvas{height:320px}
body.velar-lab .calculator-chart-panel .chart-legend{margin-block:20px;gap:10px 24px}
body.velar-lab .calculator-chart-panel .chart-inspector{padding:16px 0;grid-template-columns:.6fr 1fr 1fr;gap:24px}
body.velar-lab .chart-inspector{gap:16px}
body.velar-lab .chart-probe{grid-template-columns:minmax(100px,.4fr) minmax(0,1fr)}
body.velar-lab .calculator-workbench .table-scroll{max-width:100%;overflow:auto}
body.velar-lab .protocol-notes{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);max-width:1440px;gap:64px;margin:0 auto;padding-block:72px}
body.velar-lab .transparency-intro{display:block;min-width:0}
body.velar-lab .transparency-intro h2{margin:18px 0}
body.velar-lab .transparency-intro>p{max-width:42ch;margin:0}
body.velar-lab .transparency-items{display:block;min-width:0}
body.velar-lab .protocol-note{min-width:0;padding:0}
body.velar-lab .protocol-note>summary{display:grid;grid-template-columns:26px minmax(0,1fr) 24px;align-items:center;gap:16px;min-height:76px;padding:20px 0;list-style:none}
body.velar-lab .protocol-note>summary::-webkit-details-marker{display:none}
body.velar-lab .protocol-toggle{display:grid;place-items:center;width:24px;height:24px}
body.velar-lab .protocol-note h3{overflow-wrap:anywhere;margin:0}
body.velar-lab .protocol-body{display:block;padding:0 40px 26px 42px;min-width:0}
body.velar-lab .protocol-note:not([open])>.protocol-body{display:none}
body.velar-lab .protocol-symbol{display:grid;place-items:center}
body.velar-lab .protocol-symbol .ui-icon{width:25px;height:25px}
body.velar-lab .protocol-body p{max-width:56ch;margin:0}
@media(max-width:1100px){
  body.velar-lab .market-workspace{grid-template-columns:minmax(0,1fr) 200px;gap:22px}
  body.velar-lab .market-sidebar{padding-left:20px}
  body.velar-lab .story-layout{gap:32px;grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr)}
  body.velar-lab .story-visual .portfolio-dossier{padding-left:24px}
  body.velar-lab .preview-hold-map{grid-template-columns:minmax(0,1fr);gap:18px}
  body.velar-lab .hold-entry{grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;align-items:baseline}
  body.velar-lab .hold-track{grid-column:1/-1}
  body.velar-lab .preview-bottom{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  body.velar-lab .preview-bottom>a{grid-column:2;justify-self:end}
  body.velar-lab .strategy-explorer{grid-template-columns:210px minmax(0,1fr);gap:28px}
  body.velar-lab .strategy-choice{padding:16px 12px;gap:5px 10px;grid-template-columns:38px minmax(0,1fr) 14px}
  body.velar-lab .strategy-v12{grid-template-columns:minmax(0,1fr);grid-template-areas:'art' 'summary' 'numbers' 'footer';gap:22px}
  body.velar-lab .mechanism-art{height:260px;max-width:620px}
  body.velar-lab #calculator-form,body.velar-lab .calculator-result,body.velar-lab .calculator-chart-panel{padding:26px}
  body.velar-lab .calculator-workbench-heading{padding-inline:26px}
  body.velar-lab .protocol-notes{gap:36px}
}
@media(max-width:900px){
  body.velar-lab .market-workspace{grid-template-columns:minmax(0,1fr);grid-template-areas:'rail' 'plot';gap:22px}
  body.velar-lab .market-sidebar{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:18px 28px;padding:0 0 20px}
  body.velar-lab .market-quote-row{gap:16px;padding-bottom:0}
  body.velar-lab .market-sidebar .chart-method{grid-column:1/-1;margin:0}
  body.velar-lab .ohlc-readout{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px}
  body.velar-lab .ohlc-readout>div{display:block;padding:10px 0}
  body.velar-lab .ohlc-readout strong{display:block;text-align:left;margin-top:4px}
  body.velar-lab .strategy-explorer{grid-template-columns:minmax(0,1fr);gap:28px}
  body.velar-lab .strategy-selector{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  body.velar-lab .strategy-choice{grid-template-columns:34px minmax(0,1fr);min-height:110px}
  body.velar-lab .strategy-choice>span:last-child{display:none}
  body.velar-lab .strategy-v12{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:'art art' 'summary numbers' 'footer footer';gap:24px}
  body.velar-lab .mechanism-art{height:260px}
}
@media(max-width:760px){
  body.velar-lab .market-top{gap:16px;padding-bottom:16px}
  body.velar-lab .market-toolbar{gap:12px}
  body.velar-lab .market-chart-controls{gap:10px}
  body.velar-lab .market-zoom-controls button{padding:8px}
  body.velar-lab .market-canvas{height:340px}
  body.velar-lab .market-chart .chart-canvas{height:290px}
  body.velar-lab .market-terminal .chart-probe{grid-template-columns:minmax(0,1fr);gap:4px}
  body.velar-lab .story-layout{grid-template-columns:minmax(0,1fr);gap:30px}
  body.velar-lab .story-copy{gap:20px;padding:0}
  body.velar-lab .story-step p{max-width:48ch}
  body.velar-lab .story-visual .portfolio-dossier{padding:0}
  body.velar-lab .portfolio-dossier .preview-content{padding-top:24px}
  body.velar-lab .preview-bottom{gap:14px;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}
  body.velar-lab .preview-bottom>a{grid-column:auto}
  body.velar-lab .mechanism-art{height:230px}
  body.velar-lab .calculator-workbench{grid-template-columns:minmax(0,1fr);grid-template-areas:'head' 'inputs' 'result' 'chart'}
  body.velar-lab .calculator-workbench-heading{padding:20px}
  body.velar-lab .calculator-result,body.velar-lab .calculator-chart-panel{padding:24px 20px}
  body.velar-lab .calculator-result{column-gap:20px}
  body.velar-lab .calculator-chart-panel .chart-inspector{grid-template-columns:1fr 1fr;gap:16px}
  body.velar-lab .calculator-chart-panel .chart-inspector>div:first-child{grid-column:1/-1}
  body.velar-lab :is(.market-terminal,.calculator-workbench){--chart-axis-width:68px;--chart-gap:8px}
  body.velar-lab .calculator-chart-panel .chart-frame .chart-canvas{height:260px}
  body.velar-lab .chart-probe{grid-template-columns:minmax(0,1fr);gap:4px}
  body.velar-lab .protocol-notes{grid-template-columns:minmax(0,1fr);gap:30px;padding-block:48px}
  body.velar-lab .transparency-intro>p{max-width:48ch}
  body.velar-lab .protocol-note>summary{grid-template-columns:22px minmax(0,1fr) 24px;gap:12px;min-height:72px}
  body.velar-lab .protocol-body{padding:0 0 22px 34px}
}
@media(max-width:600px){
  body.velar-lab .market-sidebar{grid-template-columns:minmax(0,1fr);gap:18px}
  body.velar-lab .market-quote-row{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:18px}
  body.velar-lab .strategy-selector{grid-template-columns:minmax(0,1fr);gap:8px}
  body.velar-lab .strategy-choice{min-height:72px;padding:12px 16px;grid-template-columns:44px minmax(0,1fr) 18px}
  body.velar-lab .strategy-choice>span:last-child{display:block}
  body.velar-lab .strategy-v12{grid-template-columns:minmax(0,1fr);grid-template-areas:'art' 'summary' 'numbers' 'footer';gap:24px}
  body.velar-lab .mechanism-art{height:220px;max-width:600px}
  body.velar-lab .strategy-footer{gap:10px;padding-top:16px}
  body.velar-lab .preview-positions>div{grid-template-columns:30px minmax(0,1fr);gap:8px 12px}
  body.velar-lab .preview-positions>div>span:last-child{grid-column:2}
  body.velar-lab .hold-entry{grid-template-columns:minmax(0,1fr)}
  body.velar-lab .hold-entry .hold-track{grid-column:1}
}
@media(max-width:360px){
  body.velar-lab .preview-bottom{grid-template-columns:1fr 1fr}
  body.velar-lab .preview-bottom>a{grid-column:2;justify-self:end}
  body.velar-lab .calculator-result{grid-template-columns:minmax(0,1fr)}
  body.velar-lab .calculator-result>*{grid-column:1!important}
}

/* ——— Chapters ——— */
body.velar-lab main>section{border-top:1px solid var(--rule)}
body.velar-lab main>section.lab-hero{border-top:0}
body.velar-lab .section{padding-block:120px}
body.velar-lab .chapter-heading{display:block;margin:0 0 48px;max-width:1040px}
body.velar-lab .chapter-heading>div{min-width:0;max-width:none}
body.velar-lab .chapter-heading h2{margin:0;font-size:clamp(40px,4.4vw,64px);line-height:1;letter-spacing:-.014em;max-width:18ch}
html:lang(ka) body.velar-lab .chapter-heading h2,html:lang(hy) body.velar-lab .chapter-heading h2{line-height:1.15;letter-spacing:0;font-weight:620}
body.velar-lab .chapter-heading>p{margin:20px 0 0;max-width:56ch;color:var(--text-2);font-size:17px;line-height:1.6}
body.velar-lab .chapter-line{display:none}
body.velar-lab .eyebrow{letter-spacing:.01em;text-transform:none;color:var(--text-3);font:500 13px/1.4 var(--font-text)}

/* ——— Market simulator: the terminal was already the page's most convincing block. ——— */
body.velar-lab .market-section{padding-block:120px}
body.velar-lab .market-terminal{background:var(--base);border:1px solid var(--rule);border-radius:var(--r-panel);box-shadow:none;color:var(--bone)}
body.velar-lab .market-terminal button{border-radius:var(--r-control);font-family:var(--font-text)}
body.velar-lab .market-terminal button[aria-pressed="true"]{background:var(--bone);color:var(--void);border-color:var(--bone)}
body.velar-lab .market-quote strong,body.velar-lab .ohlc-readout strong,body.velar-lab #market-change{font-variant-numeric:tabular-nums}
body.velar-lab #market-change.is-negative{color:var(--loss)}
body.velar-lab #market-change.is-positive{color:var(--bone)}
body.velar-lab .market-terminal .chart-attribution{color:var(--text-3)}

/* ——— Strategies: the rate is a model parameter, not a headline. ——— */
body.velar-lab .strategies-section{background:transparent}
body.velar-lab .strategy-choice{border:1px solid var(--rule);border-radius:var(--r-panel);background:var(--base);color:var(--bone);box-shadow:none}
body.velar-lab .strategy-choice[aria-pressed="true"]{background:var(--surface);border-color:var(--bone)}
body.velar-lab .strategy-choice small{color:var(--text-3)}
body.velar-lab .strategy-choice:active{transform:scale(.99)}
@media(hover:hover) and (pointer:fine){body.velar-lab .strategy-choice:not([aria-pressed="true"]):hover{border-color:var(--rule-strong);transition-duration:0s}}
body.velar-lab .strategy-v12{background:var(--base);border:1px solid var(--rule);border-radius:var(--r-panel);box-shadow:none;color:var(--bone)}
body.velar-lab .strategy-v12 .card-type{color:var(--text-3);font:500 12px/1.4 var(--font-mono);letter-spacing:.02em}
body.velar-lab .strategy-v12 .card-description{color:var(--text-2)}
body.velar-lab .strategy-numbers dd{font-family:var(--font-text);font-size:18px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--bone)}
body.velar-lab .strategy-numbers dt{color:var(--text-3);font-size:13px}
body.velar-lab .strategy-numbers dd span{font-size:14px;color:var(--text-3)}
body.velar-lab .strategy-downside dd{color:var(--loss)}
body.velar-lab .strategy-risk-text{grid-column:1/-1;margin:0;color:var(--text-2);font-size:14px;line-height:1.55;max-width:62ch}
body.velar-lab .risk-tag{background:transparent;border:1px solid var(--loss);color:var(--loss);border-radius:var(--r-control);font-weight:600}
body.velar-lab .strategy-open{color:var(--bone);background:transparent;border:1px solid var(--rule-strong);border-radius:var(--r-control)}
body.velar-lab .mechanism-art svg{color:var(--text-3)}
body.velar-lab .section-note{color:var(--text-3);font-size:13px}

/* The strategies' true scale: a dot field is the range the price scenario can reach; the three
   rate rays barely leave zero. The picture is the argument, so it sits above the cards. */
body.velar-lab .strategy-envelope{margin:0 0 40px;padding:0}
body.velar-lab .envelope-plot{position:relative;height:180px;margin-left:56px;border-block:1px solid var(--rule);background:radial-gradient(circle,rgb(238 235 229/.16) 0 1px,transparent 1.3px) 0 0/8px 8px}
body.velar-lab .envelope-plot svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
body.velar-lab .envelope-zero{fill:none;stroke:var(--text-2);stroke-width:1;stroke-dasharray:6 5;vector-effect:non-scaling-stroke}
body.velar-lab .envelope-ray{fill:none;stroke:var(--text-3);stroke-width:1.5;vector-effect:non-scaling-stroke;transition:stroke var(--dur-panel-in) var(--ease-out)}
body.velar-lab .envelope-ray.is-selected{stroke:var(--bone);stroke-width:2.5}
body.velar-lab .envelope-tick{position:absolute;left:-56px;width:48px;text-align:right;transform:translateY(-50%);color:var(--text-3);font:500 11px/1 var(--font-mono);font-variant-numeric:tabular-nums}
body.velar-lab .envelope-top{top:0}body.velar-lab .envelope-mid{top:44.44%}body.velar-lab .envelope-bottom{top:100%}
body.velar-lab .strategy-envelope figcaption{display:flex;flex-wrap:wrap;gap:8px 28px;margin:14px 0 0 56px;color:var(--text-2);font-size:14px}
body.velar-lab .envelope-days{position:absolute;left:0;right:0;top:calc(100% + 6px);display:flex;justify-content:space-between;color:var(--text-3);font:500 12px/1 var(--font-text);font-variant-numeric:tabular-nums}
body.velar-lab .strategy-envelope figcaption{margin-top:26px}
body.velar-lab .envelope-key{display:inline-flex;align-items:center;gap:10px}
body.velar-lab .envelope-key::before{content:"";width:20px;height:10px;flex:none}
body.velar-lab .envelope-key-band::before{background:radial-gradient(circle,rgb(238 235 229/.4) 0 1px,transparent 1.3px) 0 0/5px 5px}
body.velar-lab .envelope-key-ray::before{height:0;border-top:2px solid var(--bone)}

/* ——— Calculator: the stressed outcome carries the same weight as the optimistic one. ——— */
body.velar-lab .calculator-section{background:transparent}
body.velar-lab .calculator-workbench-heading{color:var(--text-3);font:500 13px/1.4 var(--font-text)}
body.velar-lab .calculator-workbench-heading b{color:var(--bone);font-weight:500;padding:2px 6px;border:1px solid var(--rule-strong);background:var(--hatch)}
body.velar-lab .panel,body.velar-lab .lab-form,body.velar-lab .calculator-result,body.velar-lab .calculator-chart-panel{background:var(--base);border:1px solid var(--rule);border-radius:var(--r-panel);box-shadow:none;color:var(--bone)}
body.velar-lab .lab-form label{color:var(--text-2);font-size:14px}
body.velar-lab .lab-form input:not([type="range"]),body.velar-lab .lab-form select{background:var(--void);color:var(--bone);border:1px solid var(--rule-strong);border-radius:var(--r-control);font:500 16px/1.4 var(--font-text);font-variant-numeric:tabular-nums}
body.velar-lab .lab-form output{color:var(--bone);font-variant-numeric:tabular-nums}
body.velar-lab .calculator-result h2{font-family:var(--font-text);font-size:14px;font-weight:500;color:var(--text-2)}
body.velar-lab #calc-total,body.velar-lab #calc-risk{font-family:var(--font-display);font-size:clamp(32px,3vw,44px);line-height:1.05;font-variant-numeric:tabular-nums;color:var(--bone)}
body.velar-lab #calc-net{font-size:18px;font-weight:600;font-variant-numeric:tabular-nums;color:var(--bone)}
body.velar-lab #calc-net.is-negative{color:var(--loss)}
body.velar-lab .calculator-result .scenario-comparison{border-top:0;padding-top:0;margin-top:14px}
body.velar-lab .calculator-result .scenario-comparison h2{margin:0 0 10px}
body.velar-lab .calculator-result .calc-guarantee{color:var(--text-2);font-size:14px}
body.velar-lab .calculator-result .result-unit{display:block;margin-top:4px;color:var(--text-3);font-size:12px}
body.velar-lab .calculator-result .result-baseline{display:grid;gap:6px;margin-top:24px;padding-top:20px;border-top:1px solid var(--rule)}
body.velar-lab .calculator-result .result-baseline>span{color:var(--text-2);font-size:14px}
body.velar-lab .calculator-result .result-baseline>span:last-child{color:var(--text-3);font-size:12px}
body.velar-lab .calculator-result p,body.velar-lab .chart-method{color:var(--text-3)}
body.velar-lab .scenario-comparison{border-top:1px solid var(--rule)}

/* Charts and controls follow the page: the model line is bone, the price scenario is the loss
   colour, sliders stay neutral so the accent keeps meaning "the one thing to press". */
body.velar-lab{--chart-base:#EEEBE5;--chart-compare:#FD9690;--chart-grid:#1E2227}
body.velar-lab input[type=range]{accent-color:var(--bone)}
body.velar-lab .market-terminal :is(.market-pairs,.market-intervals,.market-display-modes){background:var(--void);border:1px solid var(--rule);border-radius:var(--r-control)}
body.velar-lab .market-terminal :is(.market-pairs,.market-intervals,.market-display-modes) button{background:transparent;border:1px solid transparent;color:var(--text-2);font:500 13px/1 var(--font-text);box-shadow:none}
body.velar-lab .market-terminal .market-zoom-controls button{background:transparent;border:1px solid var(--rule);color:var(--text-2);font:500 13px/1 var(--font-text);box-shadow:none}
body.velar-lab .market-terminal :is(.market-pairs,.market-intervals,.market-display-modes) button[aria-pressed="true"]{background:var(--bone);color:var(--void);border-color:var(--bone)}
body.velar-lab .market-terminal button:active{transform:scale(.97)}
@media(hover:hover) and (pointer:fine){body.velar-lab .market-terminal button:not([aria-pressed="true"]):hover{color:var(--bone);border-color:var(--rule-strong);transition-duration:0s}}
body.velar-lab .market-identity strong{font:600 18px/1.2 var(--font-text);color:var(--bone)}
body.velar-lab .market-identity strong span,body.velar-lab .market-identity small,body.velar-lab .market-disclosure,body.velar-lab .market-chart-unit,body.velar-lab .market-selected,body.velar-lab .chart-probe label{color:var(--text-3);font-size:13px}
body.velar-lab .market-quote span,body.velar-lab .market-change span,body.velar-lab .ohlc-readout span{color:var(--text-3);font-size:13px}
body.velar-lab .market-quote strong{font:540 32px/1.1 var(--font-display);color:var(--bone)}
body.velar-lab .ohlc-readout>div{border-bottom:1px solid var(--rule)}
body.velar-lab .market-sidebar{border-left:1px solid var(--rule)}
body.velar-lab .chart-grid path{stroke:var(--chart-grid)}
body.velar-lab .chart-axis span,body.velar-lab .chart-xlabels span{color:var(--text-3);font-variant-numeric:tabular-nums}
body.velar-lab .calculator-chart-panel h2{font-size:22px}
body.velar-lab .chart-legend span{color:var(--text-2)}
body.velar-lab .chart-inspector strong{font-variant-numeric:tabular-nums;color:var(--bone)}
body.velar-lab .chart-inspector span{color:var(--text-3)}
body.velar-lab .chart-values summary{color:var(--text-2)}
/* The harp: every other position of the price-change slider as a thin line from the same formula.
   Gains and losses carry the same line weight; only the colour says which side of the start. */
body.velar-lab .chart-frame path.scenario-harp{fill:none;stroke:#EEEBE5;stroke-opacity:.14;stroke-width:1;vector-effect:non-scaling-stroke}
body.velar-lab .chart-frame path.scenario-harp-loss{stroke:#FD9690;stroke-opacity:.22}
body.velar-lab .chart-frame path.scenario-stress{stroke-dasharray:none;stroke-width:2}
body.velar-lab .chart-frame #scenario-area{fill:none}
body.velar-lab .chart-legend span:nth-child(2) i{background:var(--chart-compare);border:0}
body.velar-lab .chart-frame path.scenario-principal{fill:none;stroke:var(--text-2);stroke-width:1;stroke-dasharray:6 5;vector-effect:non-scaling-stroke}
body.velar-lab .scenario-chart .chart-canvas{position:relative;overflow:hidden}
body.velar-lab .scenario-loss-zone{position:absolute;left:0;right:0;bottom:0;top:100%;pointer-events:none;background:repeating-linear-gradient(135deg,rgb(253 150 144/.13) 0 1px,transparent 1px 7px)}
body.velar-lab .chart-legend .legend-principal i{height:0;background:none;border-top:1px dashed var(--text-2)}
body.velar-lab .calculator-chart-panel .ladder-note{color:var(--text-2)}
body.velar-lab .calculator-result .scenario-comparison{background:transparent}
body.velar-lab .calculator-result .scenario-comparison>span{color:var(--text-2);font-size:14px}
body.velar-lab .calculator-result .scenario-comparison>p{color:var(--text-3)}
body.velar-lab #calc-risk{white-space:normal}
body.velar-lab .result-line span{color:var(--text-2)}
body.velar-lab .result-line strong{color:var(--bone);font-variant-numeric:tabular-nums}
body.velar-lab .button-light{background:transparent;color:var(--bone);border:1px solid var(--rule-strong)}
@media(hover:hover) and (pointer:fine){body.velar-lab .button-light:hover{border-color:var(--bone);transition-duration:0s}}

/* Mechanism drawings on the dark ground: construction in the rule tones, every flow in bone.
   Brand colours stay on the coin icons only, so the drawing never reads as a brand collage. */
body.velar-lab .mechanism-illustration svg{display:block;width:100%;height:100%;overflow:visible}
body.velar-lab .mechanism-illustration :is(path,rect,circle,ellipse){vector-effect:non-scaling-stroke}
body.velar-lab .mechanism-illustration .mechanism-reference{fill:none;stroke:var(--rule-strong);stroke-width:.7;opacity:.7}
body.velar-lab .mechanism-illustration .mechanism-backplate{fill:var(--surface);stroke:var(--rule);stroke-width:1}
body.velar-lab .mechanism-illustration .mechanism-route-bed{fill:none;stroke:var(--raised);stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
body.velar-lab .mechanism-illustration :is(.mechanism-path,.mechanism-direction){fill:none;stroke:var(--bone);stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
body.velar-lab .mechanism-illustration .mechanism-flow-b,body.velar-lab .mechanism-illustration .mechanism-direction-b{stroke:var(--text-3)}
body.velar-lab .mechanism-illustration .mechanism-assembly-shadow{fill:var(--surface)}
body.velar-lab .mechanism-illustration .mechanism-assembly{fill:var(--raised);stroke:var(--rule-strong);stroke-width:1.25;stroke-linejoin:round}
body.velar-lab .mechanism-illustration .mechanism-exchange-core{fill:none;stroke:var(--text-2);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
body.velar-lab .mechanism-illustration :is(.mechanism-junctions,.mechanism-flow-junctions){fill:var(--void);stroke:var(--text-3);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
body.velar-lab .mechanism-illustration .mechanism-flow-junctions path{fill:none}
body.velar-lab .mechanism-illustration .mechanism-tickers{fill:var(--text-3);stroke:none;font:500 17px var(--font-mono);letter-spacing:2px;text-anchor:middle}
body.velar-lab .mechanism-illustration .mechanism-network-field{fill:var(--surface);stroke:none}
body.velar-lab .mechanism-illustration .mechanism-network-link{fill:none;stroke:var(--rule-strong);stroke-width:1}
body.velar-lab .mechanism-illustration .mechanism-crystal-base{fill:var(--surface);stroke:none}
body.velar-lab .mechanism-illustration .mechanism-crystal-edge{fill:none;stroke:var(--rule-strong);stroke-width:1.1}
body.velar-lab .mechanism-illustration .mechanism-validator{fill:var(--raised);stroke:var(--rule-strong);stroke-width:1.15}
body.velar-lab .mechanism-illustration .mechanism-validator path{stroke:var(--text-3);stroke-width:1.1}
body.velar-lab .mechanism-illustration .mechanism-validator circle{fill:var(--bone);stroke:none}
body.velar-lab .mechanism-illustration .mechanism-tank{fill:var(--surface);stroke:var(--rule-strong);stroke-width:1.2}
body.velar-lab .mechanism-illustration .mechanism-fluid{fill:var(--bone);fill-opacity:.1;stroke:none}
body.velar-lab .mechanism-illustration .mechanism-fluid-surface{fill:var(--bone);fill-opacity:.07;stroke:var(--text-3);stroke-opacity:.8;stroke-width:1}
body.velar-lab .mechanism-illustration .mechanism-tank-rim{fill:none;stroke:var(--rule-strong);stroke-width:1.2}
body.velar-lab .mechanism-illustration .mechanism-tank-detail{fill:none;stroke:var(--text-4);stroke-width:1;stroke-linecap:round}

/* ——— Portfolio preview: an example of the cabinet, labelled as such. ——— */
body.velar-lab .story-step h3{font-size:22px;line-height:1.2}
body.velar-lab .story-step p{color:var(--text-2)}
body.velar-lab .text-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;color:var(--bone);font-weight:500}
body.velar-lab .portfolio-dossier{background:var(--base);border:1px solid var(--rule);border-radius:var(--r-panel);box-shadow:none;color:var(--bone)}
body.velar-lab .portfolio-dossier .preview-demo{border:1px solid var(--rule-strong);background:var(--hatch);color:var(--bone);border-radius:var(--r-control);font:500 11px/1 var(--font-mono);padding:4px 7px}
body.velar-lab .portfolio-dossier span,body.velar-lab .portfolio-dossier small{color:var(--text-3)}

/* ——— Transparency ——— */
body.velar-lab .transparency-section{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px;padding-block:120px}
body.velar-lab .transparency-intro h2{font-size:clamp(36px,3.6vw,52px);line-height:1.04;margin:0}
body.velar-lab .transparency-intro h2 span{color:var(--text-2)}
body.velar-lab .transparency-intro p{color:var(--text-2);margin-top:20px}
body.velar-lab .protocol-note{border-top:1px solid var(--rule)}
body.velar-lab .protocol-note:last-child{border-bottom:1px solid var(--rule)}
body.velar-lab .protocol-note>summary{display:grid;grid-template-columns:24px 1fr 24px;align-items:center;gap:16px;min-height:72px;cursor:pointer;list-style:none}
body.velar-lab .protocol-note>summary::-webkit-details-marker{display:none}
body.velar-lab .protocol-note h3{margin:0;font-family:var(--font-text);font-size:18px;font-weight:600}
body.velar-lab .protocol-symbol{color:var(--text-3)}
body.velar-lab .protocol-toggle{color:var(--text-3);font-size:22px;transition:transform var(--dur-out) var(--ease-out)}
body.velar-lab .protocol-note[open] .protocol-toggle{transform:rotate(45deg)}
body.velar-lab .protocol-body{padding:0 40px 24px 40px;color:var(--text-2)}

/* ——— Closing: the lattice becomes the brand mark. ——— */
body.velar-lab .closing-section{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;gap:24px;padding-block:120px;background:transparent}
body.velar-lab .closing-copy h2{font-size:clamp(40px,4.4vw,64px);line-height:1;margin:0 0 32px;max-width:14ch}
body.velar-lab .closing-visual{display:grid;place-items:center;min-height:320px;background:none}
body.velar-lab .lab-mark{display:block;height:280px;aspect-ratio:1547/1400;background-image:var(--dot);background-size:var(--pitch) var(--pitch);-webkit-mask:var(--mark-mask) 0 0/100% 100% no-repeat;mask:var(--mark-mask) 0 0/100% 100% no-repeat}

/* Dialog contents on dark tokens: the risk text is at least as legible as the rate beside it. */
body.velar-lab .demo-dialog p,body.velar-lab .demo-dialog li{color:var(--text-2)}
body.velar-lab .demo-dialog h2,body.velar-lab .demo-dialog h3,body.velar-lab .demo-dialog strong{color:var(--bone)}
body.velar-lab .demo-dialog .detail-metrics,body.velar-lab .demo-dialog .detail-metrics>div{background:var(--base);border-color:var(--rule);color:var(--bone)}
body.velar-lab .demo-dialog .detail-metrics span{color:var(--text-3)}
body.velar-lab .demo-dialog .modal-notice,body.velar-lab .demo-dialog .dashboard-demo-note{background:var(--hatch),var(--base);border:1px solid var(--rule-strong);color:var(--text-2);font-size:14px}
body.velar-lab .demo-dialog .modal-cta{background:var(--amber);color:var(--amber-ink);border-color:var(--amber)}
/* ——— Dialog and the mobile menu sheet (the sheet had no styles at all before V20). ——— */
body.velar-lab .demo-dialog{background:var(--surface);color:var(--bone);border:1px solid var(--rule-strong);border-radius:var(--r-panel);box-shadow:0 24px 64px rgb(0 0 0/.5)}
body.velar-lab .demo-dialog::backdrop{background:rgb(9 11 15/.72);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
body.velar-lab .dialog-close{color:var(--text-2);background:transparent;border:1px solid var(--rule);border-radius:var(--r-control);min-width:44px;min-height:44px}
body.velar-lab .landing-menu-links{display:grid;gap:0;margin-top:8px}
body.velar-lab .landing-menu-links>*{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:56px;padding:0 4px;border:0;border-bottom:1px solid var(--rule);background:transparent;color:var(--bone);font:500 17px/1.2 var(--font-text);text-align:left;text-decoration:none;cursor:pointer}
body.velar-lab .landing-menu-links .button{margin-top:16px;justify-content:center;border:1px solid var(--amber);background:var(--amber);color:var(--amber-ink)}

/* ——— Inherited-rule corrections: older layers still paint these; V20 states them once. ——— */
body.velar-lab .strategy-v12{padding:28px 32px 28px;gap:28px 40px}
body.velar-lab .strategy-footer{align-items:center}
/* Risk sits at the legibility of the numbers beside it, not as a footnote pill. */
body.velar-lab .risk-tag{display:inline-flex;align-items:center;min-height:32px;padding:0 12px;font-size:14px;letter-spacing:0}
body.velar-lab .lab-form{padding:28px}
body.velar-lab .calculator-result{padding:28px}
body.velar-lab .calculator-chart-panel{padding:28px}
body.velar-lab .transparency-section{background:none;border:0;border-top:1px solid var(--rule);border-radius:0;box-shadow:none;margin-block:0;color:var(--bone)}
body.velar-lab .transparency-section::before,body.velar-lab .transparency-section::after{content:none}
body.velar-lab .closing-section,body.velar-lab .closing-copy{text-align:left}
body.velar-lab .closing-copy{display:grid;justify-items:start;align-content:center}
body.velar-lab .preview-bottom a{display:inline-grid;place-items:center;width:44px;height:44px;border:1px solid var(--rule-strong);border-radius:var(--r-control);background:transparent;color:var(--bone);text-decoration:none;box-shadow:none}
body.velar-lab .portfolio-dossier{padding:28px 32px}
body.velar-lab .preview-stress{padding:0 0 20px}
body.velar-lab .preview-stress .preview-stress-value{color:var(--loss)}
body.velar-lab .market-terminal .chart-source{display:block;margin-top:4px;color:var(--text-3);font-size:13px}
body.velar-lab .preview-balance,body.velar-lab .preview-stress-value{font-family:var(--font-display);font-variant-numeric:tabular-nums;color:var(--bone)}
body.velar-lab .preview-allocation span{background:var(--text-3)}
body.velar-lab .preview-allocation .allocation-0{background:var(--bone)}
body.velar-lab .preview-allocation .allocation-2{background:var(--rule-strong)}
body.velar-lab .hold-track{background:var(--raised)}
body.velar-lab .hold-track i{background:var(--bone)}

/* ——— Breakpoints ——— */
@media(max-width:1279px){
  body.velar-lab .site-header .desktop-nav{display:none}
  body.velar-lab .landing-menu-button{display:inline-flex}
}
@media(max-width:1100px){
  body.velar-lab{--gutter:32px}
  body.velar-lab .transparency-section,body.velar-lab .closing-section{grid-template-columns:1fr}
}
@media(max-width:900px){
  body.velar-lab .lab-hero{min-height:0;padding-top:48px}
  body.velar-lab .lab-hero-grid{grid-template-columns:1fr;row-gap:48px}
  body.velar-lab .lab-h1{--h1-cap:64px}
  body.velar-lab .lab-sign{height:min(52vh,400px)}
  body.velar-lab .lab-rail{width:min(100%,calc(min(52vh,400px)*.731 + 96px))}
  body.velar-lab .lab-sign-graticule{inset:-16px -48px}
  body.velar-lab .section,body.velar-lab .market-section,body.velar-lab .transparency-section,body.velar-lab .closing-section{padding-block:80px}
}
@media(max-width:600px){
  body.velar-lab{--gutter:24px;--pitch:3px;--dot:conic-gradient(at 1.5px 1.5px,transparent 270deg,#EEEBE5 0)}
  body.velar-lab .demo-strip{padding-inline:var(--gutter);font-size:11px;min-height:28px}
  body.velar-lab .site-header{height:56px;gap:12px}
  /* CTA виден и на мобильном (компакт): единственная точка входа не исчезает */
  body.velar-lab .site-header .header-account{font-size:13px;padding:0 12px;min-height:38px}
  body.velar-lab .hero-description{font-size:17px;line-height:1.5;margin-top:24px}
  body.velar-lab .hero-actions{margin-top:28px;flex-direction:column;align-items:flex-start}
  body.velar-lab .hero-actions .lab-cta{width:100%}
  body.velar-lab .hero-secondary{margin:0;align-self:flex-start}
  body.velar-lab .lab-hero-foot{flex-direction:column;align-items:flex-start}
  body.velar-lab .chapter-heading h2{font-size:clamp(34px,9vw,44px)}
  body.velar-lab .lab-mark{height:180px}
  body.velar-lab .calculator-result{display:block}
  body.velar-lab .calculator-result>*{grid-column:auto}
  body.velar-lab .calculator-result .scenario-comparison{margin-top:20px}
  body.velar-lab .lab-form,body.velar-lab .calculator-result,body.velar-lab .calculator-chart-panel,body.velar-lab .strategy-v12,body.velar-lab .portfolio-dossier{padding:20px}
  body.velar-lab .lab-form select{font-size:15px}
}
@media(max-width:380px){
  body.velar-lab{--gutter:20px}
  body.velar-lab .lab-h1{--h1-cap:52px}
  body.velar-lab .lab-sign{height:min(48vh,300px)}
  body.velar-lab .lab-rail{width:100%}
}

/* Reduced motion and the page's own pause: nothing moves by itself; colour feedback stays. */
@media(prefers-reduced-motion:reduce){
  body.velar-lab *,body.velar-lab *::before,body.velar-lab *::after{transition-duration:0s!important}
  body.velar-lab .button:active,body.velar-lab .lab-motion:active,body.velar-lab .strategy-choice:active{transform:none}
}
body.velar-lab[data-motion-pref="paused"] *{animation-play-state:paused!important}
@media(forced-colors:active){
  body.velar-lab .lab-sign-dots,body.velar-lab .lab-mark{forced-color-adjust:none;background-color:CanvasText;background-image:none}
  body.velar-lab .lab-sign-graticule{display:none}
}

/* ——— V21 · Cinematic first screen (owner's choice, 29.09) ———————————————————————————
   One living scene fills the screen: the ₿ built from the simulator's hours glows on the right,
   dust drifts through the whole screen and a river of light traced by the same price history runs
   along the bottom (narrator.js). The copy sits over a soft dark field so it always reads. */
body.velar-lab .lab-hero{position:relative;isolation:isolate;display:block;min-height:calc(100svh - 64px);padding:0;overflow:clip;
  background:
    radial-gradient(46% 62% at 73% 47%,rgb(255 150 46/.22),transparent 64%),
    radial-gradient(30% 38% at 71% 55%,rgb(255 92 54/.14),transparent 62%),
    radial-gradient(70% 45% at 30% 100%,rgb(255 120 40/.09),transparent 70%),
    var(--void)}
body.velar-lab .lab-hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(130% 95% at 50% 42%,transparent 58%,rgb(0 0 0/.6))}
body.velar-lab .lab-hero-grid{position:relative;z-index:21;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;min-height:calc(100svh - 64px);padding-block:clamp(40px,7vh,88px) clamp(96px,14vh,140px);box-sizing:border-box}
body.velar-lab .lab-hero-copy{position:relative;z-index:1;max-width:720px}
body.velar-lab .lab-hero-copy::before{content:"";position:absolute;inset:-18% -26% -18% -14%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgb(6 7 11/.78),rgb(6 7 11/.35) 62%,transparent)}
body.velar-lab .lab-h1{color:var(--bone);text-shadow:0 0 48px rgb(255 178 64/.16)}
body.velar-lab .hero-description{max-width:34em;color:var(--text-2)}
body.velar-lab .lab-cta{background:var(--amber);color:var(--amber-ink);border-color:var(--amber);box-shadow:0 18px 48px -18px rgb(255 140 40/.75)}
@media(hover:hover) and (pointer:fine){body.velar-lab .lab-cta:hover{background:var(--gold);border-color:var(--gold);box-shadow:0 20px 56px -16px rgb(255 160 60/.9)}}
/* The sign stands on the right, almost the height of the screen. */
body.velar-lab .lab-sign-block{position:absolute;z-index:0;top:50%;right:max(2vw,calc((100vw - 1440px)/2 + 8px));transform:translateY(-50%);display:block;pointer-events:none}
body.velar-lab .lab-sign{height:min(80svh,780px)}
body.velar-lab .lab-sign-graticule{display:none}
body.velar-lab .lab-sign-dots{transition:opacity .9s var(--ease-out)}
/* The poster steps aside as the scene ignites over it (a cross-fade, not a cut). */
body.velar-lab .lab-sign[data-narrator="live"] .lab-sign-dots{visibility:visible;opacity:0}
body.velar-lab .lab-sign[data-narrator="still"] .lab-sign-dots{visibility:hidden}
body.velar-lab .lab-narrator{width:100%;height:100%}
body.velar-lab .lab-hero-foot{position:absolute;z-index:21;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:flex-end;gap:20px;padding-block:22px}
body.velar-lab .lab-data-caption{max-width:40ch;margin:0;text-align:right;color:var(--text-3);font-size:13px;line-height:19px}
body.velar-lab .lab-hero-foot .hero-footnote{margin:0 auto 0 0;max-width:40ch;color:var(--text-3);font-size:13px;line-height:19px}
body.velar-lab .lab-data-caption{transition:opacity 240ms var(--ease-out),visibility 0s}
body.velar-lab:not([data-sign="data"]) .lab-data-caption{opacity:0;transition:none}
/* Pause: a quiet control, no frame; the icon and its words are enough. */
body.velar-lab .lab-motion{min-height:44px;padding:0 4px;border:0;background:transparent;color:var(--text-3);font-size:13px;gap:8px;border-radius:var(--r-control)}
@media(hover:hover) and (pointer:fine){body.velar-lab .lab-motion:hover{color:var(--bone);background:transparent}}
body.velar-lab[data-motion-pref="paused"] .lab-motion,body.velar-lab .lab-motion[aria-pressed="true"]{color:var(--bone);border:0}
@media(prefers-reduced-motion:reduce){body.velar-lab .lab-motion{display:none}}
/* Entrance: the headline rises inside its line, the lead settles from 72 %, the sign prints top to
   bottom; the call to action is there from the first frame. */
@keyframes lab-rise{from{transform:translateY(.10em)}}
@keyframes lab-settle{from{opacity:.72;transform:translateY(8px)}}
@keyframes lab-print{from{clip-path:inset(100% 0 0 0)}to{clip-path:inset(0 0 0 0)}}
body.velar-lab .lab-line{overflow:visible}
body.velar-lab .hero-opening:not([data-hero-ready]) .lab-line{overflow:hidden}
html[data-motion-pref="paused"] body.velar-lab .hero-opening:not([data-hero-ready]) *{animation:none!important}
@media(max-width:1100px){
  body.velar-lab .lab-hero-grid{grid-template-columns:minmax(0,1fr)}
  body.velar-lab .lab-sign-block{right:-4vw;opacity:.9}
  body.velar-lab .lab-sign{height:min(70svh,620px)}
}
@media(max-width:900px){
  body.velar-lab .lab-hero,body.velar-lab .lab-hero-grid{min-height:0}
  body.velar-lab .lab-hero-grid{display:flex;flex-direction:column;align-items:stretch;padding-block:40px 24px}
  body.velar-lab .lab-sign-block{position:relative;top:auto;right:auto;transform:none;align-self:center;margin-top:28px}
  body.velar-lab .lab-sign{height:min(58svh,460px)}
  body.velar-lab .lab-hero-foot{position:relative;justify-content:space-between;padding-block:8px 24px}
  body.velar-lab .lab-data-caption{text-align:left}
}

/* The poster, before the scene exists or without script: the same ₿ written in digits. */
body.velar-lab{--glyph-pitch:7px;--digits:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='108' height='108' font-family='ui-monospace,SF Mono,Menlo,Consolas,monospace' font-size='9' font-weight='500' text-anchor='middle' fill='%23D9923A'%3E%3Ctext y='7.5'%3E%3Ctspan x='4.5' fill-opacity='0.83'%3E6%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.61'%3E6%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.94'%3E1%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.47'%3E8%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.83'%3E5%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.77'%3E4%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.64'%3E9%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.68'%3E0%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.86'%3E1%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.56'%3E3%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.91'%3E6%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.88'%3E5%3C/tspan%3E%3C/text%3E%3Ctext y='16.5'%3E%3Ctspan x='4.5' fill-opacity='0.57'%3E2%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.59'%3E4%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.59'%3E4%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.81'%3E2%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.92'%3E1%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.77'%3E7%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.51'%3E3%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.63'%3E9%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.92'%3E0%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.94'%3E2%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.52'%3E8%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.53'%3E4%3C/tspan%3E%3C/text%3E%3Ctext y='25.5'%3E%3Ctspan x='4.5' fill-opacity='0.66'%3E4%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.79'%3E6%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.90'%3E0%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.58'%3E2%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.86'%3E2%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.80'%3E9%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.68'%3E5%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.65'%3E6%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.74'%3E4%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.94'%3E4%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.90'%3E2%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.57'%3E0%3C/tspan%3E%3C/text%3E%3Ctext y='34.5'%3E%3Ctspan x='4.5' fill-opacity='0.83'%3E2%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.48'%3E9%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.70'%3E9%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.83'%3E0%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.70'%3E7%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.94'%3E3%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.90'%3E0%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.57'%3E2%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.59'%3E0%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.77'%3E0%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.45'%3E6%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.65'%3E2%3C/tspan%3E%3C/text%3E%3Ctext y='43.5'%3E%3Ctspan x='4.5' fill-opacity='0.91'%3E9%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.58'%3E3%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.77'%3E3%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.85'%3E7%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.71'%3E2%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.61'%3E8%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.52'%3E3%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.83'%3E2%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.46'%3E6%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.85'%3E4%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.76'%3E5%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.62'%3E6%3C/tspan%3E%3C/text%3E%3Ctext y='52.5'%3E%3Ctspan x='4.5' fill-opacity='0.89'%3E3%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.75'%3E6%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.54'%3E3%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.87'%3E3%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.55'%3E6%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.66'%3E5%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.89'%3E2%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.69'%3E3%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.94'%3E8%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.88'%3E3%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.68'%3E8%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.70'%3E5%3C/tspan%3E%3C/text%3E%3Ctext y='61.5'%3E%3Ctspan x='4.5' fill-opacity='0.92'%3E2%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.91'%3E6%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.91'%3E3%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.65'%3E4%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.62'%3E9%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.80'%3E7%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.45'%3E7%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.82'%3E2%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.73'%3E5%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.71'%3E5%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.63'%3E4%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.48'%3E7%3C/tspan%3E%3C/text%3E%3Ctext y='70.5'%3E%3Ctspan x='4.5' fill-opacity='0.62'%3E8%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.59'%3E5%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.72'%3E4%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.51'%3E5%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.50'%3E5%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.52'%3E6%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.89'%3E3%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.75'%3E9%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.88'%3E2%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.74'%3E2%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.52'%3E6%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.92'%3E3%3C/tspan%3E%3C/text%3E%3Ctext y='79.5'%3E%3Ctspan x='4.5' fill-opacity='0.50'%3E1%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.80'%3E2%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.94'%3E6%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.75'%3E6%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.59'%3E2%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.84'%3E4%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.54'%3E8%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.76'%3E1%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.64'%3E2%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.65'%3E0%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.85'%3E3%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.66'%3E3%3C/tspan%3E%3C/text%3E%3Ctext y='88.5'%3E%3Ctspan x='4.5' fill-opacity='0.49'%3E6%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.71'%3E8%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.46'%3E0%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.47'%3E3%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.90'%3E8%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.52'%3E9%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.90'%3E3%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.71'%3E0%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.90'%3E6%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.55'%3E0%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.90'%3E1%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.85'%3E1%3C/tspan%3E%3C/text%3E%3Ctext y='97.5'%3E%3Ctspan x='4.5' fill-opacity='0.72'%3E9%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.80'%3E3%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.53'%3E1%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.82'%3E5%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.50'%3E9%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.61'%3E1%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.81'%3E7%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.73'%3E9%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.93'%3E8%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.52'%3E2%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.68'%3E2%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.75'%3E0%3C/tspan%3E%3C/text%3E%3Ctext y='106.5'%3E%3Ctspan x='4.5' fill-opacity='0.83'%3E4%3C/tspan%3E%3Ctspan x='13.5' fill-opacity='0.87'%3E1%3C/tspan%3E%3Ctspan x='22.5' fill-opacity='0.89'%3E2%3C/tspan%3E%3Ctspan x='31.5' fill-opacity='0.61'%3E7%3C/tspan%3E%3Ctspan x='40.5' fill-opacity='0.62'%3E8%3C/tspan%3E%3Ctspan x='49.5' fill-opacity='0.50'%3E8%3C/tspan%3E%3Ctspan x='58.5' fill-opacity='0.77'%3E7%3C/tspan%3E%3Ctspan x='67.5' fill-opacity='0.79'%3E8%3C/tspan%3E%3Ctspan x='76.5' fill-opacity='0.67'%3E2%3C/tspan%3E%3Ctspan x='85.5' fill-opacity='0.65'%3E6%3C/tspan%3E%3Ctspan x='94.5' fill-opacity='0.48'%3E9%3C/tspan%3E%3Ctspan x='103.5' fill-opacity='0.84'%3E0%3C/tspan%3E%3C/text%3E%3C/svg%3E")}
body.velar-lab .lab-sign-dots{background-image:var(--digits);background-size:108px 108px}
@media(max-width:600px){body.velar-lab{--glyph-pitch:6px}body.velar-lab .lab-sign-dots{background-size:96px 96px}}
/* Pause: an icon only; its words stay for screen readers. */
body.velar-lab .lab-hero-foot{justify-content:flex-end}
body.velar-lab .lab-motion{width:44px;justify-content:center;padding:0;opacity:.55}
@media(hover:hover) and (pointer:fine){body.velar-lab .lab-motion:hover{opacity:1}}
body.velar-lab .lab-motion:focus-visible{opacity:1}
body.velar-lab .lab-motion .motion-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* The sign cycles through five coin marks, so its field is square; the poster shows the first, BTC.
   The glow behind it takes the light of the coin on screen (narrator.js sets --coin-tint). */
@property --coin-tint{syntax:'<color>';inherits:true;initial-value:#FFB240}
body.velar-lab .lab-sign{height:auto;width:100%;max-width:min(84svh,800px);aspect-ratio:1;margin-inline:auto}
html{transition:--coin-tint 1.4s var(--ease-out,ease)}
/* A11Y: при reduced-motion смена свечения монеты мгновенная, без 1.4s перелива. */
@media(prefers-reduced-motion:reduce){html{transition:none!important}}
body.velar-lab .lab-hero{background:
    radial-gradient(40% 58% at 73% 47%,color-mix(in oklab,var(--coin-tint) 22%,transparent),transparent 66%),
    radial-gradient(26% 34% at 71% 55%,rgb(255 92 54/.10),transparent 62%),
    radial-gradient(70% 45% at 30% 100%,rgb(255 120 40/.07),transparent 70%),
    var(--void)}
@media(max-width:900px){body.velar-lab .lab-sign{height:auto;width:min(92vw,460px)}}

/* The scene lives behind the page (narrator.js): the page's own colour is the root background, so
   every section without a panel of its own shows the rain, and the copy always sits above it. */
html:has(body.velar-lab){background:var(--void,#06070B)}
body.velar-lab{background:transparent}
body.velar-lab .lab-narrator{z-index:-1}
body.velar-lab .lab-hero{background:
    radial-gradient(40% 58% at 73% 47%,color-mix(in oklab,var(--coin-tint) 20%,transparent),transparent 66%),
    radial-gradient(70% 45% at 30% 100%,rgb(255 120 40/.06),transparent 70%)}
/* The sign has its own column; it never slides under the headline. */
body.velar-lab .lab-sign-block{position:relative;top:auto;right:auto;transform:none;grid-column:2;align-self:center;width:100%;z-index:0}
body.velar-lab .lab-hero-grid{grid-template-columns:minmax(0,6fr) minmax(0,6fr);column-gap:clamp(24px,3vw,48px)}
/* Poster: the brand ₿ at 62 % of the coin, inside a dim disc of digits, like the scene's first frame. */
body.velar-lab .lab-sign-dots{-webkit-mask:var(--sign-mask) center/auto 92% no-repeat;mask:var(--sign-mask) center/auto 92% no-repeat}
@media(max-width:900px){body.velar-lab .lab-sign-block{grid-column:auto;max-width:460px;margin-inline:auto}}

/* ——— V21 · Accessibility fixes from the V20 audit (A11Y-01, -02, -04, -06, -09, -17, -18) ——— */
/* The page's pause removes animations instead of freezing them: a frozen entrance keeps its first
   keyframe, which left every dialog at 30 % opacity. #app keeps its 3 s language safety reveal. */
:is(html[data-motion-pref="paused"] body.velar-lab,body.velar-lab[data-motion-pref="paused"]) :is(*:not(#app),*::before,*::after){animation:none!important}
body.velar-lab[data-motion-pref="paused"] dialog::backdrop{animation:none!important}
html:has(body.velar-lab[data-motion-pref="paused"]){scroll-behavior:auto}
/* Older entrances start transparent; content must be visible at rest. */
body.velar-lab .demo-dialog[open],body.velar-lab .demo-dialog[open]::backdrop,body.velar-lab .strategy-dialog[open],body.velar-lab .calculator-chart-panel .scenario-chart{animation:none}
body.velar-lab .form-error{color:var(--loss)}
body.velar-lab .lab-form [aria-invalid="true"]{border-color:var(--loss);box-shadow:0 0 0 1px var(--loss)}
body.velar-lab .chart-unit{color:var(--text-3)}
body.velar-lab{--chart-label:#ABA69E}
body.velar-lab :is(.live-status,.form-error):empty{display:block;position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
body.velar-lab :is(.lab-line-text,.chapter-heading h2,.closing-copy h2,.transparency-intro h2){overflow-wrap:anywhere}
@media(max-width:1100px){body.velar-lab :is(.transparency-section,.closing-section){grid-template-columns:minmax(0,1fr)}}
@media(forced-colors:active){body.velar-lab [aria-pressed="true"]{forced-color-adjust:none;background:Highlight;color:HighlightText;border-color:Highlight}}
/* Legacy hover lift on every button: V21 buttons never jump. */
@media(hover:hover) and (pointer:fine){body.velar-lab .button:hover{transform:none}}
body.velar-lab :is(.button,.lab-motion):active{transform:scale(.97);transition:transform var(--dur-press) var(--ease-out)}
@media(prefers-reduced-motion:reduce){body.velar-lab *,body.velar-lab *::before,body.velar-lab *::after{transition-property:color,background-color,border-color,text-decoration-color,opacity!important;transition-duration:120ms!important;transition-timing-function:ease!important}}

/* Header controls without frames: a soft surface instead of an outline. */
body.velar-lab .site-header .header-account{border-color:transparent;background:rgb(243 238 230/.06)}
@media(hover:hover) and (pointer:fine){body.velar-lab .site-header .header-account:hover{background:rgb(243 238 230/.12);border-color:transparent}}
body.velar-lab .site-header :is(.language-control,.language-select,.landing-menu-button){border-color:transparent;background:rgb(243 238 230/.06)}

/* ——— V21 · The strategy artworks run with the same code rain: digits flow through their light only ——— */
body.velar-lab #strategies .strategy-art::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:var(--digits),var(--digits);background-size:108px 108px,72px 72px;background-position:0 0,36px 0;
  -webkit-mask:var(--art-mask) center/cover no-repeat;mask:var(--art-mask) center/cover no-repeat;
  -webkit-mask-source-type:luminance;mask-mode:luminance;mix-blend-mode:screen;opacity:.9;
  animation:v21-art-rain 6s linear infinite}
@keyframes v21-art-rain{to{background-position:0 108px,36px 144px}}
body.velar-lab #strategy-panel-market .strategy-art{--art-mask:url("/assets/art/strategy-trades-1280.webp")}
body.velar-lab #strategy-panel-staking .strategy-art{--art-mask:url("/assets/art/strategy-staking-1280.webp")}
body.velar-lab #strategy-panel-liquidity .strategy-art{--art-mask:url("/assets/art/strategy-liquidity-1280.webp")}
@media(max-width:600px){
  body.velar-lab #strategy-panel-market .strategy-art{--art-mask:url("/assets/art/strategy-trades-portrait-768.webp")}
  body.velar-lab #strategy-panel-staking .strategy-art{--art-mask:url("/assets/art/strategy-staking-portrait-768.webp")}
  body.velar-lab #strategy-panel-liquidity .strategy-art{--art-mask:url("/assets/art/strategy-liquidity-portrait-768.webp")}
}
@media(prefers-reduced-motion:reduce){body.velar-lab #strategies .strategy-art::after{animation:none}}

/* The closing V is written in running digits: two layers of the digit tile flow down through the
   V's own outline, over its warm light. Still under reduced motion and on the page's pause. */
body.velar-lab .lab-mark{background-image:var(--digits),var(--digits),linear-gradient(180deg,rgb(255 211 122/.55),rgb(255 150 50/.35));
  background-size:81px 81px,54px 54px,100% 100%;background-position:0 0,27px 0,0 0;animation:v21-mark-rain 5s linear infinite;filter:drop-shadow(0 0 28px rgb(255 160 60/.35))}
@keyframes v21-mark-rain{to{background-position:0 81px,27px 108px,0 0}}
@media(prefers-reduced-motion:reduce){body.velar-lab .lab-mark{animation:none}}


/* V26 Offers: продажная секция ставок */
.offers-section{padding:64px 0 8px}
.offers-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.offer-card{position:relative;background:var(--panel,#0C0E14);border:1px solid var(--line,#20232F);border-radius:18px;padding:22px 20px;display:flex;flex-direction:column;gap:10px}
.offer-card h3{margin:0;font-family:"Science Gothic",sans-serif;font-size:24px;font-weight:600;letter-spacing:.05em}
.offer-rate{margin:0;color:var(--mut,#8F96AC);font-size:14px}
.offer-rate b{display:block;font-size:34px;color:var(--amber,#FFB240);font-variant-numeric:tabular-nums}
.offer-card ul{margin:0;padding:0;list-style:none;color:var(--mut,#8F96AC);font-size:13.5px;line-height:1.75}
.offer-card li::before{content:"— "}
.offer-card .button{margin-top:auto;text-align:center}
.offer-hot{border-color:rgba(255,178,64,.55)}
.offer-flag{position:absolute;top:-10px;right:14px;background:var(--amber,#FFB240);color:#151004;font-size:11px;font-weight:700;border-radius:999px;padding:2px 10px}
.offers-strip{margin-top:22px;padding:18px 20px;border:1px dashed var(--line,#20232F);border-radius:14px;color:var(--mut,#8F96AC);font-size:14px}
.offers-strip p{margin:0 0 6px}
.offers-legal{font-size:12.5px;opacity:.75}
.section.offers-section .chapter-head h2{font-family:"Science Gothic",sans-serif;font-size:clamp(24px,3.6vw,38px);font-weight:540;margin:0 0 6px}
.section.offers-section .chapter-head p{color:var(--mut,#8F96AC);max-width:64ch;margin:0}
@media(max-width:640px){.offers-grid{grid-template-columns:1fr 1fr}.offer-card .button{padding:10px 12px}}
@media(max-width:420px){.offers-grid{grid-template-columns:1fr}}


/* V27 Trust-stats: живые цифры платформы */
.trust-stats{padding:56px 0 8px}
.stats-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.stat-card{background:var(--panel,#0C0E14);border:1px solid var(--line,#20232F);border-radius:16px;padding:18px 20px}
.stat-card span{color:var(--mut,#8F96AC);font-size:13px;display:block}
.stat-card b{display:block;font-size:30px;font-variant-numeric:tabular-nums;margin-top:4px}
.stat-card small{color:var(--mut,#8F96AC);font-size:12px}
.stat-cover b{color:var(--ok,#2FD49A)}


/* V27.1 Conversion: steps, advantages, live payouts, invite banner */
.steps-section,.adv-section,.live-payouts{padding:56px 0 8px}
.steps-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.step-card{background:var(--panel,#0C0E14);border:1px solid var(--line,#20232F);border-radius:18px;padding:22px;position:relative}
.step-num{display:inline-flex;width:38px;height:38px;align-items:center;justify-content:center;background:var(--amber,#FFB240);color:#151004;font-weight:800;border-radius:12px;font-size:18px;margin-bottom:10px}
.step-card h3,.adv-card h3{margin:0 0 6px;font-family:"Science Gothic",sans-serif;font-size:20px;font-weight:600}
.step-card p,.adv-card p{margin:0;color:var(--mut,#8F96AC);font-size:14px}
.adv-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.live-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--ok,#2FD49A);margin-right:6px;animation:ldPulse 1.6s infinite}
@keyframes ldPulse{0%,100%{opacity:1}50%{opacity:.3}}
@media(prefers-reduced-motion:reduce){.live-dot{animation:none}}
.payout-table{width:100%;border-collapse:collapse;font-size:14px;background:var(--panel,#0C0E14);border:1px solid var(--line,#20232F);border-radius:14px;overflow:hidden}
.payout-table th{text-align:left;color:var(--mut,#8F96AC);padding:10px 14px;border-bottom:1px solid var(--line2,#2A2E3D);font-weight:500}
.payout-table td{padding:9px 14px;border-bottom:1px solid var(--line,#20232F);font-variant-numeric:tabular-nums}
/* CLS: tbody стартует пустым, снимок подставляет до 10 строк (landing-conversion.js slice(0,10)).
   Пока строк нет, резервируем высоту шапки и десяти строк, чтобы отрисовка не сдвигала секцию. */
.live-payouts .p6-table-scroll:has(#payout-table tbody:empty){min-height:424px}
.payout-kind{color:var(--ok,#2FD49A)}
.invites-banner{padding:44px 0}
.invite-inner{background:linear-gradient(135deg,rgba(255,178,64,.14),rgba(255,92,54,.08));border:1px solid rgba(255,178,64,.4);border-radius:22px;padding:34px;text-align:center}
.invite-inner h2{margin:0 0 8px;font-family:"Science Gothic",sans-serif;font-size:clamp(22px,3.4vw,34px);font-weight:540}
.invite-inner p{color:var(--mut,#8F96AC);max-width:58ch;margin:0 auto 16px}
.invite-inner .button{display:inline-block;padding:13px 30px;font-size:16px}
.invite-inner small{display:block;margin-top:12px;color:var(--mut,#8F96AC);font-size:12px}


/* V28.1 FAQ */
.faq-section{padding:56px 0 8px}
.faq-list{display:grid;gap:10px;max-width:820px}
.faq-item{background:var(--panel,#0C0E14);border:1px solid var(--line,#20232F);border-radius:14px;padding:4px 18px}
.faq-item summary{cursor:pointer;padding:14px 0;font-weight:600;font-size:15.5px;list-style:none;position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:0;color:var(--amber,#FFB240);font-size:20px;font-weight:400;transition:transform .2s}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item p{color:var(--mut,#8F96AC);font-size:14px;margin:0 0 14px;line-height:1.65}


/* мобильный CTA в хедере: не прятать, ужать */
@media(max-width:600px){.header-account{padding:8px 12px;font-size:13px}}


/* ChatGPT 10-social-proof */
/* BEGIN SECTION 10 SCOPED STYLES */
[data-velar-proof] { margin-block: 48px; }
[data-velar-proof] [hidden], [data-velar-proof][hidden] { display: none !important; }
[data-velar-proof] :is(h2, h3) { line-height: 1.2; }
[data-velar-proof] a { color: var(--amber, #FFB240); text-underline-offset: .2em; }
[data-velar-proof] button { font: inherit; color: inherit; background: transparent; border: 1px solid var(--line, #59606b); border-radius: 8px; padding: .5rem .8rem; cursor: pointer; }
[data-velar-proof] button:disabled { opacity: .6; cursor: wait; }
[data-velar-proof] :is(a, button):focus-visible { outline: 3px solid var(--amber, #FFB240); outline-offset: 5px; }
[data-velar-proof] .proof-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 24px; }
[data-velar-proof] article { min-width: 0; padding-top: 22px; border-top: 1px solid var(--line, #59606b); }
[data-velar-proof] dt { color: var(--mut, #b7bec9); }
[data-velar-proof] dd { margin: 0 0 12px; font-weight: 600; font-variant-numeric: tabular-nums; }
[data-velar-proof] .label { color: var(--amber, #FFB240); font-size: .9rem; }
[data-velar-proof] .note { font-size: .9rem; color: var(--mut, #c0c4cd); }
[data-velar-proof].activity { border-block: 1px solid var(--line, #59606b); padding: 24px 0; min-height: 180px; }
[data-velar-proof].activity p { margin-block: 10px; }
/* END SECTION 10 SCOPED STYLES */


/* V30.5 D4 tap-targets WCAG 2.5.8: инлайн-ссылки и мелкие ссылки ≥44px на touch */
@media(pointer:coarse){
  .section-note a, .chart-method a, .offers-legal a, .faq-item p a,
  .skip-link, .closing-cta, .sub a { min-height:44px; display:inline-flex; align-items:center; padding:8px 4px; }
  .brand-wordmark { min-height:44px; display:inline-flex; align-items:center; }
  /* D4 tap-targets: единственная точка входа в шапке не должна мельчать на телефоне
     (@media max-width:600px опускает её до 38px), а переключатели рынка — до 40px по ширине. */
  body.velar-lab .site-header .header-account { min-height:44px; }
  body.velar-lab .market-terminal :is(.market-pairs,.market-intervals,.market-display-modes) button,
  body.velar-lab .market-terminal .market-zoom-controls button { min-width:44px; }
  /* Ссылка внутри FAQ и кнопка меню: на телефоне 21px и 37px по короткой стороне. */
  body.velar-lab .faq-item a { min-height:44px; display:inline-flex; align-items:center; padding-block:8px; }
  body.velar-lab .landing-menu-button { min-width:44px; }
}
.skip-link:focus { background:#FFB240; color:#151004; border-radius:8px; }  /* soften flash */


/* V31 coin-rain hero layer */
.lab-sign-block{position:relative;overflow:hidden}
#coin-rain{z-index:2;mix-blend-mode:screen}
.lab-sign-still{position:relative;z-index:1}

/* ── Аудит главных страниц: состояния, которых не хватало на лендинге ──────────────
   1) Выбранный сегмент не отвечал на наведение: правило наведения было написано
      только для невыбранных (`button:not([aria-pressed="true"]):hover`). Наведение
      на активный сегмент — тот же золотой шаг, что у .lab-cta:hover. */
@media(hover:hover) and (pointer:fine){
  body.velar-lab .market-terminal button[aria-pressed="true"]:hover{background:var(--gold);border-color:var(--gold);color:var(--void);transition-duration:0s}
  body.velar-lab .strategy-choice[aria-pressed="true"]:hover{border-color:var(--gold);transition-duration:0s}
}
/* 2) Нажатие для ссылок: у кнопок :active был, у текстовых ссылок и пунктов меню —
   нет, поэтому на тапе (грубый указатель) ссылка не отвечала ничем. */
body.velar-lab a:active{opacity:.72}

/* ── Мобильный аудит 320/360/390/414/768 + альбомная ориентация (headless Chrome, CDP) ──────────
   Замеры ДО правки на 320×568 (coarse pointer): шапка лендинга требовала 409px при экране 320px,
   .header-tools выходил на +54px, документ получал горизонтальный скролл 374px, а мобильный
   браузер включал shrink-to-fit (innerWidth 374 при clientWidth 320) — то есть на реальном
   телефоне страница «уезжала» и масштаб менялся. Здесь: шапка переносится и ужимается, поэтому
   ни один язык с более длинной подписью («Создать счёт», «Кабінет», «Аккаунт ашу») не ломает ряд. */
@media(max-width:420px){
  body.velar-lab .site-header{flex-wrap:wrap;padding-inline:14px;gap:8px}
  body.velar-lab .brand-wordmark{min-width:0;overflow-wrap:anywhere}
  body.velar-lab .header-tools{flex:1 1 auto;justify-content:flex-end;min-width:0;gap:6px}
  body.velar-lab .language-control.language-compact{padding-inline:8px}
  body.velar-lab .language-control.language-compact .language-current{font-size:11px}
  body.velar-lab .site-header .header-account{font-size:12px;padding:0 10px;min-height:44px;flex:0 1 auto}
  body.velar-lab .site-header .landing-menu-button{width:44px;min-width:44px}
}

/* Мелкий ввод на телефоне: iOS/Chromium приближают страницу к полю с font-size < 16px и обратно
   не возвращают — экран «прыгает» на каждом фокусе. Интерактивные поля держим на 16px. */
@media(max-width:700px){
  body.velar-lab .lab-form select{font-size:16px}
  body.velar-lab .landing-referral-field input,
  body.velar-lab .landing-referral-field select,
  body.velar-lab .chart-probe input,
  body.velar-lab .chart-probe select{font-size:16px}
}

/* Длинные строки: агглютинативные локали (kk, ky, uz, tg, tk) и составные немецкие слова дают
   слова в 1,6–2 раза длиннее русского. Переносим по границам слов, край — по символу,
   чтобы ни заголовок, ни кнопка не вылезали за экран. */
body.velar-lab :is(h1,h2,h3,h4,.button,.status-chip,.metric-card strong,.investment-metrics strong){overflow-wrap:anywhere}
:is(html:lang(kk),html:lang(ky),html:lang(uz-Latn),html:lang(uz-Cyrl),html:lang(tg),html:lang(tk)) body.velar-lab :is(h1,h2,h3,h4,p,li,dd,dt,figcaption){hyphens:auto}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}

/* Альбомная ориентация телефона: высота 320–390px. Первый экран не должен требовать прокрутки
   «сквозь» декоративную сцену, а панели — перекрывать кнопку действия. */
@media(orientation:landscape) and (max-height:480px){
  body.velar-lab .lab-hero{min-height:0;padding-top:24px}
  body.velar-lab .lab-sign{height:min(60vh,200px)}
  body.velar-lab .lab-sign-block{position:relative}
  body.velar-lab .lab-hero-grid{row-gap:20px}
  body.velar-lab .section,body.velar-lab .market-section,body.velar-lab .transparency-section,body.velar-lab .closing-section{padding-block:48px}
  body.velar-lab .sticky-scene{position:static}
}

/* Системные бары (вырез, индикатор жеста): последнее действие и подвал не должны уходить под них. */
body.velar-lab .closing-section{padding-bottom:calc(24px + env(safe-area-inset-bottom))}
body.velar-lab .site-footer{padding-bottom:calc(20px + env(safe-area-inset-bottom))}
body.velar-lab .site-header{padding-top:env(safe-area-inset-top)}

/* Медленное соединение: пока woff2 не пришли, текст показывается системным шрифтом, а не исчезает
   (font-display:swap в assets/fonts/v20/fonts.css). Резервируем место под декоративные картинки,
   чтобы после их загрузки вёрстка не сдвигалась (CLS). */
body.velar-lab .closing-visual img,body.velar-lab .closing-visual picture img{aspect-ratio:16/9;width:100%;height:auto;object-fit:cover}
body.velar-lab img{max-width:100%}

/* ── Направление письма (dir) ────────────────────────────────────────────────────────────────
   Ни одна из 14 локалей не пишется справа налево, но признак направления уже приходит из
   i18n.dirFor()/boot-lang.js (html[dir]). Новые правила ниже используют логические свойства,
   и добавление RTL-словаря не потребует ни одной правки разметки: зеркалятся зазоры, отступы
   текста, позиция стрелок и полос прогресса. */
html[dir="rtl"] body.velar-lab{direction:rtl}
html[dir="rtl"] body.velar-lab .lab-hero-grid,
html[dir="rtl"] body.velar-lab .story-layout,
html[dir="rtl"] body.velar-lab .transparency-section{direction:rtl}
html[dir="rtl"] body.velar-lab :is(.section-heading,.chapter-head,.strategy-numbers dt){text-align:right}
html[dir="rtl"] body.velar-lab :is(.hero-actions,.quick-actions,.panel-actions){justify-content:flex-start}
html[dir="rtl"] body.velar-lab :is(.lab-form label,.market-identity,.result-line,.operation-row){flex-direction:row-reverse;text-align:right}
html[dir="rtl"] body.velar-lab :is(.hold-track,.progress,.bar){transform:scaleX(-1)}
html[dir="rtl"] body.velar-lab :is(.landing-menu-button,.dialog-close){inset-inline-start:auto}
html[dir="rtl"] body.velar-lab .site-footer nav{text-align:right}
