:root{background:#101722;color-scheme:dark}
/* Landing-only visual world; account forms and the design workbench keep their own styles. */
.landing-page{--night:#101722;--glass:rgba(31,48,68,.64);--text:#eef6ff;--secondary:#b1c5da;--cyan:#62e2f2;--blue:#488dff;--positive:#76a8ff;--negative:#60e0dc;--separator:#eaf5ff;--edge:clamp(20px,3.2vw,48px);background:var(--night);color:var(--text);font-size:16px;overflow-x:clip;isolation:isolate}
.landing-page ::selection{background:var(--cyan);color:var(--night)}
.landing-page :focus-visible{outline:3px solid var(--cyan);outline-offset:5px}
.landing-page a{color:var(--text)}
.landing-page>header,.landing-page>footer,.landing-frame{width:calc(100% - var(--edge)*2);max-width:1280px;margin-inline:auto}
.landing-page>header{position:relative;z-index:2;padding:24px 0;gap:24px;min-height:88px}
.landing-page .brand{font-size:17px;color:var(--text)}
.landing-page nav{gap:12px 28px}.landing-page nav a,.landing-page nav .text-button{font-size:15px;min-height:44px;color:var(--text)}
.landing-page nav a:last-child{background:rgba(110,174,255,.12);border-radius:10px;padding-inline:18px;text-decoration:none}
.landing-page #content{max-width:none;margin:0;padding:0;min-height:0;position:relative}
.landing-page>footer{padding:28px 0 36px;border:0;color:var(--secondary);font-size:13px;line-height:1.8}
.ambient{position:absolute;inset:-90px 0 0;overflow:hidden;z-index:-1;pointer-events:none}
.ambient>div{position:absolute;width:72vw;height:760px;max-width:1100px;top:-260px;right:-20vw;background:radial-gradient(ellipse,rgba(45,104,202,.33),rgba(42,177,194,.11) 42%,transparent 69%);animation:ambient-drift 22s ease-in-out infinite alternate;will-change:transform;animation-play-state:paused}
.ambient>div+div{top:240px;left:-48vw;right:auto;background:radial-gradient(ellipse,rgba(38,126,143,.26),transparent 66%);animation-delay:-11s;animation-duration:29s}
@keyframes ambient-drift{to{transform:translate(-9%,90px) scale(1.12)}}
.hero{display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:clamp(32px,4vw,72px);align-items:center;padding-top:64px;padding-bottom:92px}
.hero-copy{padding-block:24px}.landing-page h1{font-size:clamp(38px,4.4vw,64px);line-height:1.22;letter-spacing:-.035em;font-weight:720;word-break:keep-all;max-width:none;color:var(--text)}
.hero-description{font-size:18px;line-height:1.9;color:var(--secondary);margin-top:30px;max-width:31em;word-break:keep-all}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.landing-button{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:52px;padding:14px 22px;border-radius:11px;text-decoration:none;font-size:16px;font-weight:650;transition:transform .18s ease,background-color .18s ease}
.primary-action{background:linear-gradient(120deg,#2369d4,#17649f);box-shadow:0 12px 32px rgba(0,66,161,.18)}
.secondary-action{background:rgba(160,192,230,.1)}
.landing-button:hover{transform:translateY(-2px);background-color:rgba(150,190,240,.2)}.landing-button:active{transform:translateY(0)}
.hero-note{font-size:13px;color:var(--secondary);margin-top:18px}.explore-link{display:inline-flex;align-items:center;gap:22px;min-height:44px;margin-top:40px;text-underline-offset:6px;font-size:14px}
.glass{background:var(--glass);border:1px solid rgba(170,215,255,.16);border-radius:22px;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 24px 70px rgba(0,0,0,.18)}
.cell-explorer{padding:25px 28px 20px;min-width:0;--layer-gap:27px;--cell-rotation:-28deg}
.explorer-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.landing-page h2{font-size:clamp(25px,2.4vw,34px);line-height:1.4;letter-spacing:-.025em;word-break:keep-all}
.landing-page .explorer-heading h2{font-size:20px;line-height:1.4}
.quiet-button{border:0;background:transparent;color:var(--secondary);padding:8px 0;min-height:44px;font-size:13px;text-decoration:underline;text-underline-offset:5px}
.quiet-button:hover{color:var(--text)}
.cell-stage{height:310px;display:grid;place-items:center;perspective:1000px;cursor:grab;touch-action:pan-y;overflow:visible}
.cell-stage:active{cursor:grabbing}
.cell-model{width:280px;height:182px;position:relative;transform-style:preserve-3d;transform:translateY(42px) rotateX(55deg) rotateZ(var(--cell-rotation)) scale3d(var(--cell-scale,1),var(--cell-scale,1),var(--cell-scale,1));transition:transform .18s ease-out;will-change:transform}
.sheet{position:absolute;inset:0;border-radius:17px;transform-style:preserve-3d;transform:translateZ(calc(var(--level)*var(--layer-gap)));transition:transform .3s ease,opacity .2s ease;box-shadow:0 9px 15px rgba(4,16,29,.18)}
.sheet::after{content:"";position:absolute;inset:0;border-radius:inherit;border:1px solid rgba(225,244,255,.38);background:linear-gradient(125deg,rgba(255,255,255,.2),transparent 58%);pointer-events:none}
.sheet.collector::before{content:"";position:absolute;width:48px;height:34px;right:38px;top:-28px;background:inherit;border-radius:5px 5px 0 0}
.sheet.negative.collector{--level:1;background:#307b88}.sheet.negative.collector::before{right:auto;left:38px}
.sheet.negative.coating{--level:2;background:var(--negative);inset:7px}
.sheet.separator{--level:3;background:var(--separator);inset:3px;opacity:.88}
.sheet.positive.coating{--level:4;background:var(--positive);inset:7px}
.sheet.positive.collector{--level:5;background:#4b78b1}
.sheet.shell-base{--level:0;background:rgba(67,110,150,.35);inset:-10px;border-radius:21px}
.sheet.shell-lid{--level:6;background:rgba(153,206,242,.13);inset:-10px;border-radius:21px;box-shadow:none}
[data-focus="positive"] .sheet:not(.positive),[data-focus="negative"] .sheet:not(.negative),[data-focus="separator"] .sheet:not(.separator){opacity:.09}
.model-caption{font-size:13px;color:var(--secondary);text-align:center;margin:4px 0 18px}
.layer-selector{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.layer-selector button{display:inline-flex;align-items:center;gap:7px;background:transparent;color:var(--secondary);border:0;border-radius:8px;padding:9px 12px;min-height:44px;font-size:14px;transition:background-color .15s ease,color .15s ease}
.layer-selector button[aria-pressed=true]{background:rgba(140,190,245,.17);color:var(--text)}
.layer-selector button:hover{background:rgba(140,190,245,.1);color:var(--text)}
.swatch{width:9px;height:9px;border-radius:50%;display:inline-block}.swatch.positive{background:var(--positive)}.swatch.separator{background:var(--separator)}.swatch.negative{background:var(--negative)}
.explorer-sliders{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:18px}
.explorer-sliders label{font-size:13px;color:var(--secondary);margin:0;display:grid;grid-template-columns:1fr auto;gap:2px 8px;align-items:center}
.explorer-sliders output{color:var(--text);font-variant-numeric:tabular-nums}
.explorer-sliders input{grid-column:1/-1;width:100%;height:36px;min-height:36px;accent-color:var(--cyan);padding:0;border:0;background:transparent;cursor:pointer}
.interaction-note{font-size:13px;color:var(--secondary);text-align:center;margin-top:12px;line-height:1.6}
.capability-section{padding-block:36px 72px}.section-intro{display:flex;justify-content:space-between;align-items:end;gap:32px;margin-bottom:34px}.section-intro>p{max-width:30em;color:var(--secondary);font-size:16px;line-height:1.8}
.capability-list{margin:0}.capability-list>div{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:36px;padding:32px 0;border-top:1px solid rgba(170,215,255,.14)}
.capability-list dt{font-size:19px;font-weight:600;align-self:start}.capability-list dd{margin:0}.capability-list strong{font-size:21px;line-height:1.5;font-weight:600}.capability-list p{font-size:16px;color:var(--secondary);line-height:1.9;margin-top:10px;max-width:43em;word-break:keep-all}
.getting-started{display:grid;grid-template-columns:1fr 1fr;gap:72px;padding-top:40px;padding-bottom:36px;align-items:center}.getting-started>div>p{font-size:16px;color:var(--secondary);line-height:1.9;margin-top:24px;word-break:keep-all}.getting-started>div>a{display:inline-flex;align-items:center;min-height:44px;margin-top:20px;font-size:14px}
.onboarding{list-style:decimal;margin:0;padding:24px 28px 24px 54px}.onboarding li{padding-left:8px;margin:14px 0 24px}.onboarding li:last-child{margin-bottom:10px}.onboarding li::marker{color:var(--cyan)}.onboarding strong{font-size:16px;font-weight:600}.onboarding p{font-size:15px;line-height:1.8;color:var(--secondary);margin-top:5px}
.motion-setting{display:flex;justify-content:flex-end;padding-block:8px 20px}.landing-page[data-motion=running] .ambient>div{animation-play-state:running}.landing-page[data-motion=paused] .ambient>div{animation-play-state:paused}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass{background:#1b2c40}}
@media(min-width:1800px){.hero{padding-top:90px;padding-bottom:110px}}
@media(max-width:1100px){.hero{gap:28px}.landing-page h1{font-size:clamp(38px,4.6vw,51px)}.hero-description{font-size:16px}.cell-explorer{padding-inline:20px}.cell-model{width:240px;height:164px}.cell-stage{height:290px}.explorer-heading{align-items:start}.landing-page .explorer-heading h2{font-size:18px}.quiet-button{font-size:13px}.getting-started{gap:40px}}
@media(max-width:800px){.hero{grid-template-columns:minmax(0,1fr);padding-top:36px;padding-bottom:58px;gap:36px}.hero-copy{padding:0}.landing-page h1{font-size:clamp(36px,7vw,56px)}.hero-description{max-width:34em;margin-top:24px}.explore-link{margin-top:20px}.cell-explorer{width:100%;max-width:620px;justify-self:center}.cell-stage{height:310px}.cell-model{width:280px;height:182px}.section-intro{display:block}.section-intro>p{margin-top:18px}.capability-list>div{grid-template-columns:minmax(0,.6fr) minmax(0,1.4fr);gap:24px}.getting-started{grid-template-columns:minmax(0,1fr);gap:28px;padding-top:16px}.onboarding{max-width:none}.capability-section{padding-bottom:42px}}
@media(max-width:480px){.landing-page{--edge:20px}.landing-page>header{padding:16px 0;gap:4px 16px;min-height:0;align-items:center}.landing-page .brand{font-size:15px}.landing-page nav{gap:8px 18px}.landing-page nav a,.landing-page nav .text-button{font-size:14px}.landing-page nav a:last-child{padding-inline:12px}.hero{padding-top:32px}.landing-page h1{font-size:36px}.hero-actions{gap:10px;margin-top:28px}.landing-button{padding:12px 17px;min-height:48px;font-size:15px;gap:14px}.hero-description br{display:none}.hero-note{font-size:13px}.cell-explorer{padding:18px 16px 16px;border-radius:18px}.landing-page .explorer-heading h2{font-size:17px}.cell-stage{height:280px}.cell-model{width:230px;height:158px}.explorer-sliders{gap:18px}.model-caption{font-size:12px}.layer-selector{gap:2px}.layer-selector button{font-size:13px;padding-inline:10px}.capability-list>div{display:block;padding-block:26px}.capability-list dt{font-size:16px;color:var(--secondary);margin-bottom:12px}.capability-list strong{font-size:20px}.landing-page h2{font-size:26px}.onboarding{padding:20px 22px 20px 44px}.onboarding p{font-size:15px}.landing-page>footer{font-size:12px;padding-top:12px}}
@media(max-width:350px){.landing-page h1{font-size:31px}.landing-page .brand{font-size:14px}.cell-model{width:200px;height:142px}.explorer-heading{gap:8px}.landing-page .explorer-heading h2{font-size:15px}.layer-selector button{padding-inline:7px}.cell-explorer{padding-inline:12px}.hero-description{font-size:16px}.landing-button{padding-inline:13px}.onboarding{padding-left:36px}}
@media(prefers-reduced-motion:reduce){.landing-page *,.landing-page *::before,.landing-page *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.cell-model{will-change:auto}.ambient>div{will-change:auto}}
