:root{
  --ink:#11110f;--paper:#eee9df;--paper2:#f7f3eb;--lime:#c8ff3d;--acid:#d7ff6b;--night:#0b0c0c;--night2:#121414;--muted:#77766f;--line:rgba(17,17,15,.16);--white:#f7f4ed;
  --radius:20px;--pad:clamp(24px,5vw,78px);--display:Arial,Helvetica,sans-serif;--body:Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper2);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.5;overflow-x:hidden}a{color:inherit;text-decoration:none}button,select,input{font:inherit}button{color:inherit}.section-pad{padding-left:var(--pad);padding-right:var(--pad)}
::selection{background:var(--lime);color:#0b0c0c}.cursor-dot{position:fixed;width:8px;height:8px;border-radius:50%;background:var(--ink);pointer-events:none;z-index:1000;transform:translate(-50%,-50%);transition:width .18s,height .18s,background .18s;mix-blend-mode:difference}@media(pointer:coarse){.cursor-dot{display:none}}
.site-header{position:fixed;top:0;left:0;width:100%;z-index:100;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:20px var(--pad);border-bottom:1px solid transparent;transition:.3s;background:rgba(247,243,235,.72);backdrop-filter:blur(18px)}.site-header.scrolled{border-color:var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:800;letter-spacing:.08em}.brand-mark{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--ink);color:var(--paper2)}.brand-copy em{font-style:normal;color:var(--muted);font-weight:500}.nav{display:flex;gap:34px;font-size:13px}.nav a,.header-cta{position:relative}.nav a:after,.text-link:after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .3s}.nav a:hover:after,.text-link:hover:after{transform:scaleX(1);transform-origin:left}.header-cta{justify-self:end;border:1px solid var(--ink);border-radius:999px;padding:9px 14px;font-size:12px;font-weight:700}.header-cta span{margin-left:10px}
.hero{min-height:100vh;padding-top:155px;padding-bottom:70px;background:var(--paper2)}.hero-eyebrow{font-size:11px;letter-spacing:.16em;border-top:1px solid var(--line);padding-top:16px;margin-bottom:48px}.hero-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(420px,.9fr);gap:clamp(45px,6vw,100px);align-items:end}.hero-title{font-family:var(--display);font-size:clamp(60px,8vw,148px);font-weight:700;line-height:.83;letter-spacing:-.07em;margin:0 0 42px;max-width:980px}.outline-word{color:transparent;-webkit-text-stroke:1.5px var(--ink)}.hero-intro{max-width:680px;font-size:clamp(18px,1.6vw,25px);line-height:1.35;letter-spacing:-.02em;margin:0;color:#32322e}.hero-actions{display:flex;align-items:center;gap:28px;margin-top:36px}.btn-primary,.btn-light{display:inline-flex;gap:26px;align-items:center;padding:15px 18px;border-radius:999px;background:var(--ink);color:var(--white);font-size:13px;font-weight:700}.btn-primary span,.btn-light span{font-size:18px}.text-link{font-size:13px;position:relative}
.hero-system{height:560px;border:1px solid var(--line);border-radius:30px;background:#e8e2d6;position:relative;overflow:hidden;background-image:linear-gradient(rgba(17,17,15,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(17,17,15,.05) 1px,transparent 1px);background-size:28px 28px}.hero-system:after{content:"";position:absolute;inset:auto -80px -120px auto;width:280px;height:280px;background:var(--lime);filter:blur(80px);opacity:.35;border-radius:50%}.system-caption{position:absolute;top:18px;left:20px;font-size:10px;letter-spacing:.15em;display:flex;gap:8px;align-items:center}.status-dot{width:7px;height:7px;background:#4fdd63;border-radius:50%;box-shadow:0 0 0 4px rgba(79,221,99,.12)}.hero-wires{position:absolute;inset:45px 0 40px;width:100%;height:calc(100% - 85px);z-index:0}.hero-wires path{fill:none;stroke:#87847b;stroke-width:1.4;stroke-dasharray:5 6;animation:dash 12s linear infinite}@keyframes dash{to{stroke-dashoffset:-130}}
.preview-node{position:absolute;z-index:2;width:150px;min-height:86px;padding:13px 14px;border:1px solid #1e1f1d;background:rgba(248,245,237,.92);box-shadow:0 10px 30px rgba(0,0,0,.06);border-radius:14px;display:flex;flex-direction:column}.preview-node span{font-size:9px;color:var(--muted);margin-bottom:11px}.preview-node b{font-size:16px}.preview-node small{font-size:9px;letter-spacing:.12em;margin-top:4px;color:#68675f}.preview-node:after{content:"";position:absolute;right:-5px;top:50%;width:9px;height:9px;background:var(--lime);border:1px solid #1e1f1d;border-radius:50%}.n-customer{left:8%;top:14%}.n-problem{left:37%;top:35%;background:#111;color:#fff}.n-problem small,.n-problem span{color:#aaa}.n-product{right:6%;top:14%}.n-ai{right:6%;bottom:17%;background:var(--lime)}.n-outcome{left:8%;bottom:14%}.hero-system-footer{position:absolute;bottom:15px;left:20px;right:20px;display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:12px;font-size:9px;letter-spacing:.08em;color:#5d5b56}
.section-rule{border-top:1px solid var(--line)}.manifesto{padding-top:36px;padding-bottom:130px;background:var(--paper2)}.section-index{font-size:10px;letter-spacing:.14em;color:#5e5d57;margin-bottom:80px}.section-index.inverse{color:#858b86}.manifesto-copy{display:grid;grid-template-columns:1fr 2.3fr;gap:40px;align-items:start}.manifesto-copy p{margin:12px 0;font-size:14px;color:var(--muted)}.manifesto-copy h2{font-size:clamp(42px,6vw,94px);line-height:.95;letter-spacing:-.06em;margin:0;font-weight:600;max-width:1200px}.principles{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:95px 0 0 33.5%}.principles article{border-top:1px solid var(--ink);padding-top:16px}.principles article>span{font-size:10px}.principles h3{font-size:20px;margin:40px 0 12px}.principles p{color:#65645f;margin:0;font-size:14px;max-width:320px}
.lab-shell{background:var(--night);color:var(--white);padding-bottom:110px}.lab-intro{padding-top:42px}.lab-intro-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:70px;align-items:end}.lab-intro h2{font-size:clamp(54px,7vw,118px);line-height:.88;letter-spacing:-.07em;margin:0;font-weight:600}.lab-intro h2 span{color:#626763}.lab-intro-copy{max-width:560px;justify-self:end}.lab-intro-copy p{font-size:19px;color:#c7cbc7}.lab-intro-copy .micro-note{font-size:11px;color:#737873;border-top:1px solid #303330;padding-top:14px;margin-top:35px}.lab-app-wrap{padding:55px max(18px,calc(var(--pad) * .55)) 0}.lab-app{border:1px solid #2a2e2b;border-radius:26px;min-height:720px;display:grid;grid-template-columns:190px minmax(0,1fr) 230px;background:#101212;overflow:hidden}.node-library,.inspector{background:#0d0f0e;padding:18px 14px}.node-library{border-right:1px solid #282c29}.inspector{border-left:1px solid #282c29}.panel-title{display:flex;justify-content:space-between;align-items:center;padding:3px 4px 17px;border-bottom:1px solid #292c2a}.panel-title span{font-size:10px;letter-spacing:.16em}.panel-title small{font-size:9px;color:#626863}.node-group{margin-top:22px}.node-group label{font-size:8px;letter-spacing:.15em;color:#5c625d;display:block;margin:0 4px 8px}.palette-node{width:100%;background:transparent;border:0;color:#dfe3df;padding:8px 5px;display:flex;align-items:center;gap:9px;text-align:left;border-radius:9px;cursor:grab}.palette-node:hover{background:#191c1a}.palette-node i,.selected-node-head i{font-style:normal;font-size:8px;display:grid;place-items:center;width:26px;height:26px;border:1px solid #4a504b;border-radius:7px;color:var(--lime)}.palette-node span{font-size:12px}.canvas-column{min-width:0;display:grid;grid-template-rows:auto 1fr auto}.canvas-toolbar{height:58px;border-bottom:1px solid #282c29;display:flex;align-items:center;justify-content:space-between;padding:0 14px;gap:14px}.lens-tabs{display:flex;gap:2px;background:#171a18;padding:3px;border-radius:10px}.lens,.toolbar-actions button{border:0;background:transparent;color:#717671;font-size:10px;padding:7px 10px;border-radius:7px;cursor:pointer}.lens.active{background:#292e2a;color:#fff}.toolbar-actions{display:flex;gap:3px;align-items:center}.toolbar-actions button:hover{color:white}.toolbar-actions .run-btn{background:var(--lime);color:#101210;padding:9px 12px;margin-left:8px;font-weight:700}.node-canvas{position:relative;overflow:hidden;min-height:600px;background-image:radial-gradient(circle at 1px 1px,#313632 1px,transparent 0);background-size:22px 22px}.node-canvas:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:rgba(200,255,61,.05);filter:blur(90px);left:30%;top:20%;pointer-events:none}.empty-canvas{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;color:#626763;pointer-events:none}.empty-canvas span{display:grid;place-items:center;margin:0 auto 16px;width:38px;height:38px;border:1px solid #3b403c;border-radius:50%;font-size:18px}.empty-canvas strong{display:block;font-size:14px;color:#8c918d}.empty-canvas small{font-size:10px}.edge-layer{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:visible}.edge-layer path{fill:none;stroke:#59605b;stroke-width:1.3}.edge-layer path.active{stroke:var(--lime)}.canvas-node{position:absolute;z-index:2;width:154px;min-height:76px;background:#181b19;border:1px solid #454b46;border-radius:12px;padding:10px 11px;box-shadow:0 14px 30px rgba(0,0,0,.22);user-select:none;cursor:move}.canvas-node.selected{border-color:var(--lime);box-shadow:0 0 0 1px var(--lime),0 15px 40px rgba(0,0,0,.28)}.canvas-node.disabled{opacity:.34;filter:grayscale(1)}.canvas-node .node-top{display:flex;justify-content:space-between;align-items:center}.canvas-node .node-code{font-size:8px;color:var(--lime);letter-spacing:.1em}.canvas-node .node-menu{font-size:12px;color:#5f6660}.canvas-node h4{font-size:14px;margin:15px 0 2px}.canvas-node p{font-size:8px;letter-spacing:.1em;color:#7d837e;margin:0;text-transform:uppercase}.connector{position:absolute;right:-6px;top:50%;transform:translateY(-50%);width:11px;height:11px;background:#101210;border:2px solid var(--lime);border-radius:50%;cursor:crosshair}.connector.awaiting{box-shadow:0 0 0 5px rgba(200,255,61,.15)}.canvas-help{height:42px;border-top:1px solid #282c29;display:flex;align-items:center;gap:22px;padding:0 15px;color:#555c56;font-size:8px;text-transform:uppercase;letter-spacing:.08em}.canvas-help b{color:#929892;font-weight:500}.inspector-empty{padding:50px 12px;color:#606761;text-align:center}.inspector-glyph{font-size:36px;margin-bottom:12px;color:#343a35}.inspector-empty p{font-size:11px}.selected-node-head{display:flex;align-items:center;gap:10px;padding:20px 4px}.selected-node-head small{display:block;font-size:7px;color:#686e69;letter-spacing:.13em}.selected-node-head strong{font-size:13px}.inspector-form label{display:block;border-top:1px solid #252925;padding:14px 4px 10px;font-size:8px;color:#646a65;letter-spacing:.1em}.inspector-form select{width:100%;margin-top:8px;background:#171a18;color:#e3e6e3;border:1px solid #2f342f;border-radius:7px;padding:8px;font-size:10px;outline:0}.toggle-row{display:flex!important;align-items:center;justify-content:space-between;position:relative}.toggle-row span small{display:block;font-size:7px;margin-top:3px;color:#424743}.toggle-row input{position:absolute;opacity:0}.toggle-row b{width:33px;height:19px;background:#262b27;border-radius:999px;position:relative}.toggle-row b:after{content:"";position:absolute;width:13px;height:13px;border-radius:50%;background:#6e756f;left:3px;top:3px;transition:.2s}.toggle-row input:checked+b{background:var(--lime)}.toggle-row input:checked+b:after{left:17px;background:#121412}.inspector-actions{padding-top:12px}.inspector-actions button{width:100%;background:transparent;border:1px solid #303530;color:#747a75;padding:8px;border-radius:8px;font-size:9px;cursor:pointer}.diagnostic-mini{margin-top:28px;border-top:1px solid #282c29;padding:18px 4px;display:grid;grid-template-columns:1fr 40px 40px;gap:8px;align-items:end}.diagnostic-mini>span{font-size:7px;color:#565d57;letter-spacing:.12em}.diagnostic-mini div{text-align:center}.diagnostic-mini b{display:block;font-size:17px}.diagnostic-mini small{font-size:7px;color:#555b56}.diagnostic-drawer{max-height:0;overflow:hidden;background:#171a18;border:1px solid transparent;border-radius:0 0 24px 24px;transition:border-color .25s ease}.diagnostic-drawer.open{max-height:1200px;border-color:#2a2e2b;border-top:0}.drawer-head{display:flex;justify-content:space-between;align-items:flex-start;padding:32px 34px 24px;border-bottom:1px solid #2b302c}.drawer-head span{font-size:9px;color:#707770;letter-spacing:.14em}.drawer-head h3{font-size:26px;margin:6px 0 0}.drawer-head button{background:none;border:0;color:#777;font-size:27px;cursor:pointer}.diagnostic-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;padding:30px 34px 40px}.dimension{margin-bottom:17px}.dimension-head{display:flex;justify-content:space-between;font-size:9px;margin-bottom:7px;color:#939993}.dimension-track{height:3px;background:#2b302c}.dimension-track i{display:block;height:100%;background:var(--lime);width:40%;transition:width .5s}.signal-list{display:grid;grid-template-columns:1fr 1fr;gap:10px}.signal{border:1px solid #303531;border-radius:13px;padding:16px;min-height:130px}.signal small{font-size:8px;letter-spacing:.12em;color:#737a74}.signal h4{font-size:14px;margin:18px 0 7px}.signal p{font-size:10px;color:#8d938e;margin:0}.signal.high{border-color:#666f4c}.signal.high small{color:var(--lime)}
.tools{padding-top:42px;padding-bottom:130px;background:var(--paper2)}.tools-head{display:grid;grid-template-columns:1.2fr .8fr;gap:80px;align-items:end;margin-bottom:80px}.tools-head h2{font-size:clamp(50px,6.5vw,104px);line-height:.9;letter-spacing:-.06em;margin:0}.tools-head p{font-size:18px;color:#61605a;max-width:480px;justify-self:end}.tool-list{border-top:1px solid var(--ink)}.tool-row{display:grid;grid-template-columns:70px 1fr 100px 40px;gap:20px;align-items:center;border-bottom:1px solid var(--line);padding:26px 0;transition:.3s}.tool-row:hover{padding-left:18px;background:#e9e3d8}.tool-no{font-size:10px;color:#77766f}.tool-row h3{font-size:28px;margin:0 0 4px;letter-spacing:-.03em}.tool-row p{margin:0;color:#74736d;font-size:13px}.tool-row>b{font-size:8px;letter-spacing:.13em;border:1px solid var(--line);border-radius:999px;padding:6px 8px;text-align:center}.tool-row.is-active>b{background:var(--lime);border-color:var(--lime)}.tool-arrow{font-size:20px;text-align:right}
.collaborate{background:#171815;color:var(--white);padding-top:42px;padding-bottom:130px}.collab-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(70px,10vw,180px)}.collab-sticky{position:sticky;top:130px;align-self:start}.kicker{font-size:9px;letter-spacing:.15em;color:#777d78}.collab-sticky h2{font-size:clamp(58px,6vw,100px);line-height:.88;letter-spacing:-.06em;margin:25px 0}.collab-sticky>p:not(.kicker){color:#9ba09b;max-width:460px;font-size:17px}.btn-light{margin-top:28px;background:var(--white);color:#131411}.collab-list{border-top:1px solid #3a3d39}.collab-row{display:grid;grid-template-columns:46px 1fr 30px;gap:18px;padding:35px 0;border-bottom:1px solid #3a3d39;align-items:start;transition:.3s}.collab-row:hover{padding-left:14px;color:var(--lime)}.collab-row>span{font-size:9px;color:#666c67}.collab-row h3{font-size:clamp(25px,2.5vw,42px);line-height:1.05;letter-spacing:-.035em;margin:0;font-weight:500}.collab-row i{font-style:normal;font-size:22px}
.footer{background:var(--lime);padding-top:34px;padding-bottom:26px}.footer-top,.footer-bottom{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.1em}.footer-word{font-size:clamp(90px,18vw,300px);line-height:.62;letter-spacing:-.08em;font-weight:800;margin:100px 0 80px}.footer-bottom{border-top:1px solid rgba(0,0,0,.25);padding-top:18px}
.reveal{opacity:0;transform:translateY(25px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}.reveal.in-view{opacity:1;transform:none}
@media(max-width:1100px){.hero-grid{grid-template-columns:1fr}.hero-system{height:470px}.manifesto-copy,.lab-intro-grid,.tools-head,.collab-grid{grid-template-columns:1fr}.principles{margin-left:0}.tools-head p,.lab-intro-copy{justify-self:start}.lab-app{grid-template-columns:160px minmax(0,1fr)}.inspector{display:none}.diagnostic-grid{grid-template-columns:1fr}.collab-sticky{position:static;margin-bottom:30px}}
@media(max-width:760px){:root{--pad:20px}.site-header{grid-template-columns:1fr auto;padding:14px 20px}.brand-copy em,.nav{display:none}.header-cta{font-size:10px}.hero{padding-top:112px}.hero-title{font-size:clamp(54px,16vw,92px)}.hero-intro{font-size:18px}.hero-actions{align-items:flex-start;flex-direction:column}.hero-system{height:430px;border-radius:18px}.preview-node{width:122px;min-height:72px}.n-customer{left:5%}.n-product,.n-ai{right:4%}.n-problem{left:33%}.manifesto{padding-bottom:90px}.manifesto-copy h2{font-size:46px}.principles{grid-template-columns:1fr;margin-top:60px}.principles h3{margin-top:20px}.lab-shell{padding-bottom:70px}.lab-app-wrap{padding-left:10px;padding-right:10px}.lab-app{display:block;min-height:0}.node-library{border-right:0;border-bottom:1px solid #282c29;display:flex;overflow-x:auto;gap:14px;padding:12px}.node-library .panel-title{min-width:105px;border:0}.node-group{display:flex;gap:3px;margin:0;align-items:center}.node-group label{display:none}.palette-node{width:auto;min-width:max-content;padding:7px 8px;background:#151815}.canvas-toolbar{height:auto;min-height:88px;align-items:flex-start;flex-direction:column;padding:10px}.toolbar-actions{width:100%;overflow:auto}.node-canvas{min-height:520px}.canvas-help{overflow:auto}.diagnostic-grid{padding:20px}.signal-list{grid-template-columns:1fr}.tools{padding-bottom:90px}.tool-row{grid-template-columns:38px 1fr 70px 22px}.tool-row h3{font-size:22px}.tool-row p{font-size:11px}.collaborate{padding-bottom:90px}.footer-word{margin:80px 0 60px;font-size:25vw}.footer-bottom{gap:20px;flex-direction:column}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}

/* ===== V2: compact first view + stronger mobile lab ===== */
.hero-v2{min-height:100svh;padding-top:104px;padding-bottom:24px;display:grid;grid-template-rows:auto 1fr auto auto;align-content:stretch;background:var(--paper2)}
.hero-v2 .hero-meta{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);padding-top:13px;font-size:10px;letter-spacing:.14em;color:#62615b}
.hero-v2 .hero-statement{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(290px,.55fr);gap:clamp(44px,6vw,100px);align-items:end;padding:clamp(26px,4.5vh,55px) 0 clamp(24px,4vh,48px)}
.hero-v2 .hero-title{font-size:clamp(62px,7.5vw,126px);line-height:.84;margin:0;max-width:1100px}
.hero-side{align-self:end;padding-bottom:7px}.hero-side>p{font-size:clamp(17px,1.25vw,21px);line-height:1.35;margin:0 0 13px;letter-spacing:-.02em}.hero-side .hero-side-muted{font-size:13px;color:#6c6a64;max-width:390px}.hero-v2 .hero-actions{margin-top:25px;gap:18px;flex-wrap:wrap}
.hero-principles{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink);border-bottom:1px solid var(--line)}.hero-principles article{display:grid;grid-template-columns:34px 1fr;gap:13px;padding:17px 22px 18px 0;border-right:1px solid var(--line)}.hero-principles article+article{padding-left:22px}.hero-principles article:last-child{border-right:0}.hero-principles>article>span{font-size:9px;color:#75746d;padding-top:4px}.hero-principles h2{font-size:17px;line-height:1.1;margin:0 0 6px;letter-spacing:-.025em}.hero-principles p{font-size:11px;line-height:1.42;margin:0;color:#74726b;max-width:330px}
.hero-flow{display:flex;justify-content:space-between;align-items:center;padding-top:15px;font-size:9px;letter-spacing:.12em;color:#6c6b64}.hero-flow div{display:flex;align-items:center;gap:11px}.hero-flow i{font-style:normal;color:#a09e96}.hero-flow a{color:var(--ink);font-weight:700}

.tools-head h2{max-width:920px}.tool-workbench{display:grid;grid-template-columns:minmax(240px,.42fr) minmax(0,1.58fr);gap:clamp(36px,6vw,100px);align-items:start}.tool-workbench-intro{position:sticky;top:110px;border-top:1px solid var(--ink);padding-top:15px}.tool-workbench-intro span{font-size:9px;letter-spacing:.14em}.tool-workbench-intro p{font-size:14px;color:#6f6d66;max-width:310px;margin-top:22px}.tool-list{border-top:1px solid var(--ink)}button.tool-row{width:100%;font-family:inherit;color:inherit;background:transparent;border-left:0;border-right:0;border-top:0;text-align:left;cursor:pointer}.tool-row:focus-visible{outline:2px solid var(--ink);outline-offset:3px}.tool-row:hover,.tool-row:focus-visible{padding-left:18px;background:#e9e3d8}.tool-row>b{background:transparent}.tool-row.is-active>b,.tool-row:hover>b{background:var(--lime);border-color:var(--lime)}

@media(max-width:1100px){
  .hero-v2{min-height:auto}.hero-v2 .hero-statement{grid-template-columns:1fr;padding-top:40px}.hero-side{max-width:700px}.hero-principles{margin-top:20px}.tool-workbench{grid-template-columns:1fr}.tool-workbench-intro{position:static}.tools-head{margin-bottom:46px}
}

@media(max-width:760px){
  .hero-v2{min-height:100svh;padding-top:88px;padding-bottom:18px;display:block}.hero-v2 .hero-meta{font-size:8px}.hero-v2 .hero-meta span:last-child{display:none}.hero-v2 .hero-statement{display:block;padding:34px 0 28px}.hero-v2 .hero-title{font-size:clamp(50px,15vw,78px);line-height:.86}.hero-side{padding:26px 0 0}.hero-side>p{font-size:17px;max-width:95%}.hero-side .hero-side-muted{font-size:12px}.hero-v2 .hero-actions{flex-direction:row;align-items:center;gap:14px}.hero-v2 .btn-primary{padding:12px 14px}.hero-v2 .text-link{font-size:11px}.hero-principles{grid-template-columns:1fr;margin-top:0}.hero-principles article,.hero-principles article+article{grid-template-columns:28px 1fr;padding:11px 0;border-right:0;border-bottom:1px solid var(--line)}.hero-principles article:last-child{border-bottom:0}.hero-principles h2{font-size:14px;margin-bottom:3px}.hero-principles p{font-size:10px;max-width:none}.hero-flow{margin-top:12px}.hero-flow div{display:none}.hero-flow a{margin-left:auto}

  .lab-intro{padding-top:30px}.lab-intro .section-index{margin-bottom:44px}.lab-intro h2{font-size:clamp(48px,14vw,72px)}.lab-intro-copy p{font-size:16px}.lab-app-wrap{padding-left:0;padding-right:0;padding-top:30px}.lab-app{border-left:0;border-right:0;border-radius:0}.node-library{scrollbar-width:none}.node-library::-webkit-scrollbar{display:none}.node-library .panel-title{min-width:88px}.palette-node{padding:6px 7px}.palette-node i{width:23px;height:23px}.palette-node span{font-size:10px}.canvas-toolbar{min-height:84px}.lens-tabs{width:100%;overflow-x:auto;scrollbar-width:none}.lens{flex:0 0 auto}.toolbar-actions{justify-content:space-between;gap:4px;scrollbar-width:none}.toolbar-actions button{font-size:9px;padding:7px 7px}.toolbar-actions .run-btn{margin-left:auto;white-space:nowrap}.node-canvas{height:100svh;min-height:100svh;background-size:18px 18px}.canvas-node{width:118px;min-height:62px;padding:8px 9px;border-radius:10px}.canvas-node h4{font-size:12px;margin:10px 0 1px}.canvas-node p{font-size:7px}.canvas-node .node-code{font-size:7px}.connector{width:10px;height:10px;right:-5px}.canvas-help{height:38px;gap:16px;padding:0 10px;font-size:7px;white-space:nowrap}.diagnostic-drawer{border-radius:0}.drawer-head{padding:24px 20px 18px}.drawer-head h3{font-size:21px}.diagnostic-grid{padding:18px 20px 28px}.signal{min-height:0}.signal h4{margin-top:12px}.tools-head h2{font-size:clamp(46px,14vw,68px)}.tool-workbench{gap:32px}.tool-workbench-intro p{margin-top:12px}.tool-row{grid-template-columns:30px 1fr 52px 18px;gap:10px;padding:20px 0}.tool-row h3{font-size:19px}.tool-row p{font-size:10px;line-height:1.35}.tool-row>b{font-size:7px;padding:5px 4px}.tool-arrow{font-size:16px}
}

/* ===== V3: tighter opening + responsive diagnostic board ===== */
.site-header{grid-template-columns:1fr auto}
.header-actions{justify-self:end;display:flex;align-items:center;gap:8px}
.header-cta-primary{background:var(--ink);color:var(--white)}

.hero-v2{padding-top:94px;grid-template-rows:auto auto auto auto}
.hero-v2 .hero-statement{display:block;padding:clamp(12px,2.2vh,24px) 0 clamp(18px,2.8vh,30px)}
.hero-v2 .hero-title{max-width:1240px}
.hero-v2 .hero-principles{margin-top:0}

@media(max-width:1100px){
  .hero-v2 .hero-statement{padding-top:18px}
}

@media(max-width:760px){
  .site-header{grid-template-columns:1fr auto;padding:10px 12px}
  .brand-copy{display:none}
  .brand-mark{width:30px;height:30px}
  .header-actions{gap:5px}
  .header-cta{padding:8px 9px;font-size:8.5px;white-space:nowrap}
  .header-cta span{margin-left:4px}
  .header-cta-primary{display:inline-flex}

  .hero-v2{padding-top:72px;padding-bottom:14px;min-height:auto}
  .hero-v2 .hero-statement{padding:14px 0 20px}
  .hero-v2 .hero-title{font-size:clamp(47px,14vw,72px);line-height:.87}

  /* Full-bleed mobile workbench: the whole app occupies one phone viewport. */
  .lab-app-wrap{padding-left:0;padding-right:0}
  .lab-app{height:100svh;min-height:560px;border-left:0;border-right:0;border-radius:0;display:grid;grid-template-rows:auto minmax(0,1fr)}
  .node-library{min-height:58px;padding:8px 10px;gap:8px}
  .node-library .panel-title{min-width:84px;padding:0 5px}.node-library .panel-title small{display:none}
  .node-group{gap:2px}
  .palette-node{padding:5px 6px}.palette-node i{width:22px;height:22px;font-size:7px}.palette-node span{font-size:10px}
  .canvas-column{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr)}
  .canvas-toolbar{min-height:72px;height:auto;padding:8px 10px;gap:7px}
  .lens-tabs{width:100%;display:grid;grid-template-columns:repeat(4,1fr)}
  .lens{padding:6px 3px;font-size:8.5px}
  .toolbar-actions{gap:2px;width:100%;overflow:visible;display:grid;grid-template-columns:auto auto 1fr}
  .toolbar-actions button{font-size:8.5px;padding:6px 7px;white-space:nowrap}
  .toolbar-actions .run-btn{margin-left:0;justify-self:stretch}
  .node-canvas{min-height:0;height:100%;width:100%;overflow:hidden;background-size:18px 18px}
  .canvas-help{display:none}

  /* Four compact logical stages fit inside the board instead of cropping a desktop layout. */
  .canvas-node{width:var(--mobile-node-w,76px);min-height:var(--mobile-node-h,52px);padding:7px 7px;border-radius:9px;box-shadow:0 8px 18px rgba(0,0,0,.22)}
  .canvas-node .node-code{font-size:6.5px}.canvas-node .node-menu{display:none}
  .canvas-node h4{font-size:10px;line-height:1.05;margin:10px 0 0;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .canvas-node p{display:none}
  .canvas-node .connector{width:9px;height:9px;right:-5px}
  .empty-canvas strong{font-size:12px}.empty-canvas small{font-size:9px}
}
.hero-v2{align-content:start}


/* ===== V4: viewport-composed opening + deterministic responsive board ===== */
.hero-v2{
  min-height:100svh;
  display:flex;
  flex-direction:column;
  align-content:initial;
  padding-top:94px;
  padding-bottom:20px;
}
.hero-v2 .hero-meta{
  justify-content:flex-end;
  border-top:0;
  padding-top:0;
  margin-bottom:10px;
}
.hero-v2 .hero-statement{
  display:block;
  padding:0;
}
.hero-v2 .hero-title{
  max-width:1240px;
}
.hero-v2 .hero-principles{
  margin-top:auto;
}
.hero-v2 .hero-flow{
  margin-top:12px;
}

/* Lab switches to its compact board mode slightly before phone width so resizing is stable. */
@media(max-width:820px){
  .lab-app-wrap{padding-left:0;padding-right:0}
  .lab-app{
    height:100svh;
    min-height:560px;
    border-left:0;border-right:0;border-radius:0;
    display:grid;
    grid-template-rows:auto minmax(0,1fr);
  }
  .node-library{
    border-right:0;border-bottom:1px solid #282c29;
    min-height:56px;padding:7px 9px;gap:7px;
    display:flex;overflow-x:auto;overflow-y:hidden;
    scrollbar-width:none;
  }
  .node-library::-webkit-scrollbar{display:none}
  .node-library .panel-title{min-width:78px;padding:0 4px;border:0;flex:0 0 auto}
  .node-library .panel-title small,.node-group label{display:none}
  .node-group{display:flex;gap:2px;margin:0;align-items:center;flex:0 0 auto}
  .palette-node{width:auto;min-width:max-content;padding:5px 6px;background:#151815}
  .palette-node i{width:21px;height:21px;font-size:6.5px}
  .palette-node span{font-size:9px}

  .canvas-column{min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr)}
  .canvas-toolbar{height:auto;min-height:70px;align-items:flex-start;flex-direction:column;padding:7px 9px;gap:6px}
  .lens-tabs{width:100%;display:grid;grid-template-columns:repeat(4,1fr);overflow:visible}
  .lens{padding:5px 2px;font-size:8px}
  .toolbar-actions{width:100%;display:grid;grid-template-columns:auto auto 1fr;gap:2px;overflow:visible}
  .toolbar-actions button{font-size:8px;padding:5px 6px;white-space:nowrap}
  .toolbar-actions .run-btn{margin-left:0;justify-self:stretch}

  .node-canvas{height:100%;min-height:0;width:100%;overflow:hidden;background-size:16px 16px}
  .canvas-help{display:none}
  .canvas-node{
    width:var(--mobile-node-w,76px)!important;
    height:var(--mobile-node-h,50px)!important;
    min-height:0!important;
    padding:var(--mobile-node-pad,6px)!important;
    border-radius:8px;
    box-shadow:0 7px 16px rgba(0,0,0,.2);
  }
  .canvas-node .node-code{font-size:var(--mobile-code-size,6px)}
  .canvas-node .node-menu{display:none}
  .canvas-node h4{
    font-size:var(--mobile-title-size,9px);
    line-height:1;
    margin:var(--mobile-title-gap,8px) 0 0;
    letter-spacing:-.02em;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .canvas-node p{display:none}
  .canvas-node .connector{width:8px;height:8px;right:-5px;border-width:1.5px}
  .edge-layer path{stroke-width:1}
}

@media(max-width:760px){
  .hero-v2{
    min-height:100svh;
    display:flex;
    flex-direction:column;
    padding-top:72px;
    padding-bottom:12px;
  }
  .hero-v2 .hero-meta{font-size:7.5px;margin-bottom:8px}
  .hero-v2 .hero-statement{padding:0}
  .hero-v2 .hero-title{font-size:clamp(47px,14vw,72px);line-height:.87}
  .hero-v2 .hero-principles{margin-top:auto;grid-template-columns:1fr}
  .hero-v2 .hero-principles article,
  .hero-v2 .hero-principles article+article{padding:9px 0}
  .hero-v2 .hero-flow{margin-top:8px}
}

@media(max-width:390px){
  .palette-node span{display:none}
  .palette-node{padding:5px}
  .node-library .panel-title{min-width:62px}
  .canvas-toolbar{min-height:66px}
  .toolbar-actions button{font-size:7.5px;padding:5px}
}

/* V4 mobile grid conflict fix: override the <=1100px desktop column definition. */
@media(max-width:820px){
  .lab-app{grid-template-columns:1fr!important}
}

/* =========================================================
   V5 — responsive free-form board + mobile sheets
   ========================================================= */
.canvas-node{box-sizing:border-box}
.sheet-close,.mobile-canvas-actions,.lab-sheet-backdrop{display:none}

/* Keep the inspector available on medium desktop/tablet widths. */
@media (min-width:821px) and (max-width:1100px){
  .lab-app{grid-template-columns:150px minmax(0,1fr) 205px}
  .inspector{display:block}
}

@media(max-width:820px){
  .lab-app{
    position:relative;
    height:100svh;
    min-height:560px;
    display:grid;
    grid-template-columns:1fr!important;
    grid-template-rows:min-content minmax(0,1fr);
    overflow:hidden;
  }

  /* Side panels become bottom sheets instead of occupying the board. */
  .node-library,.inspector{
    display:block!important;
    position:absolute;
    z-index:40;
    left:8px;
    right:8px;
    bottom:8px;
    width:auto;
    max-height:min(70svh,620px);
    overflow:auto;
    border:1px solid #323733!important;
    border-radius:18px;
    background:#0d0f0e;
    box-shadow:0 -20px 60px rgba(0,0,0,.5);
    padding:14px;
    transform:translateY(calc(100% + 22px));
    opacity:0;
    pointer-events:none;
    transition:transform .28s ease,opacity .22s ease;
  }
  .node-library.sheet-open,.inspector.sheet-open{
    transform:translateY(0);
    opacity:1;
    pointer-events:auto;
  }
  .node-library .panel-title,.inspector .panel-title{
    position:sticky;
    top:-14px;
    z-index:2;
    min-width:0;
    padding:14px 2px 12px;
    margin-top:-14px;
    background:#0d0f0e;
    border-bottom:1px solid #292c2a;
  }
  .node-library .panel-title small,.inspector .panel-title small{display:block}
  .sheet-close{
    display:grid;
    place-items:center;
    margin-left:auto;
    width:29px;
    height:29px;
    border:1px solid #303530;
    border-radius:50%;
    background:#171a18;
    color:#a3aaa4;
    font-size:18px;
    line-height:1;
    cursor:pointer;
  }
  .lab-sheet-backdrop{
    display:block;
    position:absolute;
    inset:0;
    z-index:30;
    border:0;
    background:rgba(5,7,6,.54);
    opacity:0;
    pointer-events:none;
    transition:opacity .22s ease;
  }
  .lab-app.sheet-active .lab-sheet-backdrop{opacity:1;pointer-events:auto}

  /* Blocks fit inside the viewport: no horizontal scrolling. */
  .node-library{overflow-y:auto;overflow-x:hidden}
  .node-group{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
    margin:17px 0 0;
  }
  .node-group label{
    display:block;
    grid-column:1/-1;
    margin:0 2px 2px;
  }
  .palette-node{
    width:100%;
    min-width:0;
    padding:10px;
    background:#151815;
    border:1px solid #242925;
  }
  .palette-node i{width:26px;height:26px;font-size:7px;flex:0 0 auto}
  .palette-node span{display:block!important;font-size:10px;overflow:hidden;text-overflow:ellipsis}

  /* Main area owns all available height. */
  .canvas-column{grid-row:1/-1;min-height:0;position:relative}
  .canvas-toolbar{z-index:8;background:#101212}
  .node-canvas{position:relative;height:100%;min-height:0;overflow:hidden}

  /* Floating controls give access to the hidden panels. */
  .mobile-canvas-actions{
    position:absolute;
    left:10px;
    bottom:10px;
    z-index:12;
    display:flex;
    gap:5px;
    padding:4px;
    border:1px solid #303530;
    border-radius:12px;
    background:rgba(13,15,14,.9);
    backdrop-filter:blur(12px);
    box-shadow:0 8px 26px rgba(0,0,0,.3);
  }
  .mobile-canvas-actions button{
    border:0;
    border-radius:8px;
    background:#1d211e;
    color:#aeb5af;
    padding:7px 9px;
    font-size:8px;
    letter-spacing:.03em;
  }
  .mobile-canvas-actions button:first-child{background:var(--lime);color:#101210;font-weight:700}

  /* Fluid nodes: geometry and text share one scale and never overlap. */
  .canvas-node{
    width:var(--compact-node-w,88px)!important;
    height:var(--compact-node-h,56px)!important;
    min-height:0!important;
    padding:var(--compact-node-pad,7px)!important;
    border-radius:var(--compact-node-radius,9px);
    display:flex;
    flex-direction:column;
    overflow:visible;
  }
  .canvas-node .node-top{min-height:var(--compact-top-h,9px);flex:0 0 auto}
  .canvas-node .node-code{font-size:var(--compact-code-size,6px);line-height:1}
  .canvas-node .node-menu{display:none}
  .canvas-node h4{
    flex:0 0 auto;
    width:100%;
    min-width:0;
    margin:auto 0 0!important;
    padding-top:2px;
    font-size:var(--compact-title-size,9px)!important;
    line-height:1.05!important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .canvas-node p{display:none}
  .canvas-node .connector{
    width:var(--compact-connector,8px);
    height:var(--compact-connector,8px);
    right:calc(var(--compact-connector,8px) * -.55);
    border-width:1.5px;
  }

  .inspector-empty{padding:34px 18px}
  .selected-node-head{padding:18px 4px 14px}
  .diagnostic-mini{margin-top:18px}
}

@media(max-width:420px){
  .mobile-canvas-actions{left:7px;bottom:7px}
  .mobile-canvas-actions button{padding:6px 7px;font-size:7.5px}
  .node-library,.inspector{left:6px;right:6px;bottom:6px;border-radius:16px}
}
@media(max-width:820px){
  .lab-app{grid-template-rows:minmax(0,1fr)}
  .canvas-column{grid-row:1}
}

/* =========================================================
   V6 — character motion + real block model + diagnostic lenses
   ========================================================= */
.hero-char-animate{visibility:visible}
.hero-char-animate .char-word{display:inline-block;white-space:nowrap}
.hero-char-animate .char-unit{
  display:inline-block;
  opacity:0;
  transform:translate3d(.82em,0,0);
  filter:blur(2px);
  will-change:transform,opacity,filter;
}
.hero-char-animate.char-ready .char-unit{
  animation:heroCharEnter .72s cubic-bezier(.19,1,.22,1) forwards;
  animation-delay:calc(.12s + var(--char-i) * var(--char-step,.018s));
}
@keyframes heroCharEnter{to{opacity:1;transform:translate3d(0,0,0);filter:blur(0)}}

/* More useful workspace proportions. */
@media(min-width:1101px){
  .lab-app{grid-template-columns:205px minmax(0,1fr) 285px}
}
@media (min-width:821px) and (max-width:1100px){
  .lab-app{grid-template-columns:165px minmax(0,1fr) 245px}
}
.node-library,.inspector{min-width:0}
.node-library{overflow:auto;scrollbar-width:thin;scrollbar-color:#343a35 transparent}
.inspector{overflow:auto;scrollbar-width:thin;scrollbar-color:#343a35 transparent}

/* Lens header: lens is a question, not just a tab. */
.lens-cluster{display:flex;align-items:center;gap:11px;min-width:0}
.lens-context{
  color:#626963;
  font-size:8px;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
}
.lens{transition:background .2s,color .2s,transform .2s}
.lens.active{box-shadow:inset 0 0 0 1px #3b423c}
.lens:active{transform:translateY(1px)}

/* Nodes carry a compact lens-specific state. */
.canvas-node{
  transition:opacity .26s ease,border-color .26s ease,background .26s ease,box-shadow .26s ease,filter .26s ease;
  overflow:visible;
}
.canvas-node .node-top{gap:5px}
.canvas-node .node-status-dot{
  width:5px;height:5px;border-radius:50%;margin-left:auto;
  background:#434943;box-shadow:0 0 0 3px transparent;
  transition:background .2s,box-shadow .2s;
}
.canvas-node .node-menu{margin-left:2px}
.canvas-node .node-badge{
  max-width:100%;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  transition:color .2s,opacity .2s;
}
.canvas-node.has-warning .node-status-dot{background:#d8ff55;box-shadow:0 0 0 3px rgba(200,255,61,.08)}
.canvas-node.lens-primary{opacity:1;border-color:#59615a;background:#1b1f1c}
.canvas-node.lens-primary .node-badge{color:#aab1ab}
.canvas-node.lens-secondary{opacity:.66;border-color:#353b36}
.canvas-node.lens-secondary .node-badge{color:#666d67}
.canvas-node.lens-muted{opacity:.24;filter:saturate(.3)}
.canvas-node.lens-muted.selected{opacity:.82;filter:none}
.canvas-node.selected{opacity:1!important;filter:none!important}

.edge-layer path{transition:stroke .22s,opacity .22s,stroke-width .22s}
.edge-layer path.edge-primary{opacity:.88;stroke:#667068;stroke-width:1.35}
.edge-layer path.edge-secondary{opacity:.40;stroke:#4d554f;stroke-width:1.05}
.edge-layer path.edge-muted{opacity:.12;stroke:#414842;stroke-width:.9}
.edge-layer path.edge-selected{opacity:1;stroke:var(--lime);stroke-width:1.65}

/* Inspector is schema-driven: each block exposes different controls. */
.selected-node-head{align-items:flex-start}
.selected-node-head>div{min-width:0}
.selected-node-head em{
  display:block;margin-top:3px;color:#565d57;font-style:normal;font-size:7px;
  letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.inspector-fields{border-top:1px solid #252925}
.inspector-field{
  display:block!important;
  padding:12px 4px 10px!important;
  border-top:0!important;
  border-bottom:1px solid #252925;
}
.inspector-field>span{display:block;font-size:7.5px;color:#666d67;letter-spacing:.1em;text-transform:uppercase}
.inspector-field select{
  margin-top:7px!important;
  min-height:34px;
  background:#151816!important;
  border-color:#303631!important;
}
.inspector-enabled{border-top:0!important;border-bottom:1px solid #252925;padding:13px 4px!important}
.lens-insight{
  margin:14px 0 0;padding:14px 13px 15px;border:1px solid #303630;border-radius:11px;
  background:linear-gradient(145deg,rgba(200,255,61,.045),rgba(255,255,255,.012));
}
.lens-insight>span{display:block;color:var(--lime);font-size:7px;letter-spacing:.13em;margin-bottom:8px}
.lens-insight strong{display:block;font-size:11px;line-height:1.25;color:#eef1ee}
.lens-insight p{margin:7px 0 0;color:#777f78;font-size:9px;line-height:1.5}
.connection-summary{margin-top:13px;padding:0 3px}
.connection-head{display:flex;justify-content:space-between;align-items:center;padding:0 1px 8px;border-bottom:1px solid #252925}
.connection-head span{font-size:7px;color:#59605a;letter-spacing:.12em}
.connection-head b{font-size:9px;color:#aeb5af}
.connection-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;padding:8px 1px;border-bottom:1px solid #202421}
.connection-row span{font-size:8px;color:#a2a8a3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.connection-row small{font-size:7px;color:#555d57;text-transform:uppercase;letter-spacing:.04em}
.connection-summary>p{font-size:8px;color:#565d57;margin:10px 0}
.inspector-actions{padding-top:14px}

/* Palette grows to real system blocks but remains compact. */
.node-group{margin-top:18px}
.palette-node{padding-top:7px;padding-bottom:7px}
.node-group+ .node-group{padding-top:2px}

/* Diagnostics: keep exact numbers internal; UI communicates strength bands. */
.dimension-head b{font-weight:600;letter-spacing:.08em;color:#c9cec9}
.signal.low{opacity:.72}
.signal.medium{border-color:#444b45}

@media(max-width:1100px){
  .lens-context{display:none}
}

@media(max-width:820px){
  .lens-cluster{width:100%;display:block}
  .lens-context{display:block;margin-top:5px;text-align:center;font-size:6px;line-height:1.2;white-space:normal;min-height:8px}
  .canvas-toolbar{padding-top:8px;padding-bottom:8px}
  .node-library{padding-bottom:max(16px,env(safe-area-inset-bottom))}
  .inspector{padding-bottom:max(16px,env(safe-area-inset-bottom))}

  /* Keep lens meaning visible even on small nodes. */
  .canvas-node .node-status-dot{width:4px;height:4px}
  .canvas-node .node-badge{
    display:block!important;
    margin:3px 0 0!important;
    font-size:var(--compact-badge-size,5px)!important;
    line-height:1!important;
    letter-spacing:.035em!important;
    color:#69706a!important;
    text-transform:uppercase;
  }
  .canvas-node h4{margin:auto 0 0!important;padding-top:1px}
  .canvas-node.lens-muted{opacity:.18}

  .inspector-fields{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #252925}
  .inspector-field{min-width:0}
  .inspector-field select{font-size:9px;padding:7px}
  .lens-insight{margin-top:12px}
  .connection-row{padding:7px 1px}
}

@media(max-width:420px){
  .inspector-fields{grid-template-columns:1fr}
  .lens-context{display:none}
}

@media(prefers-reduced-motion:reduce){
  .hero-char-animate .char-unit{opacity:1!important;transform:none!important;filter:none!important;animation:none!important}
}

/* =========================================================
   V7 — progressive block library + clearer inspector
   ========================================================= */
.library-guidance{padding:16px 4px 6px;border-bottom:1px solid #252925}
.library-guidance strong{display:block;font-size:11px;line-height:1.25;color:#d7dbd7;font-weight:600}
.library-guidance p{margin:7px 0 0;font-size:8px;line-height:1.45;color:#626863}
.node-group-core{margin-top:16px;padding-bottom:12px;border-bottom:1px solid #252925}
.library-more-label{margin:17px 4px 7px;font-size:7px;letter-spacing:.14em;color:#555c56}
.node-family{border-top:1px solid #202421}
.node-family:last-child{border-bottom:1px solid #202421}
.node-family summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 4px;cursor:pointer;color:#9ca29d}
.node-family summary::-webkit-details-marker{display:none}
.node-family summary:before{content:'+';font-size:13px;color:#59605b;width:12px}
.node-family[open] summary:before{content:'–';color:var(--lime)}
.node-family summary span{font-size:8px;letter-spacing:.15em;color:#b7bcb8;margin-right:auto}
.node-family summary small{font-size:7px;color:#4f5550;text-align:right}
.node-family .node-group{margin:0 0 10px 16px}
.node-family .palette-node{padding-top:6px;padding-bottom:6px}
.inspector-purpose{margin:-7px 4px 14px;color:#747b75;font-size:9px;line-height:1.45}
.next-step{border-top:1px solid #252925;padding:14px 4px 12px}
.next-step span{display:block;font-size:7px;letter-spacing:.13em;color:var(--lime);margin-bottom:6px}
.next-step p{margin:0;color:#a6aca7;font-size:9px;line-height:1.45}

@media(max-width:1100px) and (min-width:821px){
  .library-guidance p,.node-family summary small{display:none}
  .node-family .node-group{margin-left:0}
}

@media(max-width:820px){
  .node-library{display:block!important}
  .library-guidance{padding:12px 2px 10px}
  .library-guidance strong{font-size:12px}
  .library-guidance p{font-size:9px;max-width:34em}
  .node-group-core{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px!important;margin-top:14px!important}
  .node-group-core label{display:block!important;grid-column:1/-1}
  .library-more-label{margin-top:18px}
  .node-family summary{padding:13px 2px}
  .node-family .node-group{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px!important;margin:0 0 12px!important}
  .node-family .palette-node{width:100%;min-width:0;padding:10px}
  .toolbar-actions{grid-template-columns:1fr 1fr 1fr!important;gap:3px!important}
  .toolbar-actions .run-btn{grid-column:1/-1!important;margin-left:0!important}
  .inspector-purpose{font-size:10px}
  .next-step p{font-size:10px}
}
.toolbar-actions button:disabled{opacity:.38;cursor:default}

/* =========================================================
   V8 — solution primitive, AI model family, edge editing, export
   ========================================================= */
.ai-family-panel summary span{color:#d5d7ff}
.palette-node.ai-palette i{color:#d9d4ff;border-color:#5f5878}
.canvas-node.ai-family{border-width:1.5px}
.canvas-node.ai-violet{border-color:#7357c9}.canvas-node.ai-violet .node-code{color:#b6a8ff}
.canvas-node.ai-cyan{border-color:#268aa1}.canvas-node.ai-cyan .node-code{color:#72d5ea}
.canvas-node.ai-amber{border-color:#ad7a25}.canvas-node.ai-amber .node-code{color:#efc46f}
.canvas-node.ai-green{border-color:#43885b}.canvas-node.ai-green .node-code{color:#85d69f}
.canvas-node.ai-blue{border-color:#4679b4}.canvas-node.ai-blue .node-code{color:#8ab8ed}
.canvas-node.ai-magenta{border-color:#9c4a8f}.canvas-node.ai-magenta .node-code{color:#e49bd6}
.canvas-node.ai-neutral{border-color:#69716b}.canvas-node.ai-neutral .node-code{color:#c8cec9}
.canvas-node.ai-family.selected{box-shadow:0 0 0 1px currentColor,0 15px 40px rgba(0,0,0,.28)}

.node-canvas.connecting .canvas-node.connect-target{cursor:crosshair;box-shadow:0 0 0 1px rgba(200,255,61,.2),0 14px 30px rgba(0,0,0,.22)}
.node-canvas.connecting .canvas-node.connect-target:hover{border-color:var(--lime);background:#1d211e}

.edge-layer{pointer-events:none}
.edge-layer .edge-hit{pointer-events:stroke;stroke:transparent!important;stroke-width:16!important;opacity:1!important;cursor:pointer}
.edge-layer path:not(.edge-hit){pointer-events:none}
.edge-layer path.edge-current{opacity:1!important;stroke:var(--lime)!important;stroke-width:2.2!important}

.edge-inspector{padding-top:4px}
.edge-inspector .edge-head i{color:#d7dbd7;border-color:#4c534d}
.edge-inspector>.inspector-field{display:block;border-top:1px solid #252925;padding:14px 4px 10px;font-size:8px;color:#646a65;letter-spacing:.1em}
.edge-inspector>.inspector-field select{width:100%;margin-top:8px;background:#171a18;color:#e3e6e3;border:1px solid #2f342f;border-radius:7px;padding:8px;font-size:10px;outline:0}

#exportPng{border:1px solid #303530;color:#9ca39d}
#exportPng:hover{border-color:#59615a;color:#fff}

@media(max-width:820px){
  .toolbar-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .toolbar-actions button{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .toolbar-actions .run-btn{grid-column:1/-1!important}
  .edge-inspector>.inspector-field select{font-size:10px;padding:9px}
}

/* =========================================================
   V9 — zoomable canvas + semantic visual families
   ========================================================= */
.node-canvas{--grid-size:22px;background-size:var(--grid-size) var(--grid-size)}
.canvas-world{
  position:absolute;inset:0;z-index:2;
  transform-origin:0 0;
  will-change:transform;
}
.canvas-world .canvas-node{z-index:2}
.edge-layer{z-index:1}
.empty-canvas{z-index:3}
.mobile-canvas-actions{z-index:9}

.canvas-zoom{
  position:absolute;right:12px;top:12px;z-index:10;
  display:flex;align-items:center;gap:2px;
  padding:3px;background:rgba(13,15,14,.92);border:1px solid #313632;border-radius:10px;
  box-shadow:0 8px 24px rgba(0,0,0,.18);backdrop-filter:blur(8px)
}
.canvas-zoom button{
  min-width:30px;height:29px;padding:0 8px;border:0;border-radius:7px;
  background:transparent;color:#9ca39d;font:600 10px/1 Arial,sans-serif;cursor:pointer
}
.canvas-zoom button:hover{background:#202421;color:#fff}
.canvas-zoom #zoomLevel{min-width:50px;color:#d5dad6;font-size:9px}
.canvas-zoom #zoomFit{border-left:1px solid #2d322e;border-radius:0 7px 7px 0;margin-left:2px}
.node-canvas.pan-ready{cursor:grab}
.node-canvas.is-panning{cursor:grabbing}

/* Families share a quiet semantic color language. */
.canvas-node{
  --node-accent:#6f7770;
  --node-fill:rgba(111,119,112,.055);
  background:linear-gradient(145deg,var(--node-fill),rgba(24,27,25,.96));
  border-color:color-mix(in srgb,var(--node-accent) 62%,#303631);
}
.canvas-node.group-why{--node-accent:#b29b6d;--node-fill:rgba(178,155,109,.10)}
.canvas-node.group-what{--node-accent:#6d91c4;--node-fill:rgba(109,145,196,.10)}
.canvas-node.group-how{--node-accent:#5aa39a;--node-fill:rgba(90,163,154,.10)}
.canvas-node.group-who{--node-accent:#bb8a45;--node-fill:rgba(187,138,69,.10)}
.canvas-node.group-pressure{--node-accent:#bd6f64;--node-fill:rgba(189,111,100,.10)}
.canvas-node .node-code{color:var(--node-accent)}
.canvas-node .connector{border-color:var(--node-accent)}
.canvas-node.selected{
  border-color:var(--node-accent);
  box-shadow:0 0 0 1px var(--node-accent),0 15px 40px rgba(0,0,0,.28)
}
.canvas-node .node-status-dot{background:var(--node-accent)}

/* AI keeps its richer sub-family accents while joining the same system. */
.canvas-node.ai-violet{--node-accent:#8b73dc;--node-fill:rgba(115,87,201,.12)}
.canvas-node.ai-cyan{--node-accent:#49acc2;--node-fill:rgba(38,138,161,.12)}
.canvas-node.ai-amber{--node-accent:#d19b41;--node-fill:rgba(173,122,37,.12)}
.canvas-node.ai-green{--node-accent:#62a978;--node-fill:rgba(67,136,91,.12)}
.canvas-node.ai-blue{--node-accent:#6398d0;--node-fill:rgba(70,121,180,.12)}
.canvas-node.ai-magenta{--node-accent:#bc6caf;--node-fill:rgba(156,74,143,.12)}
.canvas-node.ai-neutral{--node-accent:#8b948d;--node-fill:rgba(105,113,107,.10)}
.canvas-node.ai-family{border-color:var(--node-accent)}
.canvas-node.ai-family .node-code{color:var(--node-accent)}

/* Edges inherit the source-node semantic color from JS. */
.edge-layer path.edge-primary{stroke:var(--edge-color,#667068)}
.edge-layer path.edge-secondary{stroke:var(--edge-color,#4d554f)}
.edge-layer path.edge-muted{stroke:var(--edge-color,#414842)}
.edge-layer path.edge-selected{stroke:var(--edge-color,var(--lime));stroke-width:1.8}
.edge-layer path.edge-current{stroke:var(--edge-color,var(--lime))!important;stroke-width:2.5!important}

@media(max-width:820px){
  .canvas-zoom{right:7px;top:7px;padding:2px;border-radius:8px}
  .canvas-zoom button{min-width:26px;height:25px;padding:0 6px;font-size:9px}
  .canvas-zoom #zoomLevel{min-width:43px;font-size:8px}
  .mobile-canvas-actions{max-width:calc(100% - 155px)}
}
@media(max-width:390px){
  .canvas-zoom #zoomLevel{min-width:38px}
  .canvas-zoom #zoomFit{display:inline-flex;align-items:center;justify-content:center;min-width:30px}
}
.canvas-node h4{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;line-height:1.12}
.canvas-node .node-badge{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}


/* =========================================================
   V12 — diagnostic explorer + restrained Hebo-inspired motion
   ========================================================= */
.diagnostic-transition{min-height:88svh;display:flex;flex-direction:column;justify-content:center;background:var(--paper2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.diagnostic-transition-kicker{font-size:10px;letter-spacing:.17em;color:#77756e;margin-bottom:clamp(28px,5vh,58px)}
.scroll-ink{font-family:var(--display);font-size:clamp(64px,9.2vw,158px);line-height:.82;letter-spacing:-.075em;margin:0;max-width:1320px;color:transparent;background:linear-gradient(90deg,var(--ink) 0%,var(--ink) var(--ink-fill,0%),#d2d0c8 var(--ink-fill,0%),#d2d0c8 100%);-webkit-background-clip:text;background-clip:text}
.diagnostic-transition-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-top:clamp(42px,7vh,90px);border-top:1px solid var(--line);padding-top:18px}
.diagnostic-transition-foot p{max-width:540px;margin:0;color:#65635d;font-size:13px;line-height:1.55}.diagnostic-transition-foot a{font-size:10px;letter-spacing:.13em;font-weight:700;color:var(--ink);white-space:nowrap}

.diagnostic-explorer{background:#f0efe9;color:var(--ink);padding:0 0 110px;border-bottom:1px solid var(--line)}
.explorer-inner{padding-top:34px}.explorer-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.55fr);gap:clamp(40px,7vw,120px);align-items:end;margin:46px 0 54px}.explorer-kicker{font-size:10px;letter-spacing:.16em;margin:0 0 18px;color:#74726b}.explorer-head h2{font-family:var(--display);font-size:clamp(54px,7vw,112px);line-height:.86;letter-spacing:-.065em;margin:0}.explorer-head h2 span{color:transparent;-webkit-text-stroke:1.15px var(--ink)}.explorer-head>p{margin:0 0 5px;color:#64625c;font-size:14px;line-height:1.55;max-width:500px}
.dx-modebar{display:flex;align-items:center;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);min-height:70px;margin-bottom:24px}.dx-mode{appearance:none;border:0;background:transparent;color:#77746d;padding:0 28px;height:70px;font-size:12px;font-weight:700;letter-spacing:.06em;position:relative;cursor:pointer}.dx-mode:first-child{padding-left:0}.dx-mode::after{content:'';position:absolute;left:28px;right:28px;bottom:-1px;height:2px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .35s cubic-bezier(.22,1,.36,1)}.dx-mode:first-child::after{left:0}.dx-mode.active{color:var(--ink)}.dx-mode.active::after{transform:scaleX(1)}.dx-mode-actions{margin-left:auto;display:flex;gap:10px;align-items:center}.dx-read-map,.dx-reset{border:1px solid #bcbab2;background:transparent;border-radius:999px;padding:11px 15px;font-size:10px;font-weight:700;letter-spacing:.04em;color:var(--ink);cursor:pointer}.dx-read-map{background:var(--ink);color:white;border-color:var(--ink);display:inline-flex;gap:16px;align-items:center}.dx-reset:hover{border-color:var(--ink)}
.dx-shell{display:grid;grid-template-columns:minmax(300px,.62fr) minmax(0,1.38fr);gap:22px;align-items:start}.dx-controls-card,.dx-state-card,.dx-map-card,.dx-drivers-card{border:1px solid #cfcdc5;background:#f7f6f1;border-radius:22px;overflow:hidden}.dx-controls-card{position:sticky;top:86px}.dx-card-head{height:48px;padding:0 17px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dedcd4;font-size:9px;letter-spacing:.14em}.dx-card-head small{color:#848179;letter-spacing:.08em}.dx-controls{padding:8px 17px 16px}.dx-factor{padding:15px 0 14px;border-bottom:1px solid #dedcd4}.dx-factor:last-child{border-bottom:0}.dx-factor-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:10px}.dx-factor-head strong{font-size:13px;line-height:1.15}.dx-factor-head em{font-style:normal;font-size:9px;letter-spacing:.07em;color:#6e6b64;background:#eceae3;border-radius:999px;padding:5px 7px;white-space:nowrap}.dx-factor p{margin:0 0 11px;color:#7a7770;font-size:10px;line-height:1.4}.dx-range{width:100%;accent-color:var(--ink);cursor:pointer}.dx-range-labels{display:flex;justify-content:space-between;margin-top:5px;color:#9a978f;font-size:8px;letter-spacing:.06em}.dx-control-note{border-top:1px solid #dedcd4;padding:15px 17px 18px}.dx-control-note span{font-size:9px;letter-spacing:.14em}.dx-control-note p{font-size:10px;color:#77746d;line-height:1.5;margin:8px 0 0}
.dx-results{display:grid;gap:22px}.dx-state-card{padding-bottom:0}.dx-state-main{display:grid;grid-template-columns:1fr auto;gap:30px;padding:26px 28px 25px}.dx-state-main small{font-size:9px;letter-spacing:.13em;color:#85827b}.dx-state-main h3{font-family:var(--display);font-size:clamp(36px,4vw,66px);letter-spacing:-.055em;line-height:.9;margin:8px 0 11px}.dx-state-main p{max-width:620px;color:#706d66;font-size:12px;line-height:1.55;margin:0}.dx-health{display:flex;align-items:flex-end;gap:8px;min-width:155px;justify-content:flex-end}.dx-health span{font-family:var(--display);font-size:76px;line-height:.76;letter-spacing:-.06em}.dx-health small{font-size:8px;line-height:1.35;letter-spacing:.08em;color:#8b8881;padding-bottom:3px}.dx-leverage{border-top:1px solid #dedcd4;display:grid;grid-template-columns:155px 1fr;gap:20px;padding:16px 28px}.dx-leverage span{font-size:9px;letter-spacing:.14em;color:#7f7c74}.dx-leverage strong{font-size:13px;font-weight:650}
.dx-map-card{min-height:480px}.dx-map{height:390px;margin:22px 28px 12px;position:relative;border:1px solid #d7d4cb;border-radius:18px;background:linear-gradient(rgba(31,32,28,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(31,32,28,.045) 1px,transparent 1px),#fbfaf6;background-size:44px 44px;overflow:hidden}.dx-axis{position:absolute;background:#c9c6bd}.dx-axis-x{left:6%;right:6%;top:50%;height:1px}.dx-axis-y{top:7%;bottom:7%;left:50%;width:1px}.dx-axis-label{position:absolute;font-size:7px;letter-spacing:.1em;color:#aaa69d}.dx-left{left:10px;top:calc(50% + 8px)}.dx-right{right:10px;top:calc(50% + 8px)}.dx-top{left:calc(50% + 8px);top:9px}.dx-bottom{left:calc(50% + 8px);bottom:9px}.dx-archetype{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:6px;white-space:nowrap;color:#6f6c65;font-size:8px;letter-spacing:.05em}.dx-archetype i{width:7px;height:7px;border-radius:50%;border:1px solid #73716b;background:#f7f6f1}.dx-you{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);transition:left .5s cubic-bezier(.22,1,.36,1),top .5s cubic-bezier(.22,1,.36,1);display:flex;align-items:center;gap:8px;z-index:3}.dx-you i{width:15px;height:15px;border-radius:50%;background:var(--ink);box-shadow:0 0 0 6px rgba(18,19,17,.09)}.dx-you b{font-size:8px;letter-spacing:.12em;background:var(--ink);color:white;padding:5px 7px;border-radius:999px}.dx-map-note{margin:0 28px 22px;color:#8a877f;font-size:9px;line-height:1.45}
.dx-drivers{padding:8px 20px 20px}.dx-driver{display:grid;grid-template-columns:minmax(110px,175px) 1fr 42px;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #e1dfd8}.dx-driver:last-child{border-bottom:0}.dx-driver strong{font-size:10px;font-weight:650}.dx-driver-track{height:7px;background:#ebe9e2;border-radius:999px;position:relative;overflow:hidden}.dx-driver-track::after{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background:#bdbab1}.dx-driver-track i{position:absolute;top:0;height:100%;border-radius:999px;background:#6c8975}.dx-driver.negative .dx-driver-track i{background:#ae746b}.dx-driver em{font-style:normal;font-size:9px;text-align:right;color:#79766f}.dx-driver.positive em{color:#52715d}.dx-driver.negative em{color:#9b5f58}
.dx-map-card,.dx-state-card,.dx-drivers-card{transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s cubic-bezier(.22,1,.36,1)}.dx-map-card:hover,.dx-state-card:hover,.dx-drivers-card:hover{transform:translateY(-3px);box-shadow:0 18px 45px rgba(19,20,17,.06)}
.magnetic{will-change:transform;transition:transform .3s ease}

@media(max-width:980px){.explorer-head{grid-template-columns:1fr}.dx-shell{grid-template-columns:1fr}.dx-controls-card{position:static}.dx-controls{display:grid;grid-template-columns:1fr 1fr;gap:0 22px}.dx-factor:nth-last-child(2){border-bottom:0}.dx-map{height:350px}}
@media(max-width:760px){.diagnostic-transition{min-height:72svh}.scroll-ink{font-size:clamp(52px,15vw,82px);line-height:.85}.diagnostic-transition-foot{flex-direction:column;align-items:flex-start}.explorer-head{margin:34px 0}.explorer-head h2{font-size:clamp(48px,14vw,76px)}.dx-modebar{align-items:flex-start;flex-wrap:wrap;padding:8px 0 12px}.dx-mode{height:48px;padding:0 17px}.dx-mode:first-child{padding-left:0}.dx-mode-actions{width:100%;margin:0;padding-top:12px}.dx-read-map{flex:1;justify-content:space-between}.dx-controls{display:block}.dx-state-main{grid-template-columns:1fr;padding:22px}.dx-health{justify-content:flex-start}.dx-health span{font-size:62px}.dx-leverage{grid-template-columns:1fr;padding:14px 22px}.dx-map{height:310px;margin:16px 12px 10px}.dx-map-note{margin:0 14px 16px}.dx-driver{grid-template-columns:105px 1fr 34px;gap:8px}.dx-archetype{font-size:7px}.diagnostic-explorer{padding-bottom:78px}}
@media(prefers-reduced-motion:reduce){.dx-you,.dx-map-card,.dx-state-card,.dx-drivers-card,.magnetic{transition:none!important}}


/* =========================================================
   V13 — navigation, unbounded canvas, diagnostic impact, contact composer
   ========================================================= */
.header-actions{gap:7px}.header-cta{display:inline-flex;align-items:center;position:relative;padding:10px 30px 10px 14px;min-height:38px}.header-cta b{font:inherit;font-weight:700}.header-cta span{position:absolute;right:10px;top:6px;margin:0;font-size:10px;line-height:1;opacity:.68;transition:transform .25s ease,opacity .25s ease}.header-cta:hover span{transform:translate(2px,-2px);opacity:1}
@media(max-width:760px){.header-actions{gap:4px}.header-cta{padding:8px 18px 8px 8px;min-height:31px;font-size:7.8px}.header-cta span{right:6px;top:5px;font-size:8px}}
@media(max-width:440px){.brand-copy{display:none}.header-actions{gap:3px}.header-cta{font-size:7px;padding-left:7px;padding-right:15px}}
.node-canvas{cursor:grab}.node-canvas.is-panning{cursor:grabbing}
.dx-driver{grid-template-columns:minmax(115px,175px) 1fr 78px}.dx-driver-track{overflow:visible;background:#ebe9e2}.dx-driver-track i{border-radius:999px}.dx-driver-track .dx-boost{background:#63846f}.dx-driver-track .dx-penalty{background:#af7168}.dx-driver-values{display:flex;justify-content:flex-end;gap:6px;font-style:normal;font-size:8px;white-space:nowrap}.dx-driver-values .plus{color:#52715d}.dx-driver-values .minus{color:#9b5f58}.dx-driver-values .zero{color:#8a877f}.dx-driver-note{grid-column:1/-1;color:#8b877f;font-size:8px;line-height:1.35;margin-top:-5px;padding-left:0}
@media(max-width:760px){.dx-driver{grid-template-columns:100px 1fr 66px}.dx-driver-values{font-size:7px}}
.collab-stage{position:relative;min-height:410px;overflow:hidden}.collab-list,.contact-composer{transition:opacity .45s cubic-bezier(.22,1,.36,1),transform .55s cubic-bezier(.22,1,.36,1),visibility .45s}.collab-list.is-visible{opacity:1;transform:translateX(0);visibility:visible}.collab-list.is-hidden{opacity:0;transform:translateX(-28px);visibility:hidden;pointer-events:none}.contact-composer{position:absolute;inset:0;opacity:0;transform:translateX(36px);visibility:hidden;pointer-events:none;border-top:1px solid #3a3d39;padding-top:8px}.contact-composer.is-visible{opacity:1;transform:translateX(0);visibility:visible;pointer-events:auto}.conversation-trigger{border:0;cursor:pointer;font-family:inherit}.composer-head{display:flex;align-items:flex-start;justify-content:space-between;padding:20px 0 25px;border-bottom:1px solid #3a3d39}.composer-head span,.contact-composer label>span{font-size:8px;letter-spacing:.14em;color:#757b76}.composer-head h3{font-family:var(--display);font-size:clamp(34px,3vw,54px);line-height:.94;letter-spacing:-.045em;margin:8px 0 0;font-weight:500}.composer-head button{border:1px solid #4b504b;background:transparent;color:#aeb3ae;border-radius:50%;width:34px;height:34px;cursor:pointer;font-size:20px}.composer-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}.contact-composer label{display:block}.contact-composer input,.contact-composer select,.contact-composer textarea{width:100%;border:0;border-bottom:1px solid #454a45;background:transparent;color:#f2f3f0;padding:10px 0 12px;font:500 13px/1.35 Arial,sans-serif;outline:none;border-radius:0}.contact-composer textarea{resize:vertical;min-height:130px}.contact-composer input:focus,.contact-composer select:focus,.contact-composer textarea:focus{border-color:var(--lime)}.contact-composer select{color:#d9ddd9}.contact-composer option{background:#171815;color:#fff}.composer-topic,.composer-message{margin-top:18px}.composer-actions{display:flex;align-items:center;gap:16px;margin-top:22px}.composer-send{border:0;border-radius:999px;background:var(--lime);color:#11130f;padding:12px 15px;font-weight:800;cursor:pointer;display:inline-flex;align-items:center;gap:18px}.composer-send[disabled]{opacity:.6;cursor:wait}.composer-actions small{font-size:8px;color:#707670}.composer-status{min-height:16px;margin:14px 0 0;font-size:11px;line-height:1.4;color:#cdd2cd}.composer-status.is-error{color:#efb3b3}.composer-status.is-success{color:#bde3c2}.composer-hp{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important}
@media(max-width:760px){.collab-stage{min-height:520px}.composer-grid{grid-template-columns:1fr}.composer-head h3{font-size:38px}}


/* =========================================================
   V14 — opening polish + derived impact model
   ========================================================= */
.hero-v2 .hero-statement{margin-top:clamp(18px,3.2vh,38px)}
.hero-v2 .hero-title{
  text-shadow:0 8px 28px rgba(18,20,17,.055),0 1px 0 rgba(255,255,255,.48);
}
.hero-v2 .outline-word{
  filter:drop-shadow(0 7px 16px rgba(18,20,17,.045));
}
.header-cta span{
  font-weight:900;
  -webkit-text-stroke:.42px currentColor;
  text-shadow:0 0 .01px currentColor;
  font-size:11px;
}
.hero-principles h2{font-size:18px;letter-spacing:-.028em}
.hero-principles p{font-size:12px;line-height:1.47;color:#6f6d67}
.dx-drivers{position:relative}
.dx-driver{grid-template-columns:minmax(130px,190px) 1fr 88px;align-items:center;column-gap:13px}
.dx-driver>strong{font-size:10px;line-height:1.15;letter-spacing:-.005em}
.dx-driver-track{
  position:relative;
  height:8px;
  background:linear-gradient(90deg,#f0e6e3 0 49.5%,#d7d4cc 49.5% 50.5%,#e4ece6 50.5% 100%);
  border-radius:999px;
}
.dx-driver-track::after{content:'';position:absolute;left:50%;top:-3px;bottom:-3px;width:1px;background:#8e8a82;opacity:.65}
.dx-driver-track i{position:absolute;top:0;height:100%;min-width:0}
.dx-driver-track .dx-penalty{background:#ad6d63;border-radius:999px 0 0 999px}
.dx-driver-track .dx-boost{background:#5f806c;border-radius:0 999px 999px 0}
.dx-driver-values{min-width:88px;justify-content:flex-start;gap:8px}
.dx-driver-note{font-size:8.5px;color:#858178;margin-top:-2px;line-height:1.35}
@media(max-width:760px){
  .hero-v2 .hero-statement{margin-top:18px}
  .hero-principles h2{font-size:15px}
  .hero-principles p{font-size:11px}
  .header-cta span{font-size:9px;-webkit-text-stroke:.32px currentColor}
  .dx-driver{grid-template-columns:104px 1fr 64px;column-gap:8px}
  .dx-driver>strong{font-size:8.5px}
  .dx-driver-values{min-width:64px;font-size:7px;gap:4px}
  .dx-driver-note{font-size:7.5px}
}


/* =========================================================
   V15 — focused hero glow + final CTA emphasis
   ========================================================= */
/* Keep the headline itself perfectly clean. */
.hero-v2 .hero-title{
  text-shadow:none;
}
/* "see the system." gets a soft under-glow, not a letter shadow. */
.hero-v2 .outline-word{
  position:relative;
  display:inline-block;
  filter:none;
  isolation:isolate;
}
.hero-v2 .outline-word::after{
  content:"";
  position:absolute;
  z-index:-1;
  left:7%;
  right:4%;
  bottom:.015em;
  height:.11em;
  border-radius:999px;
  background:linear-gradient(90deg,rgba(27,29,25,0),rgba(127,152,190,.12) 22%,rgba(127,152,190,.22) 54%,rgba(201,185,144,.11) 82%,rgba(27,29,25,0));
  filter:blur(.11em);
  transform:translateY(.10em) scaleX(.96);
  opacity:.72;
  pointer-events:none;
}
/* The final action is the strongest visual CTA. */
.header-actions .header-cta-primary{
  background:var(--ink);
  color:var(--white);
  border-color:var(--ink);
}
@media(max-width:760px){
  .hero-v2 .outline-word::after{height:.10em;filter:blur(.11em);opacity:.5}
}

/* =========================================================
   V16 — correctness, accessibility and diagnostic clarity
   ========================================================= */
:where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:2px solid #624bc4;
  outline-offset:3px;
}
:where(.lab-shell,.collaborate) :where(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline-color:var(--lime);
}
.canvas-node:focus-visible{border-color:var(--lime);box-shadow:0 0 0 1px var(--lime),0 15px 40px rgba(0,0,0,.28)}

/* Keep the connector visually small while making the hit target usable. */
.connector{
  right:-13px;
  width:26px;
  height:26px;
  border:0;
  background:transparent;
  display:grid;
  place-items:center;
}
.connector::after{
  content:"";
  width:11px;
  height:11px;
  border:2px solid var(--lime);
  border-radius:50%;
  background:#101210;
}
.connector.awaiting{box-shadow:none}
.connector.awaiting::after{box-shadow:0 0 0 5px rgba(200,255,61,.15)}

.diagnostic-column{min-width:0}
.diagnostic-subhead{font-size:8px;letter-spacing:.15em;color:#626a63;margin-bottom:18px}
.dimension.unknown .dimension-head{color:#6b726c}
.dimension.unknown .dimension-head b{color:#747b75}
.dimension.unknown .dimension-track{background:repeating-linear-gradient(90deg,#2b302c 0 5px,transparent 5px 9px)}

/* Collaboration rows are real controls in V16, not click-looking articles. */
button.collab-row{
  width:100%;
  background:transparent;
  color:inherit;
  border-left:0;
  border-right:0;
  border-top:0;
  text-align:left;
  font:inherit;
  cursor:pointer;
}
button.collab-row:focus-visible{padding-left:14px;color:var(--lime)}

.dx-factor-state{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.dx-factor-state i{font-style:normal;font-size:7px;letter-spacing:.08em;color:#325c45;background:#dbe8dd;border:1px solid #bdd1c1;border-radius:999px;padding:4px 6px}
.dx-factor.from-map{background:linear-gradient(90deg,rgba(70,130,89,.045),transparent 78%)}
.dx-factor.from-map .dx-factor-head strong::after{content:"inferred";display:block;margin-top:3px;font-size:7px;letter-spacing:.08em;text-transform:uppercase;color:#8c918a;font-weight:500}

@media(max-width:760px){
  .header-cta{min-height:38px;font-size:8.5px;padding-top:8px;padding-bottom:8px}
  .diagnostic-transition{min-height:58svh}
  .connector{right:-15px;width:30px;height:30px}
  .diagnostic-subhead{margin-bottom:14px}
}
@media(max-width:440px){
  .site-header{padding-left:10px;padding-right:10px}
  .header-actions{gap:3px}
  .header-cta{min-height:38px;padding:8px 17px 8px 7px;font-size:8px}
  .header-cta b{font-size:0}
  .header-cta b::after{content:attr(data-short);font-size:8px;letter-spacing:.01em}
  .header-cta span{right:6px;top:7px}
}
@media(max-width:340px){
  .brand-mark{width:29px;height:29px}
  .header-cta{padding-left:6px;padding-right:14px}
  .header-cta b::after{font-size:7.5px}
}

/* V16 responsive containment: motion must never widen the document. */
.hero-v2{overflow-x:clip}
@media(max-width:760px){
  .header-cta{min-height:44px}
  .contact-composer{transform:translateY(18px)}
  .contact-composer.is-visible{transform:translateY(0)}
}

/* =========================================================
   V17 — richer opening: diagnostic path visual + domain rail
   Only the visible landing composition changes. The existing
   operating-principles row and everything below it are preserved.
   ========================================================= */
:root{
  --hero-accent:#7b95bc;
  --hero-accent-strong:#506a90;
  --hero-accent-soft:rgba(123,149,188,.16);
  --hero-accent-glow:rgba(123,149,188,.28);
  --hero-warm-accent:rgba(198,184,146,.14);
}
.hero-v2{
  padding-top:94px;
  padding-bottom:24px;
  display:block;
  overflow-x:clip;
}
.hero-opening{
  min-height:calc(100svh - 118px);
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  align-content:stretch;
}
.hero-v2 .hero-meta{
  min-height:31px;
  align-items:flex-start;
  position:relative;
}
.hero-v2 .hero-meta span{
  position:relative;
  padding-left:56px;
}
.hero-v2 .hero-meta span::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:34px;
  height:1px;
  background:linear-gradient(90deg,rgba(17,17,15,.22),var(--hero-accent-strong));
  transform:translateY(-50%);
}
.hero-v2 .hero-statement{
  display:grid;
  grid-template-columns:minmax(0,1.06fr) minmax(440px,.94fr);
  gap:clamp(24px,3.7vw,64px);
  align-items:start;
  margin:0;
  padding:clamp(26px,4vh,52px) 0 clamp(22px,3.3vh,42px);
  min-height:0;
}
.hero-v2 .hero-title{
  max-width:850px;
  font-size:clamp(58px,6.15vw,104px);
  line-height:.86;
  letter-spacing:-.066em;
  margin-top:-10px;
}
.hero-path-visual{
  position:relative;
  min-height:clamp(390px,51vh,590px);
  margin-top:0;
  align-self:stretch;
  overflow:hidden;
  isolation:isolate;
  filter:drop-shadow(0 20px 36px rgba(17,17,15,.035));
}
.hero-path-visual::before{
  content:"";
  position:absolute;
  inset:5% 0 3% 3%;
  background-image:
    linear-gradient(rgba(17,17,15,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(17,17,15,.045) 1px,transparent 1px);
  background-size:92px 92px;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 15%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 15%,#000 100%);
  z-index:-3;
}
.hero-path-field{
  position:absolute;
  width:72%;
  aspect-ratio:1;
  right:-8%;
  top:5%;
  border-radius:50%;
  opacity:.45;
  z-index:-2;
  background:
    radial-gradient(circle at 48% 44%,var(--hero-accent-soft) 0 16%,transparent 40%),
    radial-gradient(circle at 64% 34%,var(--hero-warm-accent) 0 10%,transparent 26%),
    repeating-radial-gradient(circle at 50% 50%,transparent 0 18px,rgba(17,17,15,.06) 19px,transparent 20px 35px);
  filter:blur(.05px);
  animation:heroFieldDrift 18s ease-in-out infinite alternate;
}
.hero-path-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hero-contours path{fill:none;stroke:#9a9891;stroke-width:1.05;opacity:.82}
.hero-guide-lines line{stroke:#a8adb7;stroke-width:1;stroke-dasharray:4 6;opacity:.44}
.hero-main-path{fill:none;stroke-linecap:round}
.hero-main-path-shadow{stroke:#11110f;stroke-width:8;opacity:.03;filter:url(#softGlow)}
.hero-main-path-line{stroke:url(#pathFade);stroke-width:2.55;stroke-dasharray:10 7;animation:heroPathTravel 14.5s linear infinite}
.hero-path-node .halo{fill:none;stroke:#11110f;stroke-width:1;opacity:.10}
.hero-path-node .ring{fill:rgba(247,243,235,.92);stroke:#11110f;stroke-width:1;opacity:.82}
.hero-path-node .core{fill:#11110f;filter:url(#softGlow)}
.hero-path-node.n2 .halo,.hero-path-node.n5 .halo{stroke:var(--hero-accent-strong);opacity:.18;animation:heroSignalPulse 3.8s ease-in-out infinite}
.hero-path-node.n2 .ring,.hero-path-node.n5 .ring{stroke:var(--hero-accent-strong);stroke-width:1.15}
.hero-path-node.n2 .core{fill:var(--hero-accent)}
.hero-path-node.n5 .core{fill:var(--hero-accent-strong)}
.hero-path-node.n1 .halo{opacity:.07}
.hero-path-tracer{opacity:1}
.hero-path-orb-glow{fill:var(--hero-accent-glow);opacity:.88;filter:blur(1.45px)}
.hero-path-orb{fill:var(--hero-accent-strong);filter:drop-shadow(0 0 7px rgba(123,149,188,.58))}
.hero-path-node{transform-box:fill-box;transform-origin:center;animation:heroNodeBreathe 5.4s ease-in-out infinite}
.hero-path-node.n2{animation-delay:-.8s}.hero-path-node.n3{animation-delay:-1.6s}.hero-path-node.n4{animation-delay:-2.4s}.hero-path-node.n5{animation-delay:-3.2s}
.hero-path-specks circle{fill:#11110f;opacity:.56;animation:heroSpeck 7.6s ease-in-out infinite alternate}
.hero-path-specks circle:nth-child(2n){fill:var(--hero-accent-strong);opacity:.48}
.hero-path-specks circle:nth-child(3n){animation-delay:-1.8s}.hero-path-specks circle:nth-child(3n+1){animation-delay:-3.6s}
.hero-path-label{position:absolute;font-size:9px;font-weight:800;letter-spacing:.17em;white-space:nowrap;color:#191915;background:rgba(247,243,235,.84);padding:2px 6px;border-radius:999px;backdrop-filter:blur(2px)}
.hero-path-label.l2,.hero-path-label.l5{color:var(--hero-accent-strong);font-weight:900}
.hero-path-label.l1{left:5.2%;top:77%;transform:translateY(-50%)}
.hero-path-label.l2{left:34.5%;top:54.5%;transform:translateY(-50%)}
.hero-path-label.l3{left:53.5%;top:30.5%;transform:translateY(-50%)}
.hero-path-label.l4{left:70.5%;top:63%;transform:translateY(-50%)}
.hero-path-label.l5{right:1.2%;top:9.5%;transform:none}
.hero-path-caption{position:absolute;right:1.5%;bottom:18%;font-size:8px;line-height:1.55;letter-spacing:.16em;color:#66645d;display:flex;gap:11px;align-items:flex-start;opacity:.94}
.hero-path-caption i{display:block;width:24px;height:1px;background:linear-gradient(90deg,var(--hero-accent-strong),#77746c);margin-top:6px}
.hero-domains{
  position:relative;
  width:100%;
  overflow:hidden;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  min-height:45px;
  display:flex;
  align-items:center;
  background:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(123,149,188,.03) 24%,rgba(255,255,255,0) 50%,rgba(198,184,146,.03) 76%,rgba(255,255,255,0) 100%);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 3.5%,#000 96.5%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 3.5%,#000 96.5%,transparent 100%);
}
.hero-domains-track{display:flex;width:max-content;will-change:transform;animation:heroDomainRail 42s linear infinite}
.hero-domains-group{display:flex;align-items:center;flex:none}
.hero-domains-group span{position:relative;display:flex;align-items:center;white-space:nowrap;padding:0 28px;font-size:10px;color:#595955;letter-spacing:-.01em;transition:color .28s ease,transform .28s ease}
.hero-domains-group span::after{content:"";position:absolute;right:0;width:1px;height:18px;background:linear-gradient(180deg,rgba(127,152,190,.14),var(--line),rgba(127,152,190,.14))}
.hero-v2 .hero-principles{margin-top:0}
.hero-v2 .hero-flow{margin-top:0}

@keyframes heroPathTravel{to{stroke-dashoffset:-170}}
@keyframes heroNodeBreathe{0%,100%{opacity:.9}50%{opacity:1}}
@keyframes heroSignalPulse{0%,100%{opacity:.12;transform:scale(1)}50%{opacity:.24;transform:scale(1.06)}}
@keyframes heroSpeck{0%{transform:translate3d(0,0,0);opacity:.38}100%{transform:translate3d(0,-6px,0);opacity:.82}}
@keyframes heroFieldDrift{0%{transform:translate3d(0,0,0) scale(.98)}100%{transform:translate3d(-14px,10px,0) scale(1.025)}}
@keyframes heroDomainRail{to{transform:translateX(-50%)}}

/* V17.6.6 — tracer arrival feedback */
.hero-path-node.is-hit .halo{animation:heroArrivalHalo .92s cubic-bezier(.22,1,.36,1) both!important}
.hero-path-node.is-hit .ring{animation:heroArrivalRing .72s cubic-bezier(.22,1,.36,1) both!important}
.hero-path-node.is-hit .core{animation:heroArrivalCore .62s cubic-bezier(.22,1,.36,1) both!important}
.hero-path-label.is-hit{animation:heroArrivalLabel .82s ease-out both}
@keyframes heroArrivalHalo{0%{opacity:.10;stroke-width:1}34%{opacity:.42;stroke-width:1.5}100%{opacity:.10;stroke-width:1}}
@keyframes heroArrivalRing{0%{opacity:.76;stroke-width:1;transform:scale(.92)}38%{opacity:1;stroke-width:1.7;transform:scale(1.11)}100%{opacity:.82;stroke-width:1;transform:scale(1)}}
@keyframes heroArrivalCore{0%{transform:scale(.9)}36%{transform:scale(1.65)}100%{transform:scale(1)}}
@keyframes heroArrivalLabel{0%,100%{filter:none;transform:var(--hero-label-transform,translateY(-50%))}36%{filter:drop-shadow(0 0 8px rgba(81,105,141,.28));color:#11110f}}
.hero-path-label.l1,.hero-path-label.l2,.hero-path-label.l3,.hero-path-label.l4{--hero-label-transform:translateY(-50%)}
.hero-path-label.l5{--hero-label-transform:none}

@media(max-width:1180px){
  .hero-v2 .hero-statement{grid-template-columns:minmax(0,1fr) minmax(360px,.82fr);gap:22px}
  .hero-v2 .hero-title{font-size:clamp(56px,6.7vw,88px)}
  .hero-path-label{font-size:8px}.hero-path-caption{display:none}
}
@media(max-width:900px){
  .hero-opening{min-height:auto}
  .hero-v2 .hero-statement{grid-template-columns:1fr;gap:8px;padding-top:28px}
  .hero-v2 .hero-title{max-width:880px;font-size:clamp(62px,10.4vw,92px)}
  .hero-path-visual{min-height:430px}
  .hero-path-visual::before{background-size:76px 76px}
  .hero-path-label.l1{left:4%;top:78%}.hero-path-label.l2{left:33%;top:54%}.hero-path-label.l3{left:52%;top:30%}.hero-path-label.l4{left:69%;top:62%}
}
@media(max-width:760px){
  .hero-v2{padding-top:78px;padding-bottom:18px}
  .hero-opening{min-height:calc(100svh - 96px)}
  .hero-v2 .hero-meta{min-height:24px;font-size:7.5px;margin:0}
  .hero-v2 .hero-meta span{padding-left:38px}
  .hero-v2 .hero-meta span::before{width:22px}
  .hero-v2 .hero-statement{display:grid;grid-template-columns:1fr;align-content:center;gap:6px;padding:12px 0 10px}
  .hero-v2 .hero-title{font-size:clamp(49px,14vw,72px);line-height:.87;max-width:690px;margin-top:-4px}
  .hero-path-visual{min-height:clamp(245px,35vh,330px)}
  .hero-path-visual::before{inset:0;background-size:55px 55px}
  .hero-path-label{font-size:6.7px;letter-spacing:.13em}
  .hero-path-caption{display:none}
  .hero-domains{min-height:39px;margin-top:6px}
  .hero-domains-group span{padding:0 19px;font-size:9px}
  .hero-domains-group span::after{height:15px}
  .hero-domains-track{animation-duration:35s}
  .hero-v2 .hero-principles{margin-top:0}
}
@media(max-width:440px){
  .hero-opening{min-height:calc(100svh - 82px)}
  .hero-v2 .hero-statement{padding-top:8px}
  .hero-v2 .hero-title{font-size:clamp(46px,14vw,62px);margin-top:0}
  .hero-path-visual{min-height:240px;margin-left:-5px;margin-right:-5px}
  .hero-path-label.l1{left:2%;top:78%}.hero-path-label.l2{left:31%;top:55%}.hero-path-label.l3{left:50%;top:30%}.hero-path-label.l4{left:65%;top:62%}.hero-path-label.l5{right:0;top:8%}
  .hero-domains{margin-left:calc(var(--pad) * -1);margin-right:calc(var(--pad) * -1);width:calc(100% + (var(--pad) * 2));-webkit-mask-image:none;mask-image:none}
}
@media(prefers-reduced-motion:reduce){
  /* Keep the hero alive, but substantially slow and soften the only two
     continuous motions. Other decorative motion remains disabled. */
  .hero-main-path-line{animation:heroPathTravel 38s linear infinite!important}
  .hero-path-node,.hero-path-specks circle,.hero-path-field{animation:none!important}
  .hero-domains-track{animation:heroDomainRail 96s linear infinite!important}
  .hero-path-tracer{display:block;opacity:.62}
  .hero-path-orb-glow{opacity:.42}
  .hero-domains{overflow:hidden;scrollbar-width:none}
  .hero-domains::-webkit-scrollbar{display:none}
  .hero-domains-group[aria-hidden="true"]{display:flex}
}

/* =========================================================
   V17.1 — first-viewport composition
   On desktop/laptop heights, keep the domain rail and all three
   operating-principle cards inside the initial viewport.
   ========================================================= */
@media(min-width:901px){
  .hero-opening{
    min-height:calc(100svh - 246px);
  }
  .hero-v2 .hero-title{
    position:relative;
    top:6px;
  }
}

/* =========================================================
   V17.4.2 — edge interaction regression fix
   The transformed canvas world must not mask SVG connection hit paths.
   Nodes remain fully interactive while empty world space passes pointer
   events through to the edge hit layer beneath it.
   ========================================================= */
.canvas-world{pointer-events:none}
.canvas-world .canvas-node{pointer-events:auto}


/* =========================================================
   V17.6.1 — mobile board gestures
   One finger: node drag; empty canvas is handed back to page scroll on mobile.
   Two fingers: pinch zoom + translate.
   ========================================================= */
.node-canvas{
  touch-action:none;
  overscroll-behavior:contain;
  -webkit-user-select:none;
  user-select:none;
}
.canvas-node,.canvas-node *{touch-action:none}
.node-canvas.is-pinching{cursor:grabbing}
@media(max-width:820px){
  .canvas-zoom{top:calc(7px + env(safe-area-inset-top));right:7px}
  .canvas-zoom button{touch-action:manipulation}
  .mobile-canvas-actions{bottom:calc(8px + env(safe-area-inset-bottom))}
  .mobile-canvas-actions button{touch-action:manipulation}
}

/* =========================================================
   V17.6.2 — mobile header, mobile-native map behavior, footer polish
   ========================================================= */
.brand-mark{
  overflow:hidden;
}
.brand-mark svg{
  width:19px;
  height:19px;
  display:block;
  fill:none;
  stroke:var(--paper2);
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.brand-mark svg circle{
  fill:var(--lime);
  stroke:none;
}

@media(max-width:820px){
  /* One-finger empty-canvas gesture scrolls the page; nodes remain draggable. */
  .node-canvas{
    touch-action:pan-y;
    overscroll-behavior:auto;
  }
  .canvas-node,.canvas-node *{touch-action:none}
}

@media(max-width:760px){
  .site-header{
    grid-template-columns:minmax(0,1fr) auto;
    gap:7px;
    padding:8px 8px;
  }
  .brand{
    min-width:0;
    gap:6px;
  }
  .brand-mark{
    flex:0 0 30px;
    width:30px;
    height:30px;
    border-radius:50%;
    box-shadow:0 0 0 1px rgba(17,17,15,.08),0 5px 16px rgba(17,17,15,.08);
  }
  .brand-mark svg{width:18px;height:18px}
  .brand-copy{
    display:block!important;
    min-width:0;
    font-size:7.8px;
    line-height:1;
    letter-spacing:.055em;
    white-space:nowrap;
  }
  .brand-copy em{
    display:inline!important;
    font-size:7.2px;
  }
  .header-actions{
    gap:3px;
    min-width:0;
  }
  .header-cta{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:30px;
    height:30px;
    padding:0 9px!important;
    border-radius:999px;
    font-size:0!important;
    line-height:1;
    white-space:nowrap;
  }
  .header-cta b{
    font-size:0!important;
    line-height:1;
  }
  .header-cta b::after{
    content:attr(data-short);
    font-size:7.7px;
    font-weight:800;
    letter-spacing:.005em;
  }
  .header-cta span{display:none}
  .header-cta-primary{min-width:43px}

  /* The section label above Explorer is intentionally removed in HTML;
     tighten the resulting opening space. */
  .explorer-inner{padding-top:24px}
  .explorer-head{margin-top:22px}

  /* Keep the closing statement readable as a statement, not oversized crop. */
  .footer-word{
    display:block;
    max-width:100%;
    margin:68px 0 54px;
    font-size:clamp(58px,18.8vw,82px);
    line-height:.78;
    letter-spacing:-.065em;
    overflow:visible;
  }
  .footer-bottom{
    gap:10px;
    flex-direction:row;
    align-items:flex-end;
    justify-content:space-between;
    font-size:7.6px;
    line-height:1.35;
  }
  .footer-bottom span:last-child{text-align:right}
}

@media(max-width:360px){
  .site-header{gap:4px;padding-left:6px;padding-right:6px}
  .brand{gap:5px}
  .brand-mark{flex-basis:29px;width:29px;height:29px}
  .brand-copy{font-size:7.1px;letter-spacing:.035em}
  .brand-copy em{font-size:6.7px}
  .header-actions{gap:2px}
  .header-cta{height:29px;min-height:29px;padding:0 7px!important}
  .header-cta b::after{font-size:7.05px}
  .footer-word{font-size:clamp(56px,18.4vw,68px)}
}

/* =========================================================
   V17.6.3 — reliable top anchor + unbounded mobile node drag
   ========================================================= */
.top-anchor{
  position:absolute;
  top:0;
  left:0;
  width:1px;
  height:1px;
  pointer-events:none;
}

/* =========================================================
   V17.6.4 — mobile legibility + contact completion + score tone
   ========================================================= */
.dx-health span{
  transition:color .35s ease,text-shadow .35s ease;
}

@media(max-width:760px){
  /* Samsung/Chrome renders thick transparent text strokes too heavily.
     Keep the outlined idea, but make it clean on high-DPI mobile screens. */
  .hero-v2 .outline-word{
    -webkit-text-stroke:.85px var(--ink);
    font-weight:600;
    text-shadow:none;
    -webkit-font-smoothing:antialiased;
  }
  .hero-v2 .outline-word::after{
    display:none;
  }

  /* The mapper controls need to read as real controls, not faint microcopy. */
  .canvas-toolbar{
    min-height:116px;
    padding:9px 9px 10px;
    gap:7px;
  }
  .lens-cluster{width:100%}
  .lens-tabs{
    gap:4px;
    padding:4px;
    background:#171a18;
    border:1px solid #2e332f;
  }
  .lens{
    min-height:34px;
    padding:7px 6px;
    font-size:10.5px;
    font-weight:700;
    color:#bcc2bc;
  }
  .lens.active{
    background:#303630;
    color:#fff;
    box-shadow:inset 0 0 0 1px rgba(200,255,61,.14);
  }
  .lens-context{
    margin-top:5px;
    color:#8f968f;
    font-size:8.5px;
  }
  .toolbar-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
  }
  .toolbar-actions button{
    min-width:0;
    min-height:36px;
    padding:7px 8px!important;
    border:1px solid #303531;
    border-radius:8px;
    background:#171a18;
    color:#d9ded9;
    font-size:10px!important;
    font-weight:650;
    line-height:1.15;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
  }
  .toolbar-actions button:disabled{color:#777e78}
  .toolbar-actions .run-btn{
    grid-column:1/-1!important;
    min-height:40px;
    background:var(--lime);
    border-color:var(--lime);
    color:#101210;
    font-size:10.5px!important;
  }

  /* When the composer opens, let the full form grow instead of clipping
     the final Send message action below the fixed mobile stage height. */
  .collab-stage:has(.contact-composer.is-visible){
    min-height:700px;
    overflow:visible;
  }
  .contact-composer.is-visible{
    min-height:680px;
    overflow:visible;
  }
  .composer-actions{
    display:flex!important;
    align-items:center;
    flex-wrap:wrap;
    margin-top:20px;
  }
  .composer-send{
    min-height:46px;
    padding:13px 18px;
    font-size:12px;
  }
  .composer-actions small{font-size:9px}
}

@media(max-width:380px){
  .canvas-toolbar{min-height:120px;padding-left:7px;padding-right:7px}
  .lens{font-size:10px}
  .toolbar-actions button{font-size:9.5px!important;padding-left:6px!important;padding-right:6px!important}
}
@media(max-width:760px){
  .collab-stage:has(.contact-composer.is-visible){min-height:750px}
  .contact-composer.is-visible{min-height:720px}
}


/* V17.6.8 — contact + LinkedIn dual path */
.composer-actions{flex-wrap:wrap}
.composer-linkedin{display:inline-flex;align-items:center;gap:9px;min-height:40px;padding:9px 13px;border:1px solid #4b504b;border-radius:999px;color:#e6e9e5;text-decoration:none;font:700 10px/1 Arial,sans-serif;letter-spacing:.02em;transition:border-color .2s ease,background .2s ease,color .2s ease,transform .2s ease}
.composer-linkedin:hover,.composer-linkedin:focus-visible{border-color:var(--lime);background:rgba(206,255,0,.07);color:#fff;transform:translateY(-1px)}
.linkedin-glyph{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:5px;background:var(--lime);color:#11130f;font:900 11px/1 Arial,sans-serif;letter-spacing:-.04em}
.composer-linkedin i{font-style:normal;color:var(--lime);margin-left:2px}
.footer-linkedin{display:inline-flex;align-items:center;gap:7px;color:inherit;text-decoration:none;border-bottom:1px solid rgba(0,0,0,.22);padding-bottom:2px;transition:opacity .2s ease,border-color .2s ease,transform .2s ease}
.footer-linkedin:hover,.footer-linkedin:focus-visible{opacity:.66;border-color:#111;transform:translateY(-1px)}
.footer-linkedin span{font-size:11px}
@media(max-width:760px){
  .composer-actions{align-items:stretch;gap:10px}
  .composer-linkedin{justify-content:center;width:100%;min-height:44px}
  .composer-actions small{width:100%;text-align:center}
  .footer-linkedin{align-self:flex-start}
}

/* V17.7.0 — final production polish */
@media (min-width:821px){
  .composer-send,.composer-linkedin{box-sizing:border-box;min-height:42px;height:42px;display:inline-flex;align-items:center;justify-content:center}
  .composer-send{padding-top:0;padding-bottom:0}
  .composer-linkedin{padding-top:0;padding-bottom:0}
}
