/* Navigation joints are tied to measured coordinates in the displayed video. */
body[data-state=home] .hero-product-hint{display:none!important}
body[data-state=home] .art{width:70vw;right:0;top:50%;transform-origin:65% 45%}
body[data-state=home] .art>video,body[data-state=home] .art>.still{filter:saturate(.72) contrast(1.04) brightness(1.015)}
body[data-finish=original][data-state=home] .art>video,body[data-finish=original][data-state=home] .art>.still{filter:none}
.dna-navigation{position:absolute;inset:0;z-index:7;pointer-events:none}
.dna-tethers{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.dna-tethers path{stroke:#6a9680;stroke-width:1;fill:none;opacity:.6;transition:stroke .25s,stroke-width .25s}
.dna-tethers circle{fill:#f6f5ef;stroke:#54876d;stroke-width:1.1}
.dna-tethers .joint-inner{fill:#467e62;stroke:none}
.dna-tethers .joint-halo{fill:none;stroke:#8daf98;stroke-width:.8;opacity:.4}
.dna-tethers g.is-active path{stroke:#2d6f50;stroke-width:1.5;opacity:1}
.dna-tethers g.is-active .joint-halo{stroke:#3a8c64;stroke-width:1.3;opacity:1}
.dna-nav-label{position:absolute;text-align:left;pointer-events:auto;min-width:154px;min-height:56px;padding:7px 16px 8px 0;color:#325b46;text-shadow:0 1px 8px #f6f5ef;will-change:transform}
.dna-nav-label small{display:block;font-size:8px;letter-spacing:.08em;color:#78927f;margin-bottom:6px}
.dna-nav-label strong{display:inline-block;font-size:19px;font-weight:500;line-height:1.4}
.dna-nav-label .nav-arrow{font-size:13px;margin-left:18px;display:inline-block;transition:transform .2s}
.dna-nav-label:hover .nav-arrow,.dna-nav-label:focus-visible .nav-arrow{transform:translate(3px,-2px)}
.dna-nav-label .nav-rule{display:block;position:absolute;bottom:0;left:0;right:6px;height:1px;background:linear-gradient(90deg,#69967c,#90b09920)}
.dna-nav-label[aria-expanded=true] strong{color:#145332}
.dna-joint-button{position:absolute;width:44px;height:44px;transform:translate(-50%,-50%);border-radius:50%;pointer-events:auto;background:transparent;opacity:0}
.dna-joint-button:focus-visible{opacity:1;border:1px solid #3f8765;outline-offset:2px}
.nav-ledger{position:absolute;right:6%;bottom:8%;color:#6c8471;font-size:9px;letter-spacing:.08em;z-index:8;display:flex;align-items:center;gap:16px}
.nav-ledger span{color:#365b43;font-variant-numeric:tabular-nums}
.nav-ledger i{display:inline-block;width:3px;height:3px;border-radius:50%;background:#7c9981}
body:not([data-state=home]) .dna-navigation,body:not([data-state=home]) .nav-ledger,body:not([data-state=home]) .dna-directory{display:none!important}
.dna-directory{position:absolute;left:6%;top:18%;width:31%;max-width:420px;max-height:66%;z-index:9;background:linear-gradient(90deg,#f6f5effa 80%,#f6f5ef00);padding:0 25px 0 0;display:flex;flex-direction:column}
.dna-directory .directory-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #96b49f;padding-bottom:15px}
.directory-head small{font-size:9px;letter-spacing:.08em;color:#78947e}
.directory-head h2{font-size:34px;font-weight:500;margin:8px 0 0;color:#1e432f}
.directory-head button{font-size:24px;padding:7px;align-self:flex-start}
.dna-directory>p{font-size:11px;line-height:1.8;color:#758b77;margin:18px 0}
.directory-products{overflow-y:auto;scrollbar-width:thin;scrollbar-color:#9eb5a1 transparent;min-height:0;overscroll-behavior:contain}
.directory-products::-webkit-scrollbar{width:3px}
.directory-products button{display:grid;grid-template-columns:1fr auto;width:100%;text-align:left;gap:6px;padding:14px 2px;border-bottom:1px solid #becdbc85}
.directory-products button:hover{background:#e9eee580}
.directory-products strong{font-size:15px;font-weight:500}
.directory-products small{font-size:9px;color:#7c907d;grid-row:2}
.directory-products span{grid-column:2;grid-row:1/3;align-self:center;font-size:15px}
body[data-dna-directory=true] #intro,body[data-dna-directory=true] .home-scroll{visibility:hidden;pointer-events:none}
body[data-dna-directory=true] .dna-nav-label:not([aria-expanded=true]){color:#7e9585}
@media(max-width:1000px) and (min-width:651px){.dna-nav-label{min-width:135px}.dna-nav-label strong{font-size:17px}.dna-directory{width:37%}}
@media(max-width:650px){body[data-state=home] .art{width:135vw;right:-27vw;top:70%}.dna-nav-label{min-width:123px;min-height:45px;padding:4px 0}.dna-nav-label strong{font-size:15px}.dna-nav-label small{font-size:7px;margin-bottom:3px}.dna-nav-label .nav-arrow{font-size:11px;margin-left:11px}.nav-ledger{bottom:3%;left:7%;right:auto;font-size:8px;gap:10px}body[data-state=home] .home-scroll{display:none}.dna-directory{left:7%;top:9%;width:86%;max-width:none;height:42%;max-height:none;padding:0;background:#f6f5eff5}.directory-head h2{font-size:25px}.dna-directory .directory-head{padding-bottom:8px}.dna-directory>p{font-size:10px;margin:9px 0}.directory-products button{padding:9px 2px}.directory-products strong{font-size:13px}.directory-products small{font-size:8px}.dna-nav-label .nav-rule{right:15px}}
@media(max-width:650px){body[data-state=home] .intro .micro{display:none}}
@media(max-width:650px){.dna-directory{height:38%}}

/* Round 24: quiet reading rail. The model joint is the moving endpoint. */
.dna-nav-label{will-change:auto}
.dna-tethers path{stroke-linejoin:round}

/* Round26: one common glass surface, only interaction accents differ. */
.glass-target{display:none}
body[data-material=target][data-state=home] .art{aspect-ratio:3/2}
body[data-material=target][data-state=home] .art>video,body[data-material=target][data-state=home] .art>.still{opacity:0!important;visibility:hidden}
body[data-material=target][data-state=home] .glass-target{display:block;position:absolute;inset:0;width:100%;height:100%;opacity:1;filter:none;object-fit:fill}
body[data-material=target][data-state=home] #pause{display:none!important}
.dna-tethers{--joint:#50615a;--light:#8c9991;--flare:#9ca5a0}
body[data-node-color=accent] .dna-tethers{--joint:#218d84;--light:#70c9b9;--flare:#5ebcaf}
.dna-tethers path{stroke:#86958a;opacity:.35;stroke-width:.8}
.dna-tethers circle{fill:#f6f5efc9;stroke:#83998b;transition:stroke .25s,fill .25s,opacity .25s}
.dna-tethers .joint-inner{fill:#74877b}
.dna-tethers .joint-halo{fill:none;stroke:#a3b6a8;opacity:.2}
.dna-tethers g.is-active path:not(.joint-light){stroke:var(--joint);stroke-width:1.2;opacity:.7}
.dna-tethers g.is-active .joint-inner{fill:var(--joint)}
.dna-tethers g.is-active circle:not(.joint-halo){stroke:var(--joint)}
.dna-tethers g.is-active .joint-halo{stroke:var(--light);stroke-width:2;opacity:.8;filter:drop-shadow(0 0 4px var(--flare))}
.dna-tethers .joint-light{opacity:0!important;stroke-linecap:round;stroke-width:4;pointer-events:none}
.dna-tethers g.is-active .joint-light{stroke:var(--light);opacity:.55!important;filter:drop-shadow(0 0 5px var(--flare));stroke-dasharray:90;animation:jointReveal .38s ease-out}
@keyframes jointReveal{from{stroke-dashoffset:90;opacity:0}to{stroke-dashoffset:0;opacity:.55}}
@media(prefers-reduced-motion:reduce){.dna-tethers g.is-active .joint-light{animation:none}.dna-tethers circle{transition:none}}