@import url('/tokens.css?v=dfa1880a0d03');
/* Hallmark · pre-emit critique: P5 H5 E4 S5 R4 V4
 * genre: atmospheric · macrostructure: Marquee Hero + product demonstrations
 * theme: studied-DNA · source: https://www.deepcharts.com/ · nav: N5 · footer: Ft2
 * user direction: Deepcharts layout and animation, original ZetaChart content and colors.
 */
* { box-sizing:border-box; }
html,body { margin:0; overflow-x:clip; }
html { scroll-behavior:smooth; scroll-padding-top:112px; }
body { color:var(--landing-ink); background:var(--landing-paper); font:400 var(--landing-body)/1.6 var(--font-body); -webkit-font-smoothing:antialiased; }
button,input { font:inherit; }
a { color:inherit; text-decoration:none; }
button { color:inherit; cursor:pointer; }
a,button { -webkit-tap-highlight-color:var(--landing-clear); touch-action:manipulation; }
button,a.button { white-space:nowrap; }
button { border:0; }
button:disabled { cursor:not-allowed; opacity:.55; }
button:active:not(:disabled) { transform:translateY(1px); }
:focus-visible { outline:2px solid var(--landing-accent-light); outline-offset:5px; }
[hidden] { display:none!important; }
h1,h2,h3,p,figure { margin:0; }
h1,h2,h3 { font-family:var(--font-display); font-style:normal; font-weight:600; min-width:0; overflow-wrap:anywhere; }
h1,h2 { letter-spacing:-.045em; line-height:1.14; }
h2 { font-size:var(--landing-heading); }
h1 span,h2 span { color:var(--landing-muted); }
p { color:var(--landing-muted); }
.container { width:min(1200px,calc(100% - 32px)); margin-inline:auto; }
.skip-link { position:fixed; top:12px; left:12px; z-index:var(--landing-z-menu); padding:12px 20px; border-radius:8px; background:var(--landing-ink); color:var(--landing-paper); transform:translateY(-180%); }
.skip-link:focus { transform:none; }
.announcement { min-height:54px; display:flex; align-items:center; justify-content:center; gap:12px; padding:8px 16px; border-bottom:1px solid var(--landing-rule); background:radial-gradient(ellipse at 50% 100%,var(--landing-glow),var(--landing-clear) 68%); font-size:10px; font-weight:500; letter-spacing:.07em; }
.announcement-mark { display:grid; place-items:center; flex:none; width:28px; height:28px; }
.announcement a { display:none; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:8px; position:sticky; top:12px; z-index:var(--landing-z-header); min-height:62px; margin-top:20px; padding:8px 10px; background:var(--landing-scrim); border:1px solid var(--landing-rule-soft); border-radius:9px; backdrop-filter:blur(16px); }
.brand { flex:none; display:inline-flex; align-items:center; min-height:44px; }
.brand-logo { position:relative; display:block; flex:none; width:130px; aspect-ratio:11/3; overflow:hidden; mix-blend-mode:lighten; }
.brand-logo img { position:absolute; left:-9.090909%; top:-63.333333%; width:116.363636%; height:auto; max-width:none; display:block; }
.site-header .brand-logo { width:94px; }
.desktop-nav { display:none; align-items:center; gap:28px; font-size:14px; }
.desktop-nav a { white-space:nowrap; min-height:44px; display:inline-flex; align-items:center; gap:7px; }
.desktop-nav a span { color:var(--landing-subtle); }
.desktop-nav a:hover,.nav-login:hover,.footer-links a:hover { color:var(--landing-accent-light); }
.nav-actions { display:flex; align-items:center; gap:5px; }
.nav-login { display:none; font-size:14px; white-space:nowrap; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:24px; min-height:50px; padding:12px 27px; border-radius:5px; border:1px solid var(--landing-rule); font-size:16px; font-weight:500; line-height:1.2; transition:background-color var(--dur-short) var(--ease-out),transform var(--dur-micro) var(--ease-out),border-color var(--dur-short) var(--ease-out); }
.button-primary { background:var(--landing-accent); border-color:var(--landing-accent-hover); color:var(--landing-ink); box-shadow:inset 0 0 0 1px var(--landing-white-soft),0 0 18px var(--landing-glow); }
.button-primary:hover { background:var(--landing-accent-hover); }
.button-outline { background:var(--landing-clear); border-color:var(--landing-subtle); color:var(--landing-muted); }
.button-outline:hover { color:var(--landing-ink); border-color:var(--landing-ink); }
.button:active { transform:translateY(1px); }
.button-small { min-height:40px; padding:10px; gap:6px; font-size:11px; }
.menu-toggle { display:flex; flex-direction:column; justify-content:center; gap:6px; width:44px; min-height:44px; padding:12px; background:var(--landing-clear); }
.menu-toggle span { height:1px; width:20px; background:var(--landing-ink); }
.mobile-nav { position:absolute; top:calc(100% + 10px); left:0; right:0; padding:12px; border:1px solid var(--landing-rule); border-radius:9px; background:var(--landing-surface); box-shadow:0 16px 32px var(--landing-chart-shadow); }
.mobile-nav a { display:flex; align-items:center; min-height:46px; padding:8px 12px; border-radius:5px; }
.mobile-nav a:hover { background:var(--landing-elevated); }
.hero { position:relative; padding-top:64px; }
.hero:before { content:""; position:absolute; inset:40px -150px 200px; background:radial-gradient(ellipse at 50% 40%,var(--landing-bloom),var(--landing-clear) 70%); pointer-events:none; z-index:var(--landing-z-base); }
.hero-copy { position:relative; text-align:center; margin-bottom:38px; }
h1 { font-size:var(--landing-display); }
.hero-copy p { font-size:16px; margin-top:17px; line-height:1.55; }
.hero-chart { position:relative; z-index:var(--landing-z-content); box-shadow:0 -3px 32px var(--landing-glow); }
.chart-frame { border:1px solid var(--landing-rule); border-radius:16px; background:var(--landing-chart-paper); overflow:hidden; }
.hero-chart { border-color:color-mix(in srgb,var(--landing-accent) 45%,var(--landing-rule)); }
.chart-toolbar { min-height:51px; padding:9px 14px; display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid var(--landing-chart-grid); }
.chart-identity { display:flex; align-items:center; gap:8px; font-size:12px; line-height:1; }
.market-mark { border:1px solid var(--landing-rule); border-radius:5px; width:27px; height:27px; display:grid; place-items:center; font-family:var(--font-mono); color:var(--landing-accent-light); font-size:12px; }
.chart-subtitle { display:none; color:var(--landing-subtle); font-size:12px; }
.chart-interval { color:var(--landing-muted); padding:5px 7px; background:var(--landing-elevated); border-radius:3px; }
.historical-label { display:flex; align-items:center; gap:6px; color:var(--landing-subtle); font-size:10px; white-space:nowrap; }
.historical-label i { width:5px; height:5px; border-radius:50%; background:var(--landing-subtle); }
.hero-chart-stage { height:300px; position:relative; }
.chart-fallback { display:grid; height:100%; place-items:center; min-height:180px; color:var(--landing-subtle); font-size:14px; }
.chart-controls { display:flex; align-items:center; justify-content:space-between; padding:8px 10px; gap:4px; border-top:1px solid var(--landing-chart-grid); }
.example-switch,.comparison-switch { display:flex; gap:3px; }
.example-switch button,.comparison-switch button { background:var(--landing-clear); display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:9px 8px; border:1px solid var(--landing-clear); border-radius:5px; font-size:11px; min-height:40px; }
.example-switch button[aria-pressed=true],.comparison-switch button[aria-pressed=true] { background:var(--landing-elevated); border-color:var(--landing-rule); }
.signal-dot { display:inline-block; flex:none; width:6px; height:6px; border-radius:50%; }
.signal-dot.buy { background:var(--landing-buy); }
.signal-dot.sell { background:var(--landing-sell); }
.replay-controls { display:flex; align-items:center; gap:3px; }
.replay-controls>span { display:none; color:var(--landing-subtle); font-size:11px; font-family:var(--font-mono); }
.icon-button { display:grid; place-items:center; min-width:36px; min-height:40px; padding:5px; background:var(--landing-clear); border-radius:5px; color:var(--landing-muted); font-size:20px; }
.icon-button:hover { background:var(--landing-elevated); color:var(--landing-ink); }
.hero-chart figcaption { padding:10px 14px; color:var(--landing-subtle); font-size:10px; border-top:1px solid var(--landing-chart-grid); text-align:center; }
.hero-chart figcaption a { color:var(--landing-muted); text-decoration:underline; text-underline-offset:3px; white-space:nowrap; }
.hero-actions,.section-actions { position:relative; display:flex; flex-wrap:wrap; justify-content:center; gap:14px; margin-top:32px; }
.hero-actions .button { flex:1; min-width:240px; max-width:320px; }
.product-strip { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px 16px; margin:58px auto 0; max-width:1000px; text-align:center; }
.product-strip strong { display:block; font-size:32px; letter-spacing:-.05em; font-weight:500; line-height:1.2; }
.product-strip span { display:block; margin-top:10px; color:var(--landing-subtle); font-size:12px; }
.feature-section { padding-top:112px; }
.section-heading { text-align:center; max-width:900px; margin:0 auto 40px; }
.section-tag { display:inline-flex; align-items:center; gap:10px; padding:6px 13px 6px 6px; border-radius:8px; background:var(--landing-elevated); border:1px solid var(--landing-rule-soft); font-size:12px; margin-bottom:20px; line-height:1.3; }
.tag-mark { flex:none; background:var(--landing-surface); border:1px solid var(--landing-accent-hover); width:28px; height:28px; border-radius:4px; display:grid; place-items:center; font-weight:600; color:var(--landing-ink); box-shadow:0 0 15px var(--landing-glow); }
.section-heading p { margin-top:17px; font-size:16px; }
.feature-tabs { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:4px; max-width:700px; margin:0 auto 27px; }
.feature-tabs button { display:flex; flex-direction:column; align-items:center; gap:10px; background:var(--landing-clear); padding:6px 0; min-height:96px; font-size:10px; color:var(--landing-subtle); }
.feature-tabs button[aria-selected=true] { color:var(--landing-ink); }
.feature-symbol { height:49px; width:49px; position:relative; display:flex; align-items:center; justify-content:center; gap:4px; border:1px solid var(--landing-rule); border-radius:10px; background:var(--landing-surface); color:var(--landing-subtle); transition:border-color var(--dur-short) var(--ease-out),color var(--dur-short) var(--ease-out); }
[aria-selected=true] .feature-symbol { border-color:var(--landing-accent); color:var(--landing-accent-light); box-shadow:0 0 22px var(--landing-glow); }
.bubbles-icon i { border-radius:50%; height:12px; width:12px; background:currentColor; opacity:.5; }
.bubbles-icon i:first-child { align-self:flex-end; margin-bottom:12px; width:8px; height:8px; }
.bubbles-icon i:last-child { position:absolute; width:6px; height:6px; right:10px; top:8px; }
.lines-icon { flex-direction:column; gap:6px; }
.lines-icon i { display:block; width:25px; height:2px; background:currentColor; }
.lines-icon i:nth-child(2) { width:32px; }
.candles-icon i { display:block; height:18px; width:6px; background:currentColor; position:relative; }
.candles-icon i:before { content:""; position:absolute; width:1px; top:-5px; bottom:-5px; left:3px; background:currentColor; }
.candles-icon i:nth-child(2) { height:10px; color:var(--landing-down); transform:translateY(7px); }
.views-icon { font-family:var(--font-mono); font-size:15px; }
.feature-preview { display:grid; grid-template-columns:minmax(0,1fr); position:relative; min-height:400px; background:var(--landing-surface); }
.preview-copy { padding:28px 24px 8px; z-index:var(--landing-z-content); }
.preview-kicker { display:block; font:10px var(--font-mono); color:var(--landing-accent-light); letter-spacing:.08em; margin-bottom:12px; }
.preview-copy h3 { font-size:29px; line-height:1.13; letter-spacing:-.035em; }
.preview-copy p { font-size:14px; max-width:34ch; margin-top:14px; }
.text-link { display:inline-flex; align-items:center; gap:12px; min-height:44px; background:var(--landing-clear); padding:0; font-size:14px; color:var(--landing-ink); white-space:nowrap; }
.text-link:hover { color:var(--landing-accent-light); }
.preview-copy .text-link { margin-top:17px; }
.feature-chart-stage { height:300px; min-width:0; position:relative; }
.examples-section { padding-top:112px; }
.example-cards { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; }
.example-card { min-width:0; border:1px solid var(--landing-rule); border-radius:20px; background:var(--landing-surface); overflow:hidden; position:relative; }
.card-chart { height:260px; position:relative; background:var(--landing-chart-paper); }
.card-chart:after { content:""; pointer-events:none; position:absolute; bottom:0; height:80px; left:0; right:0; background:linear-gradient(var(--landing-clear),var(--landing-surface)); }
.card-copy { padding:12px 24px 21px; }
.card-date { color:var(--landing-subtle); font:10px/1.5 var(--font-mono); letter-spacing:.04em; }
.card-copy h3 { margin-top:13px; font-size:24px; line-height:1.2; letter-spacing:-.035em; }
.direction-buy { color:var(--landing-buy); }
.direction-sell { color:var(--landing-sell); }
.card-copy p { margin-top:11px; font-size:14px; line-height:1.65; }
.card-copy .text-link { margin-top:14px; }
.buy-card { background:radial-gradient(ellipse at 10% 50%,var(--landing-buy-soft),var(--landing-surface) 60%); }
.sell-card { background:radial-gradient(ellipse at 50% 50%,var(--landing-sell-soft),var(--landing-surface) 65%); }
.example-note { max-width:850px; margin:23px auto 0; font-size:12px; line-height:1.7; text-align:center; scroll-margin-top:130px; }
.section-actions { margin-top:38px; }
.animation-actions { display:flex; justify-content:center; align-items:center; margin-top:12px; }
.animation-actions .text-link { color:var(--landing-subtle); font-size:12px; }
.section-actions .button { width:100%; max-width:320px; }
.workspace-section { padding-top:110px; }
.workspace-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:22px; }
.workspace-card { border:1px solid var(--landing-rule); border-radius:16px; background:var(--landing-surface); overflow:hidden; min-width:0; }
.workspace-card-copy { padding:26px 24px 0; }
.workspace-card-copy h3 { font-size:23px; letter-spacing:-.035em; }
.workspace-card-copy p { font-size:14px; margin-top:10px; max-width:50ch; }
.timeframe-demo { padding:24px 12px 12px; }
.timeframe-options { display:flex; gap:3px; justify-content:center; padding:5px; border:1px solid var(--landing-rule-soft); background:var(--landing-paper); border-radius:7px; width:max-content; max-width:100%; margin:auto; }
.timeframe-options button { display:grid; place-items:center; min-width:36px; min-height:36px; padding:6px; border-radius:4px; font:12px var(--font-mono); background:var(--landing-clear); color:var(--landing-subtle); }
.timeframe-options button[aria-pressed=true] { background:var(--landing-accent); color:var(--landing-ink); }
.timeframe-chart { height:190px; margin-top:16px; }
.timeframe-status { text-align:center; font:10px var(--font-mono); margin:8px 0 4px; }
.focused-chart { height:225px; margin:25px 12px 0; }
.workspace-link { display:flex; align-items:center; justify-content:space-between; gap:14px; border-top:1px solid var(--landing-rule-soft); padding:13px 24px; font-size:13px; }
.workspace-link:hover { color:var(--landing-accent-light); }
.comparison-section { padding-top:120px; }
.comparison-section .section-heading { margin-bottom:25px; }
.comparison-switch { justify-content:center; margin-bottom:22px; }
.comparison-switch button { font-size:13px; padding:10px 16px; }
.comparison { height:350px; position:relative; --split:50%; background:var(--landing-chart-paper); isolation:isolate; }
.compare-chart { position:absolute; inset:0; }
.compare-after { clip-path:inset(0 0 0 var(--split)); }
.compare-label { position:absolute; top:17px; z-index:var(--landing-z-content); padding:5px 9px; border:1px solid var(--landing-rule); border-radius:4px; background:var(--landing-scrim); font-size:10px; display:flex; align-items:center; gap:7px; pointer-events:none; }
.compare-label-before { left:14px; }
.compare-label-after { right:14px; }
.compare-divider { position:absolute; top:0; bottom:0; left:var(--split); width:2px; background:var(--landing-accent-light); box-shadow:0 0 18px var(--landing-glow); z-index:var(--landing-z-overlay); pointer-events:none; }
.compare-handle { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); height:48px; width:48px; background:var(--landing-accent); border:1px solid var(--landing-accent-light); border-radius:50%; display:flex; justify-content:center; align-items:center; gap:6px; color:var(--landing-ink); font-size:29px; line-height:1; box-shadow:0 0 25px var(--landing-glow); }
.compare-handle i { display:block; width:1px; height:15px; background:var(--landing-accent-light); }
.compare-input { position:absolute; inset:0; cursor:ew-resize; z-index:var(--landing-z-controls); touch-action:pan-y; outline-offset:-6px; }
.comparison:has(.compare-input:focus-visible) { border-color:var(--landing-accent-light); }
.comparison.is-dragging,.comparison.is-dragging * { cursor:ew-resize; user-select:none; }
.comparison-figure figcaption { display:flex; flex-direction:column; align-items:center; gap:7px; text-align:center; margin-top:16px; color:var(--landing-subtle); font-size:11px; }
.comparison-figure figcaption>span:first-child { color:var(--landing-muted); font-size:13px; }
.comparison-figure figcaption>span:last-child { font-size:10px; }
.access-section { margin-top:110px; display:grid; grid-template-columns:minmax(0,1fr); padding:30px 24px; border:1px solid var(--landing-rule); border-radius:20px; background:radial-gradient(ellipse at 90% 50%,var(--landing-bloom),var(--landing-surface) 70%); }
.access-copy { position:relative; z-index:var(--landing-z-content); }
.access-copy h2 { font-size:clamp(1.9rem,3.6vw,2.7rem); }
.access-copy>p { margin-top:20px; max-width:48ch; font-size:15px; }
.access-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:25px; }
.access-actions .button { min-width:200px; flex:1; max-width:280px; }
.access-copy .access-footnote { font-size:11px; margin-top:18px; }
.access-art { position:relative; height:290px; display:grid; place-items:center; min-width:0; margin-top:25px; }
.access-logo { width:170px; height:72px; background:var(--landing-paper); display:grid; place-items:center; border:1px solid var(--landing-rule); border-radius:12px; box-shadow:0 0 40px var(--landing-glow); z-index:var(--landing-z-content); }
.access-logo .brand-logo { width:155px; }
.access-orbit { position:absolute; border:1px solid var(--landing-rule); border-radius:50%; left:50%; top:50%; transform:translate(-50%,-50%); }
.orbit-one { width:200px; height:200px; }
.orbit-two { width:280px; height:280px; }
.orbit-label { position:absolute; padding:7px 10px; background:var(--landing-elevated); border:1px solid var(--landing-rule); border-radius:6px; font-size:11px; white-space:nowrap; }
.label-signals { top:28px; left:0; color:var(--landing-buy); }
.label-lines { bottom:22px; right:0; color:var(--landing-accent-light); }
.label-gold { top:35px; right:8px; color:var(--landing-muted); font-family:var(--font-mono); font-size:10px; }
.faq-section { padding-top:110px; display:grid; grid-template-columns:minmax(0,1fr); gap:35px; }
.faq-intro p { max-width:30ch; margin-top:18px; }
.faq-list { border-top:1px solid var(--landing-rule); }
.faq-list details { border-bottom:1px solid var(--landing-rule); }
.faq-list summary { display:flex; justify-content:space-between; align-items:center; gap:18px; padding:21px 0; min-height:66px; list-style:none; cursor:pointer; font-size:15px; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary span { color:var(--landing-subtle); font-size:23px; line-height:1; flex:none; }
.faq-list details[open] summary span { transform:rotate(45deg); }
.faq-list details[open] summary { color:var(--landing-accent-light); }
.faq-list p { font-size:14px; line-height:1.7; padding:0 28px 22px 0; }
.closing { position:relative; min-height:340px; margin-top:110px; padding:40px 24px; overflow:hidden; border:1px solid var(--landing-rule); border-radius:18px; background:radial-gradient(ellipse at 100% 100%,var(--landing-glow),var(--landing-surface) 75%); }
.closing-copy { position:relative; z-index:var(--landing-z-content); max-width:600px; }
.closing h2 { font-size:clamp(1.9rem,4vw,3rem); }
.closing p { margin-top:15px; }
.closing .button { margin-top:27px; }
.closing-chart { position:absolute; width:80%; right:-8%; bottom:-40px; height:270px; opacity:.13; pointer-events:none; }
.site-footer { padding-top:72px; padding-bottom:32px; }
.footer-main { display:flex; flex-direction:column; gap:27px; justify-content:space-between; padding-bottom:38px; }
.footer-main .brand-logo { width:155px; }
.footer-main p { font-size:14px; margin-top:9px; }
.footer-links { display:flex; gap:8px 24px; flex-wrap:wrap; align-items:center; max-width:500px; font-size:13px; }
.footer-links a { display:inline-flex; align-items:center; min-height:44px; white-space:nowrap; }
.footer-bottom { padding:20px 0 18px; border-top:1px solid var(--landing-rule); display:flex; gap:12px 30px; flex-wrap:wrap; font-size:11px; color:var(--landing-subtle); }
.footer-bottom a { white-space:nowrap; color:var(--landing-muted); }
.risk-disclosure { font-size:11px; line-height:1.8; max-width:1100px; color:var(--landing-subtle); }
.access-dialog { width:min(460px,calc(100% - 32px)); padding:36px 28px 26px; background:var(--landing-surface); color:var(--landing-ink); border:1px solid var(--landing-rule); border-radius:16px; }
.access-dialog::backdrop { background:var(--landing-scrim); backdrop-filter:blur(7px); }
.dialog-close { position:absolute; top:8px; right:8px; width:44px; height:44px; background:var(--landing-clear); font-size:25px; color:var(--landing-muted); }
.dialog-mark { display:grid; place-items:center; width:45px; height:45px; border:1px solid var(--landing-accent-hover); border-radius:8px; background:var(--landing-surface); margin-bottom:24px; }
.access-dialog h2 { font-size:28px; }
.access-dialog p { font-size:15px; margin:17px 0 25px; }
.dialog-note { font-size:13px; line-height:1.7; color:var(--landing-muted); padding:20px 0; margin-top:8px; }
/* The chart is drawn from the same historical candles in every layer. */
.demo-svg { display:block; width:100%; height:100%; font-variant-numeric:tabular-nums; overflow:visible; }
.demo-grid { stroke:var(--landing-chart-grid); stroke-width:1; }
.demo-axis { fill:var(--landing-chart-label); font:10px var(--font-mono); }
.demo-candle { fill:var(--landing-up); stroke:var(--landing-up); }
.demo-candle.down { fill:var(--landing-down); stroke:var(--landing-down); }
.is-normal .demo-candle { fill:var(--landing-normal-up); stroke:var(--landing-normal-up); }
.is-normal .demo-candle.down { fill:var(--landing-normal-down); stroke:var(--landing-normal-down); }
.demo-wick { stroke-width:1.1; }
.demo-body { stroke-width:.7; }
.demo-session { stroke:var(--landing-chart-line); stroke-width:1; opacity:.72; }
.demo-session-caption { fill:var(--landing-chart-label); font:9px var(--font-mono); letter-spacing:.06em; }
.demo-bubble { stroke:var(--landing-buy); stroke-opacity:.5; stroke-width:.65; }
.demo-bubble.sell { stroke:var(--landing-sell); }
.demo-bubble-fill stop { stop-color:var(--landing-buy); }
.demo-bubble-fill.sell stop { stop-color:var(--landing-sell); }
.demo-signal-label { fill:var(--landing-buy); font:10px var(--font-mono); }
.demo-signal-label.sell { fill:var(--landing-sell); }
.demo-price-guide { stroke:var(--landing-chart-line); stroke-dasharray:3 5; opacity:.3; }
.demo-watermark { fill:var(--landing-chart-label); opacity:.35; font:12px var(--font-display); letter-spacing:.02em; }
.demo-candle,.demo-signal { opacity:1; }
.demo-candle.is-future,.demo-signal.is-future { opacity:0; }
.demo-signal.is-arriving { animation:signal-arrival .6s var(--ease-out) both; transform-box:fill-box; transform-origin:center; }
@keyframes signal-arrival { from { opacity:0; transform:scale(.65); } to { opacity:1; transform:scale(1); } }
.entrance { animation:entrance var(--dur-long) var(--ease-out) both; }
.hero-chart.entrance { animation-delay:120ms; }
@keyframes entrance { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@media(min-width:40rem) {
  .container { width:min(1200px,calc(100% - 64px)); }
  .announcement { font-size:11px; gap:18px; }
  .announcement a { display:inline-flex; gap:8px; align-items:center; min-height:30px; color:var(--landing-accent-light); font-size:12px; letter-spacing:0; }
  .site-header { padding:8px 15px; }
  .site-header .brand-logo { width:155px; }
  .nav-login { display:block; }
  .button-small { font-size:14px; padding-inline:16px; gap:14px; }
  .hero { padding-top:65px; }
  .hero-copy p { font-size:18px; }
  .mobile-break { display:none; }
  .hero-chart-stage { height:440px; }
  .chart-toolbar { padding-inline:22px; }
  .chart-subtitle { display:inline; }
  .historical-label { font-size:11px; }
  .chart-controls { padding:9px 16px; }
  .example-switch button { font-size:12px; padding-inline:12px; }
  .replay-controls>span { display:inline; margin-right:10px; }
  .hero-chart figcaption { font-size:11px; }
  .hero-actions .button { flex:initial; min-width:240px; }
  .product-strip { grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:65px; gap:24px; }
  .product-strip strong { font-size:40px; }
  .product-strip span { font-size:13px; }
  .feature-section { padding-top:145px; }
  .feature-tabs { gap:30px; }
  .feature-tabs button { font-size:13px; min-height:110px; }
  .feature-symbol { height:57px; width:57px; }
  .preview-copy { padding:32px; }
  .feature-chart-stage { height:350px; }
  .example-cards { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .example-cards > .ambient-frame:last-child { grid-column:1/-1; }
  .example-cards > .ambient-frame:last-child .example-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; }
  .section-actions .button { width:auto; min-width:240px; }
  .comparison { height:460px; }
  .compare-label { font-size:12px; top:22px; padding:6px 12px; }
  .compare-label-before { left:24px; }
  .compare-label-after { right:24px; }
  .comparison-figure figcaption { font-size:12px; }
  .access-section { padding:42px; }
  .access-art { max-width:440px; width:100%; margin-inline:auto; }
  .access-actions .button { flex:initial; min-width:0; }
  .closing { padding:45px; }
  .closing-chart { width:65%; opacity:.25; }
  .footer-main { flex-direction:row; align-items:center; }
  .footer-links { justify-content:flex-end; }
  .site-footer { padding-top:85px; }
}
@media(min-width:60rem) {
  .site-header { top:20px; padding-inline:20px 10px; min-height:60px; }
  .site-header .brand-logo { width:162px; }
  .desktop-nav { display:flex; gap:25px; }
  .nav-actions { gap:24px; }
  .menu-toggle { display:none; }
  .hero { padding-top:62px; }
  .hero-copy { margin-bottom:38px; }
  .hero-chart-stage { height:475px; }
  .product-strip strong { font-size:46px; }
  .feature-section { padding-top:155px; }
  .feature-preview { grid-template-columns:minmax(0, .76fr) minmax(0,1.5fr); min-height:410px; }
  .preview-copy { padding:60px 0 45px 45px; align-self:center; }
  .preview-copy h3 { font-size:35px; }
  .preview-copy p { font-size:15px; }
  .feature-chart-stage { height:410px; margin-left:20px; }
  .examples-section { padding-top:145px; }
  .example-cards { grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; }
  .example-cards > .ambient-frame:last-child { grid-column:auto; }
  .example-cards > .ambient-frame:last-child .example-card { display:block; }
  .card-chart { height:290px; }
  .card-copy { padding:13px 24px 24px; }
  .card-copy h3 { font-size:25px; }
  .workspace-section { padding-top:145px; }
  .workspace-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px; }
  .workspace-card-copy { padding:30px 30px 0; }
  .workspace-card-copy h3 { font-size:25px; }
  .workspace-card-copy p { font-size:15px; }
  .timeframe-chart { height:220px; }
  .focused-chart { height:255px; }
  .comparison-section { padding-top:150px; }
  .comparison { height:510px; }
  .comparison-figure figcaption { flex-direction:row; justify-content:space-between; gap:16px; }
  .comparison-figure figcaption>span:last-child { font-size:10px; }
  .access-section { margin-top:140px; padding:55px; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:35px; }
  .access-art { height:auto; min-height:300px; margin-top:0; }
  .label-signals { top:35px; }
  .label-lines { bottom:25px; }
  .label-gold { right:18px; }
  .faq-section { padding-top:140px; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:70px; }
  .faq-list summary { font-size:16px; }
  .closing { margin-top:140px; padding:55px; min-height:365px; }
  .closing-chart { opacity:.55; height:330px; width:56%; right:-3%; bottom:-15px; mask-image:linear-gradient(to right,var(--landing-clear),var(--landing-paper) 45%); }
  .footer-bottom { justify-content:space-between; }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*:before,*:after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .entrance { transform:none; opacity:1; }
}

/* Original ZetaChart monogram: viewport and contour exclude the wordmark. */
.brand-symbol {
  position:relative;
  display:block;
  flex:none;
  width:28px;
  aspect-ratio:330 / 275;
  overflow:hidden;
  clip-path:polygon(0 0,100% 0,57.576% 69.091%,86.364% 69.091%,77.273% 100%,0 100%);
  mix-blend-mode:lighten;
}
.brand-symbol img {
  position:absolute;
  display:block;
  left:-33.333333%;
  top:-72.727273%;
  width:387.878788%;
  height:auto;
  max-width:none;
}
.dialog-mark .brand-symbol { width:42px; }

/* Broad ambient light behind the entire panel, separate from its border. */
:root {
  --landing-ambient-purple: color-mix(in srgb, var(--landing-accent) 32%, var(--landing-clear));
  --landing-ambient-green: color-mix(in srgb, var(--landing-buy) 20%, var(--landing-clear));
  --landing-ambient-purple-reflection: color-mix(in srgb, var(--landing-sell) 4%, var(--landing-clear));
  --landing-ambient-green-reflection: color-mix(in srgb, var(--landing-buy) 3%, var(--landing-clear));
}
.ambient-frame {
  --ambient-light:var(--landing-ambient-purple);
  --ambient-reflection:var(--landing-ambient-purple-reflection);
  position:relative;
  min-width:0;
  isolation:isolate;
  z-index:var(--landing-z-base);
}
.ambient-frame--green {
  --ambient-light:var(--landing-ambient-green);
  --ambient-reflection:var(--landing-ambient-green-reflection);
}
.ambient-frame::before {
  content:"";
  position:absolute;
  inset:-64px -48px;
  z-index:-1;
  pointer-events:none;
  background:radial-gradient(ellipse at 50% 48%, var(--ambient-light) 8%, var(--landing-clear) 100%);
  filter:blur(36px);
}
.ambient-frame--hero::before {
  inset:-140px -100px;
  background:radial-gradient(ellipse at 50% 40%, var(--ambient-light), var(--landing-clear) 74%);
  filter:blur(48px);
}
.hero:before { display:none; }
.hero-chart { box-shadow:none; border-color:var(--landing-rule); }
.hero-chart,
.feature-preview,
.example-card,
.workspace-card {
  border-color:var(--landing-rule);
  background:
    radial-gradient(ellipse at 50% 0%, var(--ambient-reflection), var(--landing-clear) 75%),
    var(--landing-surface);
}
.example-card,
.workspace-card { height:100%; }
.hero-chart-stage,
.feature-chart-stage,
.card-chart,
.timeframe-chart,
.focused-chart { background:var(--landing-clear); }
.comparison,
.comparison:has(.compare-input:focus-visible) {
  border:1px solid var(--landing-rule);
  box-shadow:none;
  background:var(--landing-chart-paper);
}
.compare-chart { background:var(--landing-chart-paper); }
.compare-input { border-radius:inherit; }
.compare-input:focus-visible { outline:none; }
.comparison:has(.compare-input:focus-visible) .compare-handle {
  outline:2px solid var(--landing-ink);
  outline-offset:4px;
}
.compare-divider { width:1px; box-shadow:none; }
.compare-handle { box-shadow:0 4px 16px var(--landing-chart-shadow); }
@media (min-width:60rem) {
  .ambient-frame::before { inset:-80px -64px; filter:blur(44px); }
  .ambient-frame--hero::before { inset:-160px -140px; filter:blur(56px); }
}

/* Keep neighboring panels and foreground copy above the shared light layer. */
.hero-copy,
.hero-actions,
.product-strip { position:relative; z-index:var(--landing-z-content); }
.example-cards,
.workspace-grid { position:relative; isolation:isolate; }
.example-cards > .ambient-frame,
.workspace-grid > .ambient-frame { isolation:auto; z-index:auto; }
