:root{--landing-ink:#22202a;--landing-muted:#716b72;--landing-line:#d8cec2;--landing-pink:#ef4c9d;--landing-cyan:#58c9e4;--landing-violet:#8068df;--landing-paper:#f4ede4}
body{background:var(--landing-paper);color:var(--landing-ink);overflow-x:hidden}body:before{position:fixed;inset:0;z-index:-2;background:radial-gradient(circle at 18% 8%,rgba(255,255,255,.85),transparent 34%),radial-gradient(circle at 78% 62%,rgba(240,160,194,.17),transparent 30%);content:""}
.landing-header{width:min(1140px,calc(100% - 40px));margin:auto;padding:26px 0;display:flex;align-items:center;justify-content:space-between}.landing-brand{display:flex;align-items:center;gap:10px;color:#25222b;text-decoration:none;font-size:.95rem;letter-spacing:.04em}.landing-brand img{border-radius:50%;object-fit:contain}.landing-header nav{display:flex;align-items:center;gap:30px}.landing-header nav a{color:#5f5960;text-decoration:none;font-size:.77rem}.landing-header nav a:hover{color:#15131a}.landing-header .nav-cta{padding:11px 19px;border-radius:999px;background:#25222b;color:#fff;font-weight:700}
.landing-hero{width:min(1140px,calc(100% - 40px));margin:38px auto 44px;display:grid;grid-template-columns:minmax(300px,.95fr) minmax(480px,1.05fr);gap:62px;align-items:center}.landing-copy{padding:24px 0}.landing-copy .eyebrow{color:#a45a77}.landing-copy h1{margin:14px 0 20px;color:#24212a;font-size:clamp(2.6rem,5.4vw,5.25rem);line-height:.98;letter-spacing:-.065em}.landing-copy h1 span{color:#39313d}.landing-copy .lede{max-width:560px;color:#716b72;font-size:1.03rem;line-height:1.45}.landing-note{color:#877f82;font-size:.72rem}
.landing-forms{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:28px}.landing-form{padding:18px;border:1px solid var(--landing-line);border-radius:15px;background:rgba(255,252,247,.74);box-shadow:0 18px 40px rgba(84,59,41,.12)}.landing-form h2{margin:0;color:#24212a;font-size:.92rem}.landing-form p{margin:5px 0 12px;color:#81787c;font-size:.72rem}.landing-form form{display:grid;gap:8px}.landing-form label{margin:0;color:#71686e;font-size:.68rem}.landing-form input{width:100%;padding:10px 11px;margin-top:4px;border:1px solid #c9beb5;border-radius:8px;background:#fffdfa;color:#24212a;font-size:.78rem}.landing-form button{width:100%;margin-top:4px;background:var(--landing-pink);font-size:.76rem}.landing-form button:hover{background:#d93c8b}.notice{margin:14px 0;padding:9px 12px;border-color:rgba(164,90,119,.35);background:rgba(255,255,255,.6);color:#694658;font-size:.75rem}
.graph-demo{min-height:420px;padding:14px;border:1px solid rgba(62,55,69,.32);border-radius:20px;background:linear-gradient(145deg,#27242d,#1b1a22);box-shadow:0 24px 70px rgba(71,50,49,.24)}.graph-demo-bar{display:flex;justify-content:space-between;align-items:center;padding:11px 14px;border-radius:12px;background:#302d39;color:#ebe4ef;font-size:.72rem}.graph-live{display:flex;align-items:center;gap:6px;color:#78d6e8;font-size:.65rem}.graph-live i{width:6px;height:6px;border-radius:50%;background:var(--landing-cyan);box-shadow:0 0 12px var(--landing-cyan)}.landing-graph{position:relative;height:310px;margin-top:8px;overflow:hidden;background:radial-gradient(circle at center,rgba(76,89,113,.18),transparent 65%)}.landing-graph:after{position:absolute;left:0;right:0;top:57%;height:2px;background:#d5f7ff;box-shadow:0 0 18px 5px rgba(88,201,228,.5);content:"";opacity:.8}.landing-graph svg{position:absolute;inset:0;width:100%;height:100%;z-index:1}.landing-graph line{stroke:#657084;stroke-width:1.3;opacity:.62;transition:stroke .2s,stroke-width .2s,opacity .2s}.landing-graph line.is-related{stroke:var(--landing-pink);stroke-width:3;opacity:1}
.landing-node{position:absolute;left:var(--x);top:var(--y);z-index:2;display:grid;grid-template-columns:5px 23px minmax(0,1fr) 7px;align-items:stretch;width:126px;min-height:54px;padding:0;border:1px solid rgba(199,211,226,.4);border-radius:8px;background:#25232c;color:#e8e5ed;box-shadow:0 10px 22px rgba(0,0,0,.3);font-size:.68rem;text-align:left;cursor:pointer;transform:translate(-50%,-50%);transition:transform .2s,box-shadow .2s,border-color .2s,opacity .2s}.landing-node-rail{grid-column:1;width:5px;border-radius:7px 0 0 7px;background:#f47762}.landing-node-icon{display:grid;place-items:center;align-self:start;width:19px;height:19px;margin:7px 2px 0;color:#f3cf83;font-style:normal;font-size:.78rem;font-weight:900}.landing-node-copy{display:grid;align-content:center;min-width:0;padding:7px 2px}.landing-node-copy strong,.landing-node-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.landing-node-copy strong{font-size:.65rem;font-weight:800}.landing-node-copy small{margin-top:3px;color:#a7a5b0;font-size:.5rem}.landing-node-status{align-self:start;width:6px;height:6px;margin:9px 6px 0 0;border-radius:50%;background:#8cd47e;box-shadow:0 0 7px rgba(140,212,126,.7)}.landing-node:hover,.landing-node:focus-visible,.landing-node.is-active{border-color:var(--landing-cyan);box-shadow:0 0 0 3px rgba(88,201,228,.16),0 10px 24px rgba(0,0,0,.4);transform:translate(-50%,-50%) scale(1.08);outline:0}.landing-node.is-related{border-color:var(--landing-pink);color:#fff}.landing-node.is-dimmed{opacity:.26}.node-project .landing-node-rail{background:#f47762}.node-code .landing-node-rail{background:#d8a75a}.node-code .landing-node-icon{color:#f3cf83}.node-file .landing-node-rail{background:#70d7ee}.node-file .landing-node-icon{color:#70d7ee}.node-file .landing-node-status{background:#70d7ee}.node-ui .landing-node-rail{background:#8d79e8}.node-ui .landing-node-icon{color:#b09cff}.graph-inspector{display:grid;gap:3px;padding:11px 14px;border-radius:10px;background:#25232c;color:#e8e5ed;font-size:.7rem}.graph-inspector span{color:#a7a5b0}.landing-features{width:min(1140px,calc(100% - 40px));margin:0 auto 72px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.landing-features article{display:flex;gap:14px;align-items:flex-start;padding:22px;border:1px solid var(--landing-line);border-radius:16px;background:rgba(255,252,247,.56)}.feature-index{color:#b36a86;font-size:.72rem;letter-spacing:.1em}.landing-features h2{margin:0 0 6px;color:#28252d;font-size:1.05rem}.landing-features p{margin:0;color:#827a7e;font-size:.76rem;line-height:1.4}
@media(max-width:900px){.landing-hero{grid-template-columns:1fr;gap:28px}.landing-copy{padding-top:0}.graph-demo{max-width:700px}.landing-forms{max-width:700px}}@media(max-width:620px){.landing-header,.landing-hero,.landing-features{width:min(100% - 28px,1140px)}.landing-header{padding:18px 0}.landing-header nav{gap:12px}.landing-header nav a:not(.nav-cta){display:none}.landing-copy h1{font-size:clamp(2.55rem,14vw,4rem)}.landing-forms,.landing-features{grid-template-columns:1fr}.graph-demo{min-height:390px;padding:9px}.landing-graph{height:300px}.landing-node{width:118px;min-height:50px}.landing-features{margin-bottom:38px}}
@media(prefers-reduced-motion:reduce){.landing-node,.landing-graph line{transition:none}}
.scroll-progress{position:fixed;left:0;right:0;top:0;z-index:20;height:3px;background:rgba(80,61,64,.12);pointer-events:none}.scroll-progress span{display:block;height:100%;transform:scaleX(0);transform-origin:left center;background:linear-gradient(90deg,#ef4c9d,#7c68df);transition:transform .12s linear}
.scroll-reveal{opacity:1;transform:none}.scroll-reveal.is-visible{opacity:1;transform:none}
.feature-showcase{width:min(960px,calc(100% - 40px));margin:0 auto 56px;display:grid;grid-template-columns:.8fr 1.2fr;gap:32px;align-items:center}.showcase-heading h2{margin:10px 0;color:#29252d;font-size:clamp(1.8rem,3vw,3.1rem);line-height:1.02;letter-spacing:-.045em}.showcase-heading>p:last-child{color:#7b7276;font-size:.9rem;line-height:1.5}.showcase-stage{min-height:255px;padding:28px;border-radius:18px;background:#292630;color:#f5eff6;box-shadow:0 20px 50px rgba(71,50,49,.22)}.showcase-slide{display:none}.showcase-slide.is-active{display:block;animation:showcase-in .55s ease both}.showcase-kicker{color:#f28ab7;font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.showcase-slide h3{margin:22px 0 10px;font-size:clamp(1.35rem,2.4vw,2.1rem);line-height:1.08}.showcase-slide p{margin:0;color:#c6bdc9;font-size:.86rem;line-height:1.55}.showcase-proof{display:inline-flex;margin-top:22px;padding:8px 10px;border:1px solid rgba(255,255,255,.16);border-radius:999px;color:#8dd7e5;font-size:.64rem}.showcase-controls{display:flex;align-items:center;justify-content:center;gap:17px;margin-top:18px}.showcase-arrow{display:grid;width:30px;height:30px;place-items:center;padding:0;border:1px solid #cbbcc0;border-radius:50%;background:transparent;color:#5d4e57;font-size:1rem;cursor:pointer}.showcase-arrow:hover,.showcase-arrow:focus-visible{border-color:#ef4c9d;color:#ef4c9d;outline:3px solid rgba(239,76,157,.14)}.showcase-dots{display:flex;gap:7px}.showcase-dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:#c8bfc1;cursor:pointer}.showcase-dots button.is-active{background:#ef4c9d;box-shadow:0 0 0 4px rgba(239,76,157,.14)}.scroll-cta{width:min(960px,calc(100% - 40px));margin:0 auto 84px;padding:30px 34px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-radius:20px;background:#27232c;color:#f7f0f5;box-shadow:0 20px 55px rgba(71,50,49,.2)}.scroll-cta .eyebrow{color:#f28ab7}.scroll-cta h2{margin:10px 0 8px;font-size:clamp(1.4rem,2.5vw,2.2rem);line-height:1.05}.scroll-cta p{max-width:610px;margin:0;color:#c8bfca;font-size:.83rem;line-height:1.45}.scroll-cta-button{flex:0 0 auto;padding:13px 17px;border-radius:999px;background:#ef4c9d;color:#fff;text-decoration:none;font-size:.76rem;font-weight:800;white-space:nowrap}.scroll-cta-button:hover{background:#d93c8b}.scroll-cta-button span{margin-left:8px;font-size:1rem}
@keyframes showcase-in{from{opacity:0;transform:translateX(15px)}to{opacity:1;transform:none}}
@media(max-width:800px){.feature-showcase{grid-template-columns:1fr;gap:18px}.showcase-stage{min-height:220px}.scroll-cta{align-items:flex-start;flex-direction:column;padding:26px}.scroll-cta-button{align-self:stretch;text-align:center}}@media(prefers-reduced-motion:reduce){.scroll-reveal,.showcase-slide.is-active{animation:none;transition:none}}
/* Signup graph parity: mirror the dashboard's node-rect/header/rail/badge anatomy. */
.landing-node{display:block;width:148px;min-height:92px;padding:0;overflow:visible;border:1px solid rgba(214,206,191,.5);border-radius:8px;background:#25232c;color:#e8e5ed;box-shadow:0 10px 22px rgba(0,0,0,.3);font-size:.58rem;text-align:left}
.landing-node::before{position:absolute;inset:-4px;border:1px solid rgba(239,145,111,.2);border-radius:10px;content:"";pointer-events:none}
.landing-node-rail{position:absolute;inset:0 auto 0 0;width:5px;border-radius:7px 0 0 7px;background:#d08d43}
.landing-node-header{display:flex;align-items:center;height:27px;margin-left:5px;padding:0 7px;background:#3a2c2c;border-radius:0 7px 0 0}
.landing-node-icon{display:grid;place-items:center;width:17px;height:17px;margin-right:5px;border:1px solid rgba(240,180,104,.55);border-radius:4px;color:#f3cf83;font-style:normal;font-size:.62rem;font-weight:900}
.landing-node-title{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.63rem;font-weight:800}
.landing-node-status{width:6px;height:6px;margin-left:auto;border-radius:50%;background:#9bd77e;box-shadow:0 0 7px rgba(155,215,126,.75)}
.landing-node-subtitle{display:block;margin:5px 9px 3px;color:#a7a5b0;font-size:.49rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.landing-node-children{display:grid;gap:2px;margin:0 7px;padding:0 3px}
.landing-node-children span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:2px 3px;border-radius:3px;background:#303039;color:#bcb8c1;font-size:.45rem}
.landing-node-children em{margin-right:3px;color:#e0c68e;font-style:normal;font-size:.4rem;font-weight:800}
.landing-node-badges{display:flex;gap:3px;margin:5px 8px 6px}
.node-badge{padding:2px 4px;border-radius:3px;background:#3d3b43;color:#d9d4dc;font-size:.4rem;font-weight:800;line-height:1;white-space:nowrap}
.node-status-badge{background:#574039;color:#f4d1bf}.node-count-badge{margin-left:auto;background:#523645;color:#f3c1d6}
.landing-node-port{position:absolute;width:7px;height:7px;border:1px solid #2b2c2f;border-radius:50%;background:#d7c7aa;box-shadow:0 0 0 1px rgba(215,199,170,.18)}
.landing-node .port-a{left:26%;bottom:-4px}.landing-node .port-b{left:50%;bottom:-4px}.landing-node .port-c{right:13%;bottom:-4px}
.node-project .landing-node-rail{background:#d87956}.node-subsystem .landing-node-rail{background:#d08d43}.node-subsystem .landing-node-icon{color:#f3cf83}
.landing-node[data-node-status="failed"] .landing-node-status{background:#ef765d;box-shadow:0 0 8px rgba(239,118,93,.8)}.landing-node[data-node-status="failed"] .node-status-badge{background:#67403c;color:#ffc4b4}
.landing-node[data-node-status="changed"] .landing-node-status{background:#e5ad52;box-shadow:0 0 8px rgba(229,173,82,.75)}
.landing-node.is-active{transform:translate(-50%,-50%) scale(1.06)}
@media(max-width:620px){.landing-node{width:122px;min-height:88px}.landing-node-title{font-size:.57rem}.landing-node-subtitle{font-size:.44rem}.landing-node-children span{font-size:.4rem}.landing-node-badges{margin-top:4px}.node-badge{font-size:.36rem;padding:2px 3px}}
/* Dashboard-style scope panels and a taller, non-overlapping graph viewport. */
.graph-demo{min-height:600px}
.landing-graph{height:460px;overflow:hidden}
.graph-panel-layer{position:absolute;inset:0;z-index:0;pointer-events:none}
.graph-panel{position:absolute;display:flex;align-items:flex-start;padding:7px 8px;border:1px solid rgba(204,158,104,.25);border-radius:10px;background:rgba(43,39,48,.38);color:#b8a8a5;font-size:.46rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)}
.graph-panel::after{position:absolute;left:8px;right:8px;top:27px;border-top:1px dashed rgba(209,161,105,.18);content:""}
.landing-graph:after{z-index:0;top:57%}
.landing-graph svg{z-index:1}
.landing-node{z-index:2}
@media(max-width:620px){.graph-demo{min-height:680px}.landing-graph{height:520px}.graph-panel{padding:6px 6px;font-size:.4rem}.graph-panel::after{left:6px;right:6px;top:24px}}
/* Coral/amber accent override: keep the dashboard's warm control language without hot pink. */
:root{--landing-pink:#d97757}
.landing-form button:hover{background:#c7644d}.landing-graph line.is-related{stroke:#d97757}.landing-node.is-related{border-color:#d97757}.scroll-progress span{background:linear-gradient(90deg,#d97757,#c4943f)}.showcase-kicker,.scroll-cta .eyebrow{color:#d97757}.showcase-arrow:hover,.showcase-arrow:focus-visible{border-color:#d97757;color:#d97757}.showcase-arrow:hover,.showcase-arrow:focus-visible{outline-color:rgba(217,119,87,.18)}.showcase-dots button.is-active{background:#d97757;box-shadow:0 0 0 4px rgba(217,119,87,.16)}.scroll-cta-button{background:#d97757}.scroll-cta-button:hover{background:#c7644d}.feature-index{color:#b06f42}

/* Editorial graph direction: a calm shell around the real dashboard graph. */
.landing-header{width:min(1240px,calc(100% - 56px));padding:28px 0}.landing-brand{font-weight:700;letter-spacing:.02em}.landing-header nav{gap:32px}.landing-header nav a{font-size:.78rem}.landing-header .nav-cta{padding:12px 20px;background:#211f27;box-shadow:0 8px 18px rgba(33,31,39,.13)}
.landing-hero{width:min(1240px,calc(100% - 56px));margin:52px auto 68px;grid-template-columns:minmax(320px,.72fr) minmax(620px,1.48fr);gap:54px;align-items:start}.landing-copy{padding:36px 0 0}.landing-copy .eyebrow{color:#d97757;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.landing-copy h1{font-size:clamp(3.4rem,6.4vw,6.6rem);letter-spacing:-.08em;line-height:.9;margin:18px 0 24px}.landing-copy h1 span{color:#d97757}.landing-copy .lede{max-width:430px;font-size:1rem;line-height:1.55}.landing-forms{display:grid;grid-template-columns:1fr;gap:10px;margin-top:30px;max-width:350px}.landing-form{padding:19px;border-radius:13px;background:rgba(255,252,247,.8);box-shadow:0 16px 34px rgba(84,59,41,.1)}.landing-form:has(form[action="/login"]){padding:8px 0 0;border:0;background:transparent;box-shadow:none}.landing-form:has(form[action="/login"]) h2{display:inline;font-size:.75rem}.landing-form:has(form[action="/login"]) p{display:none}.landing-form:has(form[action="/login"]) form{display:inline-grid;grid-template-columns:1fr auto;align-items:end;gap:7px;margin-left:10px}.landing-form:has(form[action="/login"]) label{display:none}.landing-form:has(form[action="/login"]) button{width:auto;margin:0;padding:4px 0;border:0;background:transparent;color:#d97757;font-size:.74rem}.landing-form:has(form[action="/login"]) button:hover{background:transparent;color:#b75d43}.landing-note{margin-top:18px;line-height:1.7}.landing-note span{color:#6aa9ba;font-size:1rem}
.graph-demo{min-height:0;padding:14px;border-radius:18px;background:#111820;border-color:#25313d;box-shadow:0 28px 72px rgba(35,32,41,.26)}.graph-demo-bar{padding:11px 14px;background:#18212c;border:1px solid rgba(130,153,170,.15)}.graph-bar-meta{display:flex;align-items:center;gap:18px}.graph-select{padding:7px 10px;border:1px solid rgba(170,186,195,.24);border-radius:7px;color:#b7c2ca;font-size:.62rem}.graph-workbench{display:grid;grid-template-columns:minmax(0,1fr) 186px;min-height:516px;margin-top:8px;border:1px solid rgba(123,143,158,.16);border-radius:10px;overflow:hidden;background:#0d141c}.graph-stage{min-width:0;display:grid;grid-template-rows:minmax(0,1fr) 40px}.landing-graph{height:auto;min-height:476px;margin:0;background-color:#0b1219;background-image:radial-gradient(circle,rgba(120,144,160,.16) 1px,transparent 1px);background-size:18px 18px}.landing-graph:before{position:absolute;inset:0;background:radial-gradient(circle at 52% 48%,rgba(88,201,228,.15),transparent 45%);content:"";pointer-events:none}.landing-graph:after{top:50%;height:1px;background:#cfeff5;box-shadow:0 0 16px 4px rgba(88,201,228,.42);animation:graph-scan 6s ease-in-out infinite}.graph-panel{background:rgba(22,32,42,.5);border-color:rgba(110,152,177,.3);color:#98a9b5}.graph-panel::after{border-color:rgba(110,152,177,.2)}.graph-phase-rail{display:flex;align-items:center;justify-content:center;gap:12px;border-top:1px solid rgba(124,147,162,.18);color:#778996;font-size:.62rem;letter-spacing:.08em;text-transform:uppercase}.graph-phase-rail span{display:flex;align-items:center;gap:6px}.graph-phase-rail span.is-active{color:#7ed8e7}.graph-phase-rail b{display:grid;place-items:center;width:20px;height:20px;border:1px solid currentColor;border-radius:50%;font-size:.58rem}.graph-phase-rail>i{width:32px;border-top:1px solid rgba(127,151,166,.38)}.graph-inspector{display:grid;align-content:start;gap:8px;padding:20px 14px;border-left:1px solid rgba(124,147,162,.18);border-radius:0;background:#111a23;color:#d4dde2;font-size:.68rem}.inspector-kicker{color:#91a5b1;font-size:.52rem;letter-spacing:.14em}.inspector-rule{height:1px;background:rgba(150,173,188,.2)}.graph-inspector strong{font-size:.72rem}.graph-inspector>span{color:#91a4af;line-height:1.4}.inspector-signal{display:grid;grid-template-columns:1fr auto;gap:2px 8px;margin-top:14px;padding-top:12px;border-top:1px solid rgba(150,173,188,.15)}.inspector-signal small,.inspector-activity small{grid-column:1/-1;color:#7c919e;font-size:.52rem;text-transform:uppercase;letter-spacing:.1em}.inspector-signal i{align-self:end;width:80px;height:20px;border-bottom:1px solid #55c8df;border-radius:50%;box-shadow:0 10px 10px -10px #55c8df}.inspector-signal em{grid-column:1/-1;color:#d7a35f;font-style:normal;font-size:.58rem}.inspector-activity{display:grid;gap:8px;margin-top:14px;padding-top:12px;border-top:1px solid rgba(150,173,188,.15)}.inspector-activity span{display:grid;grid-template-columns:7px 1fr;gap:5px;color:#a8b7be;font-size:.56rem}.inspector-activity span i{width:5px;height:5px;margin-top:3px;border-radius:50%;background:#62d6e6}.inspector-activity span b{display:block;grid-column:2;color:#647b88;font-weight:400;font-size:.49rem}
.observatory-filmstrip{width:min(1240px,calc(100% - 56px));margin:0 auto 74px;padding-top:10px}.filmstrip-head{display:flex;align-items:baseline;justify-content:space-between;gap:18px}.filmstrip-head .eyebrow{margin:0;color:#d97757;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.filmstrip-head>span{color:#8a7e7e;font-size:.68rem}.filmstrip-track{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px}.film-card{position:relative;min-height:215px;padding:14px 15px 16px;overflow:hidden;border:1px solid #d5c8bd;border-radius:14px;background:#fffaf4;box-shadow:0 14px 30px rgba(84,59,41,.08)}.film-card:after{position:absolute;inset:auto -20% -58% 18%;height:120px;border-radius:50%;background:rgba(89,201,228,.12);content:"";filter:blur(18px)}.film-card-top{display:flex;justify-content:space-between;color:#4e5960;font-size:.62rem}.film-card-top i{color:#56b9ca;font-style:normal;font-size:.55rem}.film-nodes{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:24px 8px 22px;z-index:1}.film-nodes:before,.film-nodes:after{position:absolute;left:15%;right:15%;top:50%;border-top:1px solid rgba(86,157,179,.4);content:""}.film-nodes:after{left:50%;right:auto;top:0;bottom:0;border-top:0;border-left:1px solid rgba(86,157,179,.4)}.film-nodes b{position:relative;z-index:2;padding:8px 6px;border:1px solid rgba(67,88,101,.35);border-radius:6px;background:#17232e;color:#dbe9ed;font-size:.52rem;text-align:center}.film-card strong{display:block;color:#2b2a31;font-size:.9rem}.film-card small{display:block;margin-top:5px;color:#827a7e;font-size:.68rem}.film-path{display:flex;align-items:center;gap:6px;margin:32px 10px 35px}.film-path b{padding:8px 7px;border-radius:5px;background:#17232e;color:#dbe9ed;font-size:.5rem}.film-path i{width:24px;border-top:1px solid #d97757}.film-checks{display:grid;gap:7px;margin:26px 4px 28px}.film-checks span{display:grid;grid-template-columns:17px 1fr auto;gap:6px;align-items:center;padding:6px 7px;border-radius:5px;background:#f0e9e0;color:#5d5556;font-size:.55rem}.film-checks i{color:#5aaea3;font-style:normal}.film-checks span:last-child i{color:#d97757}.film-checks b{color:#a36f4d;font-size:.5rem;font-weight:600}.film-card:nth-child(1){animation:film-drift 9s ease-in-out infinite}.film-card:nth-child(2){animation:film-drift 9s 1.8s ease-in-out infinite}.film-card:nth-child(3){animation:film-drift 9s 3.6s ease-in-out infinite}
@keyframes graph-scan{0%,100%{transform:translateY(-120px);opacity:.25}50%{transform:translateY(120px);opacity:.9}}@keyframes film-drift{0%,18%,100%{transform:translateY(0);box-shadow:0 14px 30px rgba(84,59,41,.08)}9%{transform:translateY(-7px);box-shadow:0 22px 36px rgba(84,59,41,.16)}}
@media(max-width:900px){.landing-hero{grid-template-columns:1fr;gap:28px}.landing-copy{padding-top:0}.graph-demo{max-width:none}.graph-workbench{grid-template-columns:minmax(0,1fr) 170px}.observatory-filmstrip{margin-top:12px}.filmstrip-track{gap:10px}}
@media(max-width:620px){.landing-header,.landing-hero,.landing-features,.observatory-filmstrip{width:min(100% - 28px,1240px)}.landing-header{padding:18px 0}.landing-copy h1{font-size:clamp(3.4rem,18vw,5rem)}.landing-forms{max-width:none}.landing-form:has(form[action="/login"]) form{margin-left:7px}.graph-demo{padding:9px}.graph-bar-meta{gap:8px}.graph-select{display:none}.graph-workbench{display:block;min-height:0}.graph-stage{grid-template-rows:520px 40px}.landing-graph{min-height:520px}.graph-inspector{grid-template-columns:1fr 1fr;gap:7px;padding:14px;border-top:1px solid rgba(124,147,162,.18);border-left:0}.graph-inspector .inspector-kicker,.graph-inspector .inspector-rule,.graph-inspector>strong,.graph-inspector>span{grid-column:1/-1}.inspector-activity{grid-column:1/-1}.graph-phase-rail{font-size:.53rem}.graph-phase-rail>i{width:17px}.observatory-filmstrip{margin-bottom:52px}.filmstrip-head{align-items:flex-start;flex-direction:column;gap:5px}.filmstrip-track{grid-template-columns:1fr;gap:10px}.film-card{min-height:190px}.film-card:nth-child(2){animation-delay:1.2s}.film-card:nth-child(3){animation-delay:2.4s}}
@media(prefers-reduced-motion:reduce){.landing-graph:after,.film-card:nth-child(1),.film-card:nth-child(2),.film-card:nth-child(3){animation:none}}
.landing-copy h1{font-size:clamp(3.25rem,4.7vw,4.9rem);overflow-wrap:anywhere}
.landing-copy h1{font-size:clamp(3rem,3.8vw,4.2rem);white-space:nowrap;overflow-wrap:normal}
.film-checks span{display:flex;align-items:center;gap:6px}.film-checks span i{flex:0 0 auto}.film-checks b{margin-left:auto;white-space:nowrap}
@media(min-width:621px){.landing-node.node-ui{width:120px}}
@media(max-width:620px){.landing-node.node-ui{width:110px}}
/* The renderer emits data-landing-node for semantic node ids; keep the UI anchor
   compact enough to remain fully contained by the tests subsystem panel. */
@media(min-width:621px){.landing-node[data-landing-node="ui"]{width:120px}}
@media(max-width:620px){.landing-node[data-landing-node="ui"]{width:110px}}
@media(max-width:620px){.landing-node.node-subsystem{width:118px}}
@media(max-width:620px){.landing-node[data-landing-node="ui"]{width:110px}}
@media(min-width:621px) and (max-width:1100px){
  .landing-node.node-subsystem{width:132px}
  .landing-node[data-landing-node="ui"]{width:112px}
}

/* Editorial rhythm and graph polish. */
:root{--landing-ink:#242229;--landing-muted:#716b72;--landing-paper:#f5f0e8;--landing-line:rgba(36,34,41,.14);--landing-coral:#d97757;--landing-blue:#3c9fce}
html{min-width:100%;min-height:100%;background:#eee7dd}
body{min-width:100%;min-height:100vh;background:var(--landing-paper);color:var(--landing-ink);letter-spacing:-.01em}
.landing-shell,body{background:radial-gradient(circle at 79% 9%,rgba(60,159,206,.11),transparent 24rem),linear-gradient(180deg,#faf7f1 0%,var(--landing-paper) 62%,#eee7dd 100%)}
.landing-header{position:sticky;top:0;z-index:20;background:rgba(250,247,241,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--landing-line)}
.landing-header .landing-brand{letter-spacing:.08em;font-weight:760}
.landing-header nav a{transition:color .2s ease,transform .2s ease}
.landing-header nav a:hover{color:var(--landing-coral);transform:translateY(-1px)}
.landing-hero{padding-top:clamp(4.8rem,10vw,8.4rem);padding-bottom:clamp(3.5rem,8vw,7rem);gap:clamp(2.5rem,6vw,7rem)}
.landing-copy{max-width:39rem}
.landing-kicker{color:var(--landing-coral);font-size:.72rem;letter-spacing:.18em;font-weight:800}
.landing-copy h1{font-size:clamp(3.15rem,6.2vw,6.4rem);line-height:.94;letter-spacing:-.065em;max-width:10ch;text-wrap:balance}
.landing-lede{max-width:34rem;color:#5e5960;font-size:clamp(1rem,1.35vw,1.2rem);line-height:1.55}
.landing-forms{margin-top:2rem;max-width:34rem;padding:1.1rem;border:1px solid var(--landing-line);border-radius:1.25rem;background:rgba(255,253,249,.72);box-shadow:0 1.5rem 4rem rgba(72,56,42,.08)}
.landing-form input{background:#fffdf9;border-color:rgba(36,34,41,.18);transition:border-color .2s ease,box-shadow .2s ease}
.landing-form input:focus{border-color:var(--landing-blue);box-shadow:0 0 0 4px rgba(60,159,206,.14);outline:0}
.landing-form button,.landing-cta{background:var(--landing-ink);box-shadow:0 .65rem 1.4rem rgba(36,34,41,.16);transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.landing-form button:hover,.landing-cta:hover{background:#37333c;transform:translateY(-2px);box-shadow:0 .9rem 1.8rem rgba(36,34,41,.22)}
.graph-demo{position:relative;filter:drop-shadow(0 1.5rem 2.5rem rgba(41,31,57,.16))}
.graph-workbench{border:1px solid rgba(36,34,41,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 1rem 3rem rgba(36,34,41,.12)}
.graph-workbench::before{content:"LIVE PROJECT GRAPH";position:absolute;left:1.1rem;top:.9rem;color:rgba(244,239,232,.58);font-size:.61rem;letter-spacing:.16em;font-weight:800;z-index:3}
.graph-panel{background:linear-gradient(145deg,rgba(42,38,51,.98),rgba(27,28,37,.98));border-color:rgba(211,197,213,.2);box-shadow:0 .7rem 1.8rem rgba(0,0,0,.16)}
.graph-panel .panel-label{letter-spacing:.1em;text-transform:uppercase;color:rgba(244,239,232,.62)}
.landing-node{transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,filter .28s ease}
.landing-node:hover,.landing-node:focus-visible{transform:translate(-50%,-50%) scale(1.045);box-shadow:0 0 0 3px rgba(60,159,206,.26),0 1rem 2rem rgba(0,0,0,.28);filter:saturate(1.12);outline:0}
.landing-node.is-related{filter:saturate(1.2);box-shadow:0 0 0 2px rgba(217,119,87,.5),0 .8rem 1.8rem rgba(0,0,0,.22)}
.graph-phase-rail{margin-top:1.1rem;padding:.8rem 1rem;border:1px solid var(--landing-line);border-radius:999px;background:rgba(255,253,249,.58)}
.graph-inspector{border:1px solid rgba(36,34,41,.15);background:rgba(255,253,249,.84);box-shadow:0 1rem 2.5rem rgba(59,46,33,.1)}
.landing-features{gap:1rem;margin-top:clamp(2.5rem,6vw,5.5rem)}
.landing-features article{border:1px solid var(--landing-line);background:rgba(255,253,249,.62);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
.landing-features article:hover{transform:translateY(-5px);border-color:rgba(60,159,206,.38);box-shadow:0 1rem 2rem rgba(72,56,42,.1)}
.observatory-filmstrip{margin-top:clamp(5rem,10vw,9rem)}
.film-card{border:1px solid var(--landing-line);background:rgba(255,253,249,.68);box-shadow:0 .8rem 2rem rgba(72,56,42,.07);transition:transform .25s ease,box-shadow .25s ease}
.film-card:hover{transform:translateY(-5px);box-shadow:0 1.2rem 2.5rem rgba(72,56,42,.12)}
.feature-showcase{border-top:1px solid var(--landing-line);border-bottom:1px solid var(--landing-line)}
.scroll-cta{padding-top:clamp(5rem,10vw,9rem);padding-bottom:clamp(5rem,10vw,9rem)}
@media(max-width:1050px){.landing-hero{grid-template-columns:1fr;gap:3rem}.landing-copy{max-width:46rem}.landing-copy h1{max-width:12ch}.graph-demo{max-width:60rem;width:100%;margin:auto}.landing-forms{max-width:40rem}}
@media(max-width:620px){.landing-header{position:relative}.landing-header nav{gap:.75rem}.landing-hero{padding-top:3.5rem;padding-bottom:3.5rem}.landing-copy h1{font-size:clamp(2.9rem,13vw,4.4rem)}.landing-forms{padding:.8rem;border-radius:1rem}.graph-workbench::before{left:.7rem;top:.65rem;font-size:.52rem}.graph-phase-rail{border-radius:1rem}.landing-features{grid-template-columns:1fr}.observatory-filmstrip{margin-top:4rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}
@media(max-width:620px){.landing-node[data-landing-node="project"]{--x:21% !important}.landing-node[data-landing-node="ui"]{--x:79.5% !important}}
@media(max-width:620px){.graph-panel.panel-tests{left:68% !important;width:30% !important}}

/* The compact login teaser expands in place before its submit action is used. */
.landing-form:has(form[action="/login"]).is-expanded{padding:18px;border:1px solid var(--landing-line);background:rgba(255,252,247,.84);box-shadow:0 16px 34px rgba(84,59,41,.1)}
.landing-form:has(form[action="/login"]).is-expanded h2{display:block;font-size:.92rem}
.landing-form:has(form[action="/login"]).is-expanded p{display:block;margin:5px 0 12px}
.landing-form:has(form[action="/login"]).is-expanded form{display:grid;grid-template-columns:1fr;gap:8px;margin:0}
.landing-form:has(form[action="/login"]).is-expanded label{display:block}
.landing-form:has(form[action="/login"]).is-expanded button{width:100%;margin-top:4px;padding:10px 11px;border:0;background:var(--landing-ink);color:#fff;font-size:.76rem}
.landing-form:has(form[action="/login"]).is-expanded button:hover{background:#37333c;color:#fff}

/* Composition cleanup: let the real nodes carry the graph without decorative boxes. */
.graph-panel-layer{display:none}
.graph-panel{display:none}
.inspector-signal{grid-template-columns:1fr}
.inspector-signal i{display:none}
.inspector-signal em{grid-column:auto}

/* Reduce dead air between the product story, graph, and proof sections. */
.landing-hero{margin:28px auto 36px;padding-top:clamp(2.2rem,4vw,4rem);padding-bottom:clamp(1.8rem,3.5vw,3.4rem);gap:clamp(2rem,4vw,4.5rem)}
.observatory-filmstrip{margin-top:clamp(2.5rem,5vw,4.5rem)}
.scroll-cta{padding-top:clamp(3.2rem,5vw,5rem);padding-bottom:clamp(3.2rem,5vw,5rem)}
.scroll-cta{margin-bottom:clamp(1.5rem,2.5vw,2.5rem)}
@media(max-width:620px){.landing-hero{margin:18px auto 28px;padding-top:2.5rem;padding-bottom:2.4rem;gap:2rem}.observatory-filmstrip{margin-top:2.8rem}.scroll-cta{padding-top:3.4rem;padding-bottom:3.4rem;margin-bottom:1.5rem}}

/* Final refinement: protect the editorial rhythm, readable graph, and control polish. */
.landing-hero{grid-template-columns:minmax(360px,.82fr) minmax(620px,1.38fr);gap:clamp(2rem,3.5vw,3.5rem);padding-top:clamp(2rem,3vw,3rem)}
.landing-copy{min-width:0;padding-top:1.5rem}
.landing-copy h1{max-width:100%;font-size:clamp(3.2rem,5.2vw,5.3rem);line-height:.92;letter-spacing:-.06em;white-space:normal;overflow-wrap:normal}
.landing-copy h1 span{white-space:nowrap}
.graph-select{display:inline-flex;align-items:center;gap:.4rem}
.graph-select img{width:.8rem;height:.8rem;transform:rotate(-90deg);opacity:.8}
.graph-inspector{border-color:rgba(124,147,162,.2);background:#111a23;color:#e8eef1;box-shadow:none}
.graph-inspector>span{color:#aab8c0}
.graph-inspector strong{color:#f4f7f8}
.inspector-kicker{color:#8fa7b3}
.inspector-signal small,.inspector-activity small{color:#859ba7}
.inspector-activity span{color:#b8c5cb}
.inspector-activity span b{color:#78909c}
.showcase-controls{gap:1rem}
.showcase-arrow{width:38px;height:38px;border-color:rgba(36,34,41,.22);background:rgba(255,253,249,.68);box-shadow:0 .35rem 1rem rgba(72,56,42,.08);transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}
.showcase-arrow img{width:17px;height:17px;opacity:.78}
.showcase-arrow-next img{transform:rotate(180deg)}
.showcase-arrow:hover,.showcase-arrow:focus-visible{transform:translateY(-2px);box-shadow:0 .55rem 1.2rem rgba(72,56,42,.13)}
.showcase-dots button{width:9px;height:9px}
.scroll-cta-button{display:inline-flex;align-items:center;justify-content:center;gap:.55rem}
.scroll-cta-button img{width:16px;height:16px;filter:brightness(0) invert(1);transform:rotate(135deg)}
@media(max-width:1050px){.landing-hero{grid-template-columns:1fr;padding-top:2.5rem}.landing-copy{padding-top:0}.landing-copy h1{max-width:11ch}.graph-demo{max-width:60rem}}
@media(max-width:620px){
  .landing-hero{padding-top:2rem}
  .landing-copy h1{font-size:clamp(3rem,13.2vw,4.1rem);line-height:.94}
  .graph-stage{grid-template-rows:470px 40px}
  .landing-graph{min-height:470px}
  .landing-node.node-subsystem{width:112px}
  .landing-node[data-landing-node="project"]{--x:18% !important}
  .landing-node[data-landing-node="ui"]{--x:84% !important;width:108px}
  .graph-inspector{grid-template-columns:minmax(0,1.3fr) minmax(7rem,.7fr);gap:.45rem .9rem;padding:1rem;border-top:1px solid rgba(124,147,162,.2)}
  .graph-inspector .inspector-kicker,.graph-inspector .inspector-rule,.graph-inspector>strong,.graph-inspector>span{grid-column:1}
  .graph-inspector .inspector-signal{grid-column:2;grid-row:1/5;align-content:start;margin:0;padding:0 0 0 .85rem;border-top:0;border-left:1px solid rgba(150,173,188,.15)}
  .graph-inspector .inspector-activity{grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;margin-top:.35rem;padding-top:.75rem}
  .inspector-activity small{grid-column:1/-1}
  .inspector-activity span{grid-template-columns:6px minmax(0,1fr);line-height:1.35}
  .film-card{min-height:174px}
}

/* Light editorial theme for the separate beta entry points. */
html{background:var(--landing-paper)}
.landing-copy>.eyebrow:first-child,.landing-copy>p.lede:not(.developer-lede),.landing-copy>.landing-note:not(.developer-note),.landing-hero>.developer-note{display:none}
.landing-copy .developer-kicker{display:block;color:#a45a77;font-size:.72rem;letter-spacing:.14em;font-weight:800;text-transform:uppercase}
.landing-copy h1 .headline-accent{color:#d97757;white-space:normal}
.landing-copy .developer-lede{display:block;max-width:34rem;color:#716b72;font-size:clamp(1rem,1.35vw,1.2rem);line-height:1.55}
.landing-cta-row{display:flex;align-items:center;flex-wrap:wrap;gap:1rem;margin-top:2rem}
.landing-cta{display:inline-flex;align-items:center;gap:.55rem;padding:13px 17px;border:1px solid #25222b;border-radius:999px;background:#25222b;color:#fff;text-decoration:none;font-size:.78rem;font-weight:800;box-shadow:0 .65rem 1.4rem rgba(36,34,41,.16);transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.landing-cta img{width:15px;height:15px;transform:rotate(135deg);filter:brightness(0) invert(1)}
.landing-cta:hover{background:#37333c;transform:translateY(-2px);box-shadow:0 .9rem 1.8rem rgba(36,34,41,.22)}
.landing-login-link{color:#a45a77;font-size:.76rem;text-decoration:none}.landing-login-link:hover{color:#7e405d}
.developer-note{display:block;margin-top:1.25rem;color:#877f82;font-size:.72rem;line-height:1.7}.developer-note span{color:#58a5ba}
.auth-page{width:min(620px,calc(100% - 32px));margin:0 auto;padding:2.5rem 0 5rem}.auth-brand{display:inline-flex;margin-bottom:3rem}.auth-card{padding:clamp(1.5rem,4vw,3rem);border:1px solid var(--landing-line);border-radius:15px;background:rgba(255,252,247,.82);box-shadow:0 24px 70px rgba(84,59,41,.14)}.auth-card h1{margin:.6rem 0 1rem;color:#24212a;font-size:clamp(2rem,5vw,3.3rem);letter-spacing:-.05em}.auth-card>.lede{color:#716b72}.auth-card .landing-form{margin-top:1.6rem;padding:0;border:0;background:transparent;box-shadow:none}.auth-card .landing-form h2,.auth-card .landing-form p{display:none}.auth-card .landing-form form{display:grid;gap:.8rem}.auth-card .landing-form label{color:#71686e}.auth-card .landing-form input{border-color:#c9beb5;background:#fffdfa;color:#24212a}.auth-card .landing-form input:focus{border-color:#58a5ba;box-shadow:0 0 0 3px rgba(88,165,186,.16)}.auth-card .landing-form button{background:#25222b;color:#fff}.auth-back{margin:1.4rem 0 0;font-size:.72rem}.auth-back a{color:#a45a77}
@media(max-width:620px){.landing-cta-row{align-items:stretch;flex-direction:column}.landing-cta{text-align:center;justify-content:center}.auth-page{padding-top:1.5rem}.auth-brand{margin-bottom:2rem}}

/* Keep the dedicated sign-in page actionable: the compact landing login rules
   intentionally hide labels, but the full auth page must show its fields. */
.auth-card .landing-form:has(form[action="/login"]) label{display:block}

/* Compact editorial rhythm: keep the page as dense as the earlier landing pass. */
.landing-hero{margin:20px auto 22px;padding-top:clamp(1.5rem,2.4vw,2.5rem);padding-bottom:clamp(1rem,2vw,2rem);gap:clamp(1.8rem,3vw,3.2rem)}
.landing-features{margin-bottom:36px}
.observatory-filmstrip{margin-top:2.25rem;margin-bottom:46px;padding-top:0}
.feature-showcase{margin-bottom:38px}
.scroll-cta{padding-top:2.5rem;padding-bottom:2.5rem;margin-bottom:1rem}
@media(max-width:620px){
  .landing-hero{margin:14px auto 18px;padding-top:1.5rem;padding-bottom:1.25rem;gap:1.5rem}
  .landing-features{margin-bottom:26px}
  .observatory-filmstrip{margin-top:2rem;margin-bottom:34px}
  .feature-showcase{margin-bottom:28px}
  .scroll-cta{padding-top:2.25rem;padding-bottom:2.25rem;margin-bottom:.75rem}
}