/* Agent landing and on-token commentary. Always dark, with very quiet ambient motion. */
:root { color-scheme:dark; --agent-color:#c7f5af; }
html { scroll-behavior:smooth; scroll-padding-top:105px; }
body { isolation:isolate; }
.ambient-sky { position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:-1; }
.ambient-sky span { position:absolute; width:85vw; height:85vw; border-radius:50%; top:-20vw; right:-25vw; border:1px solid rgba(199,245,175,.045); background:radial-gradient(ellipse,rgba(136,194,153,.025),transparent 62%); animation:ambient-orbit 72s ease-in-out infinite alternate; }
.ambient-sky span:nth-child(2) { width:110vw; height:110vw; top:0; right:-50vw; animation-duration:97s; animation-delay:-30s; }
.ambient-sky span:nth-child(3) { width:75vw; height:75vw; top:40vh; right:50vw; border-color:rgba(173,165,224,.045); animation-duration:85s; animation-delay:-50s; }
@keyframes ambient-orbit { to { transform:translate(-5vw,7vh) rotate(12deg) scale(1.06); } }
.logo-mark { width:48px; height:48px; object-fit:contain; }
.brand { gap:4px; }
.landing-header { display:flex; align-items:center; justify-content:space-between; gap:24px; max-width:1440px; margin:auto; padding:18px 54px; border-bottom:1px solid var(--line); }
.landing-header nav { display:flex; gap:36px; margin-left:auto; margin-right:28px; }
.landing-header nav a { color:var(--text-2); font-size:12px; transition:color .2s; }
.landing-header nav a:hover { color:var(--signal); }
.landing-header>.btn { min-height:40px; font-size:12px; }
.landing-page { padding-top:24px; }
.landing-hero { min-height:510px; gap:30px; }
.landing-hero .market-copy h1 { font-size:clamp(45px,5.3vw,74px); letter-spacing:-.065em; }
.landing-hero .market-copy>p:not(.eyebrow) { max-width:435px; }
.landing-hero .agent-stage { min-height:465px; }
.landing-hero .agent-hero-art { animation-duration:22s; }
.market-copy .coming-note { display:flex; align-items:center; gap:8px; font-size:10px!important; color:var(--text-3)!important; margin-top:20px; }
.coming-note span { width:5px; height:5px; border-radius:50%; background:var(--signal); }
.landing-facts { display:flex; justify-content:space-between; flex-wrap:wrap; gap:18px; padding:23px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); font-size:11px; color:var(--text-3); }
.landing-facts b { font-weight:500; color:var(--text-2); margin-left:5px; }
.personality-section { padding-top:85px; }
.landing-section-head { display:flex; align-items:end; justify-content:space-between; gap:40px; margin-bottom:35px; }
.landing-section-head h2,.demo-copy h2,.how-section>h2,.landing-end h2 { font-size:clamp(32px,3.5vw,49px); font-weight:500; line-height:1.1; letter-spacing:-.055em; margin:18px 0 0; }
.landing-section-head>p { max-width:350px; font-size:13px; color:var(--text-2); line-height:1.8; }
.personality-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
[data-agent="moonstone"] { --agent-color:#c7f5af; --agent-tint:rgba(199,245,175,.07); }
[data-agent="opalite"] { --agent-color:#c9baff; --agent-tint:rgba(201,186,255,.07); }
[data-agent="labradorite"] { --agent-color:#8fd8ee; --agent-tint:rgba(143,216,238,.07); }
[data-agent="opalite"]>img,[data-agent="opalite"] .demo-agent img,[data-agent="opalite"] .agent-feed-head img { filter:hue-rotate(130deg) saturate(.7); }
[data-agent="labradorite"]>img,[data-agent="labradorite"] .demo-agent img,[data-agent="labradorite"] .agent-feed-head img { filter:hue-rotate(65deg) saturate(.75); }
.personality-card { display:flex; flex-direction:column; position:relative; padding:25px; border:1px solid var(--line); border-radius:20px; background:linear-gradient(160deg,var(--agent-tint),transparent 50%),rgba(24,30,33,.78); }
.personality-top { display:flex; align-items:center; justify-content:space-between; font:9px var(--mono); letter-spacing:.08em; color:var(--text-3); }
.personality-dot { width:6px; height:6px; border-radius:50%; background:var(--agent-color); display:inline-block; }
.personality-card>img { width:170px; height:170px; align-self:center; object-fit:contain; margin:17px 0 12px; }
.personality-card .agent-tone { color:var(--agent-color); font:9px var(--mono); letter-spacing:.02em; margin:0 0 8px; }
.personality-card h3 { font-size:27px; font-weight:500; margin:0 0 12px; }
.personality-card>p { font-size:12px; color:var(--text-2); line-height:1.75; }
.personality-card blockquote { padding:16px 0; margin:10px 0 18px; font-size:12px; line-height:1.7; color:var(--text-3); border-bottom:1px solid var(--line); }
.agent-select { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:auto; border:1px solid var(--line-2); background:transparent; color:var(--text-2); border-radius:9px; padding:13px; cursor:pointer; font:500 11px var(--font); }
.agent-select[aria-pressed="true"],.agent-select:hover { color:var(--agent-color); background:var(--agent-tint); border-color:var(--agent-color); }
.agent-demo { display:grid; grid-template-columns:1fr 1.05fr; gap:85px; align-items:center; margin-top:90px; padding:55px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.demo-copy>p:not(.eyebrow) { font-size:13px; color:var(--text-2); line-height:1.8; max-width:365px; margin:20px 0; }
.demo-copy label { display:block; font-size:11px; margin-bottom:9px; color:var(--text-2); }
.demo-copy select { display:block; width:100%; max-width:340px; background:var(--surface); border:1px solid var(--line-2); color:var(--text); border-radius:10px; padding:12px; font:12px var(--font); margin-bottom:12px; }
.demo-copy>.fine { font-size:10px!important; color:var(--text-3)!important; }
.demo-terminal { min-width:0; padding:25px; border:1px solid var(--line-2); border-radius:22px; background:linear-gradient(150deg,var(--agent-tint),transparent 65%),var(--surface); }
.demo-terminal-top { display:flex; align-items:center; justify-content:space-between; gap:10px; padding-bottom:20px; border-bottom:1px solid var(--line); color:var(--text-3); font:9px var(--mono); }
.demo-badge { color:var(--agent-color); letter-spacing:.04em; }
.demo-agent { display:flex; align-items:center; gap:10px; margin:22px 0; }
.demo-agent h3 { font-size:20px; font-weight:600; margin-bottom:4px; }
.demo-agent p { color:var(--text-3); font-size:10px; }
.demo-agent>.personality-dot { margin-left:auto; }
.demo-price { display:grid; gap:9px; padding-bottom:25px; }
.demo-price>span { color:var(--text-3); font-size:10px; }
.demo-price>b { font:500 clamp(21px,2.5vw,30px) var(--mono); letter-spacing:-.05em; overflow-wrap:anywhere; }
.demo-price>small { color:var(--text-2); font:10px var(--mono); }
.demo-message { border:1px solid var(--line); border-left:2px solid var(--agent-color); border-radius:0 12px 12px 0; background:var(--agent-tint); padding:20px; min-height:115px; }
.demo-message p { font-size:14px; line-height:1.8; color:var(--text); }
.demo-foot { font-size:9px; color:var(--text-3); line-height:1.7; margin-top:22px; }
.how-section { padding-top:80px; }.how-section .market-guide { border:0; padding-top:5px; margin-top:35px; }
.landing-end { display:flex; flex-direction:column; align-items:center; text-align:center; border:1px solid var(--line); border-radius:24px; background:var(--surface); padding:40px 24px; margin:50px 0 75px; }
.landing-end img { object-fit:contain; margin-bottom:15px; }.landing-end .btn { margin-top:25px; }.landing-end>p:last-child { font-size:10px; color:var(--text-3); margin-top:15px; }
.landing-footer { max-width:1440px; margin:auto; padding:32px 54px; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr auto; gap:28px; }
.landing-footer>div:first-child>p { font-size:11px; color:var(--text-3); margin-top:12px; }.landing-footer>div:nth-child(2) { display:flex; align-items:center; gap:26px; font-size:11px; color:var(--text-2); }.landing-footer small { grid-column:1/-1; font-size:9px; color:var(--text-3); }.motion-toggle { border:0; padding:6px 0; color:var(--text-3); background:none; cursor:pointer; font:11px var(--font); }
.coming-page { min-height:70vh; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:45px 24px; }.coming-page h1 { font:500 clamp(40px,6vw,70px)/1.1 var(--display); letter-spacing:-.06em; margin:20px 0; }.coming-page h1 span { color:var(--signal); }.coming-page>p:not(.eyebrow) { font-size:14px; color:var(--text-2); line-height:1.8; max-width:450px; margin-bottom:24px; }
.agent-feed { padding:24px; }.agent-feed-head { display:flex; flex-wrap:wrap; align-items:center; gap:14px; }.agent-feed-head h2 { font-size:25px; margin:5px 0; }.agent-feed-head p { font-size:11px; color:var(--text-3); }.agent-feed-note,.agent-feed-status { color:var(--text-3); font-size:11px; line-height:1.8; margin:15px 0; }.agent-feed-status { color:var(--agent-color); }.agent-message-list { list-style:none; margin:0; padding:0; max-height:420px; overflow:auto; }.agent-message-list li { border-top:1px solid var(--line); padding:15px 0; }.agent-message-list time { font:9px var(--mono); color:var(--text-3); }.agent-message-list p { font-size:13px; line-height:1.8; margin-top:6px; }
[data-motion="off"] .ambient-sky span,[data-motion="off"] .agent-hero-art { animation-play-state:paused; }
@media(max-width:1000px) { .landing-header { padding:16px 28px; }.landing-header nav { gap:20px; margin-right:0; }.landing-hero .market-copy h1 { font-size:54px; }.landing-hero .agent-stage { min-height:360px; }.personality-card { padding:20px; }.agent-demo { gap:35px; }.landing-footer { padding:30px; } }
@media(max-width:700px) { html { scroll-padding-top:25px; }.landing-header { padding:10px 20px; flex-wrap:wrap; gap:10px; }.landing-header .brand { font-size:21px; }.landing-header>.btn { font-size:10px; padding:0 12px; min-height:36px; }.landing-header nav { order:3; width:100%; margin:0; justify-content:center; border-top:1px solid var(--line); padding-top:10px; }.landing-header nav a { font-size:11px; }.landing-hero { padding-top:18px; }.landing-hero .market-copy h1 { font-size:46px; }.landing-hero .agent-stage { min-height:325px; }.landing-hero .agent-pair-chip { bottom:0; }.market-copy .coming-note { font-size:9px!important; }.landing-facts { display:grid; grid-template-columns:1fr; gap:10px; padding:20px 0; }.personality-section { padding-top:50px; }.landing-section-head { flex-direction:column; align-items:start; gap:16px; }.landing-section-head h2,.demo-copy h2,.how-section>h2,.landing-end h2 { font-size:36px; }.personality-grid { grid-template-columns:1fr; }.personality-card { padding:24px; }.personality-card>img { width:175px; height:175px; margin:5px 0; }.personality-card h3 { font-size:29px; }.agent-demo { grid-template-columns:1fr; gap:25px; margin-top:50px; padding:40px 0; }.demo-terminal { padding:20px; }.how-section { padding-top:45px; }.landing-end { margin:20px 0 45px; }.landing-footer { padding:25px 20px; grid-template-columns:1fr; }.landing-footer>div:nth-child(2) { flex-wrap:wrap; gap:20px; }.landing-footer small { grid-column:auto; }.agent-feed { padding:18px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.ambient-sky span,.agent-hero-art { animation:none!important; } }