/* Active product only. The complete native source has its own frozen stylesheet. */
.bridge-product { --bridge-paper:#e7eeeb; --bridge-mint:#b9d9ce; --bridge-muted:#929f98; --yellow-light:#e7eeeb; --yellow:#b9d9ce; --white:#e7eeeb; }
.bridge-product .t-yellow-light { color:var(--bridge-paper)!important; }
.bridge-menu-toggle { display:none; }
.bridge-menu-header .bridge-menu-nav { gap:18px; }
.bridge-menu-header .bridge-menu-nav a { display:inline-flex;align-items:center;min-height:40px;color:#b8c1ba; }
.bridge-menu-header .bridge-menu-nav a:hover,.bridge-menu-header .bridge-menu-nav a:focus-visible { color:var(--bridge-paper); }
.bridge-menu-header button { font:inherit;color:var(--bridge-paper);border:0;background:transparent;cursor:pointer; }
.bridge-story-panel { box-sizing:border-box;width:100vw;min-height:100dvh;position:relative;display:flex;align-items:center;gap:4vw;padding:100px 6vw 64px!important;color:var(--bridge-paper);background:#0a0b09;overflow:hidden;isolation:isolate; }
.bridge-story-panel::before { content:"";position:absolute;left:6vw;right:6vw;top:80px;border-top:1px solid #d9e9df21; }
.bridge-story-copy { position:relative;z-index:2;width:46%;flex:0 0 46%; }
.bridge-story-kicker,.bridge-mono,.bridge-visual-label,.bridge-svg-label,.bridge-route-options { font-family:"DM Mono",monospace;font-weight:400; }
.bridge-story-kicker { font-size:12px;letter-spacing:.06em;color:var(--bridge-muted);margin:0 0 30px; }
.bridge-story-copy h2 { font-size:clamp(94px,10vw,166px);font-weight:400;letter-spacing:-.025em;line-height:.86;margin:0 0 34px;text-transform:uppercase; }
.bridge-story-description { max-width:31ch;font:400 clamp(19px,1.55vw,24px)/1.4 "Neue Montreal",sans-serif;letter-spacing:-.025em;color:#b6c2b9;margin:0; }
.bridge-story-link { display:inline-flex;align-items:center;gap:48px;margin-top:32px;padding:12px 0;border-bottom:1px solid #dce8df77;font:18px/1.2 "Neue Montreal",sans-serif;transition:gap .4s,color .4s; }
.bridge-story-link:hover { gap:64px;color:var(--bridge-mint); }
.bridge-story-footnote { font:13px/1.45 "DM Mono",monospace;color:var(--bridge-muted);max-width:33ch;margin-top:30px; }
.bridge-story-visual { position:relative;flex:1;aspect-ratio:1;min-width:0;max-height:74vh; }
.bridge-visual-label { position:absolute;font-size:11px;letter-spacing:.05em;color:var(--bridge-muted); }
.bridge-label-top { top:8%;left:50%;transform:translateX(-50%); }
.bridge-label-bottom { bottom:5%;left:50%;transform:translateX(-50%);white-space:nowrap; }
.bridge-pool-visual { max-width:620px; }
.bridge-pool-orbit { position:absolute;border:1px solid #b9d9ce3b;border-radius:50%;inset:14%; }
.bridge-pool-orbit.orbit-b { inset:23%;border-style:dashed;opacity:.55; }
.bridge-pool-orbit.orbit-c { inset:34%;background:#b9d9ce05;border-color:#b9d9ce69; }
.bridge-pool-core { position:absolute;inset:40% 25%;display:flex;align-items:center;flex-direction:column;justify-content:center; }
.bridge-pool-core .bridge-mono { font-size:11px;letter-spacing:.17em;color:var(--bridge-muted); }
.bridge-pool-core .t-thicc { font-size:clamp(50px,6vw,90px);line-height:1;letter-spacing:.03em; }
.bridge-pool-particle { position:absolute;width:3px;height:3px;background:var(--bridge-paper);border-radius:50%;top:50%;left:50%;box-shadow:0 0 9px #b9d9ce33; }
.bridge-proof-visual { margin-left:-2vw;perspective:900px; }
.bridge-proof-lattice { position:absolute;inset:8%;background-image:radial-gradient(circle,#dce8df3d 1px,transparent 1px);background-size:20px 20px;mask-image:radial-gradient(ellipse,#000 10%,transparent 70%); }
.bridge-proof-plane { position:absolute;inset:18%;border:1px solid #b9d9ce30;transform:rotate(-12deg); }
.bridge-proof-plane.plane-b { inset:24%;transform:rotate(12deg);border-color:#b9d9ce4f; }
.bridge-proof-plane.plane-c { inset:31%;transform:rotate(0);border-color:#b9d9ce6a; }
.bridge-proof-center { position:absolute;inset:30% 15%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:#0a0b09e6; }
.bridge-proof-center .t-thicc { font-size:clamp(68px,8vw,120px);letter-spacing:.03em;line-height:1.1; }
.bridge-proof-center .bridge-mono { font-size:10px;line-height:1.4;letter-spacing:.04em;max-width:28ch;color:var(--bridge-muted); }
.bridge-proof-rule { width:40px;border-top:1px solid var(--bridge-mint);margin:16px 0; }
.bridge-route .bridge-story-copy { flex-basis:44%;width:44%; }
.bridge-route-options { display:flex;gap:20px;flex-wrap:wrap;margin-top:30px;font-size:12px; }
.bridge-route-options button { border:0;border-bottom:1px solid transparent;border-radius:0;padding:8px 0;color:#7b8981;background:transparent;font:inherit;cursor:pointer;transition:color .3s,border-color .3s; }
.bridge-route-options button:hover,.bridge-route-options button[aria-pressed="true"] { color:var(--bridge-paper);border-bottom-color:var(--bridge-paper); }
.bridge-route-visual { min-width:0;aspect-ratio:760/540;margin-left:-1vw; }
.bridge-route-visual svg { width:100%;height:100%;overflow:visible; }
.bridge-route-guides path { stroke:#6e827642;stroke-width:1;fill:none;transition:stroke .5s; }
.bridge-route-guides path.is-active { stroke:#b9d9ce9c; }
.bridge-route-trace { fill:none;stroke:var(--bridge-mint);stroke-width:1;stroke-dasharray:6 10;opacity:.5; }
.bridge-route-node,.bridge-route-destination { fill:#0a0b09;stroke:#d9e9df80;stroke-width:1; }
.bridge-route-destination { transition:fill .5s,stroke .5s; }
[data-route-node] { opacity:.3;transition:opacity .5s; }
[data-route-node].is-active { opacity:1; }
[data-route-node].is-active circle { fill:#b9d9ce19;stroke:var(--bridge-mint); }
.bridge-route-relay { fill:#b9d9ce0c; }
.bridge-route-packet { fill:var(--bridge-mint); }
.bridge-svg-label { fill:#b9c8bf;font-size:13px;letter-spacing:.04em; }
.bridge-route-caption { bottom:0;right:4%;font-size:10px; }
.bridge-receive-visual { display:flex;flex-direction:column;justify-content:center;gap:70px;padding-left:4vw; }
.bridge-receive-rail { width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:20px; }
.bridge-receive-label { font:11px/1.4 "DM Mono",monospace;color:var(--bridge-muted);max-width:9ch; }
.bridge-receive-track { position:relative;height:1px;background:#b9d9ce52; }
.bridge-receive-track::before,.bridge-receive-track::after { content:"";position:absolute;top:-5px;width:10px;height:10px;border:1px solid #b9d9ce80;border-radius:50%;background:#0a0b09; }
.bridge-receive-track::before { left:-5px; }.bridge-receive-track::after { right:-5px; }
.bridge-receive-track i { position:absolute;z-index:1;width:5px;height:5px;top:-2px;left:0;background:var(--bridge-mint);border-radius:50%; }
.bridge-privacy-boundary { border-top:1px solid #d9e9df26;padding-top:24px; }
.bridge-privacy-boundary .bridge-mono { display:block;font-size:10px;color:var(--bridge-muted);margin-bottom:22px; }
.bridge-privacy-boundary p { max-width:27ch;margin:0 0 20px;font:26px/1.2 "Neue Montreal",sans-serif;letter-spacing:-.03em; }
.bridge-privacy-boundary .bridge-public-note { color:var(--bridge-muted);font-size:18px;line-height:1.4; }
.bridge-product .story__end__container { color:var(--bridge-paper); }
@media (hover:hover) and (pointer:fine) and (min-width:1024px) { .bridge-story-panel { height:100vh;flex:0 0 100vw; } }
@media (max-width:1023px),(hover:none) {
 .bridge-story-panel { min-height:0;padding:88px 24px 70px!important;display:flex;flex-direction:column;gap:36px; }
 .bridge-story-panel::before { top:34px;left:24px;right:24px; }
 .bridge-story-copy,.bridge-route .bridge-story-copy { width:100%;flex-basis:auto; }
 .bridge-story-copy h2 { font-size:clamp(82px,20vw,136px);margin-bottom:24px; }
 .bridge-story-kicker { font-size:10px;margin-bottom:24px; }
 .bridge-story-description { font-size:20px;max-width:30ch; }
 .bridge-story-visual { width:100%;flex:auto;max-width:540px;max-height:none; }
 .bridge-pool-visual { max-width:440px; }
 .bridge-proof-visual { order:2;margin-left:0; }
 .bridge-proof .bridge-story-copy { order:1; }
 .bridge-pool-core .t-thicc { font-size:64px; }
 .bridge-proof-center .t-thicc { font-size:82px; }
 .bridge-label-bottom { font-size:9px; }
 .bridge-route-visual { margin-left:0;margin-top:12px; }
 .bridge-receive-visual { padding-left:0;gap:44px;aspect-ratio:auto; }
 .bridge-privacy-boundary p { font-size:25px; }
 .bridge-story-footnote { font-size:12px; }
 .bridge-menu-header .header__grey:first-child { display:none!important; }
 .bridge-menu-header .header__logo { position:static!important;display:inline-flex!important;align-items:center;width:auto!important;min-height:42px;font-size:18px!important;text-align:left!important; }
 .bridge-menu-header .bridge-menu-toggle { display:inline-flex;align-items:center;justify-content:center;min-width:72px;min-height:42px;padding:0;font:12px "DM Mono",monospace; }
 .bridge-menu-header .bridge-menu-nav { display:none!important;position:absolute;right:0;top:54px;min-width:180px;background:#0a0b09f5;border:1px solid #d9e9df3b;padding:14px 20px;box-shadow:0 15px 50px #0008;gap:4px; }
 .bridge-menu-header.is-open .bridge-menu-nav { display:flex!important;flex-direction:column;align-items:flex-start; }
 .bridge-menu-header .bridge-menu-nav a { min-height:42px;font-size:13px;color:var(--bridge-paper);width:100%; }
}
@media (max-width:360px) {
 .bridge-menu-header .header__logo { font-size:16px!important; }
 .story__intro__year { font-size:7rem; }
 .story__intro__title { font-size:1.75rem; }
 .story__intro__year [class~="js-intro:wrapped"] { right:0;margin-right:0;font-size:.95rem; }
 .bridge-story-panel { padding-left:20px!important;padding-right:20px!important; }
 .bridge-story-copy h2 { font-size:78px; }
 .bridge-story-description { font-size:18px; }
 .bridge-story-link { font-size:17px; }
 .bridge-proof-center .t-thicc { font-size:68px; }
 .bridge-proof-center .bridge-mono { font-size:8px; }
 .bridge-pool-core .t-thicc { font-size:55px; }
 .bridge-privacy-boundary p { font-size:23px; }
}
@media (prefers-reduced-motion:reduce) { .bridge-story-panel * { scroll-behavior:auto!important; } }
/* The shortened story has no light portfolio scenes. Keep the native menu legible
   across every boundary, including batched mobile ScrollTrigger enter/leave. */
.bridge-product .bridge-menu-header .header__logo { color:var(--bridge-paper)!important; }
.bridge-product .story__intro { box-shadow:none; }
.bridge-story-copy h2 { word-spacing:.12em; }
@media (max-width:1023px),(hover:none) { .bridge-menu-header .bridge-menu-toggle,.bridge-menu-header .bridge-menu-nav a,.bridge-route-options button { min-height:44px; } }
@media (max-width:1023px),(hover:none) {
 .bridge-product .story__intro__year { font-size:clamp(5.6rem,36vw,12rem); }
 .bridge-product .story__end__title { white-space:nowrap;font-size:12vw; }
 .bridge-product .story__end__title .t-script { font-size:16vw; }
}
/* Semantic ASCII fields share the native eye's material and typographic density. */
.bridge-ascii-visual { display:block;min-width:0;max-height:76vh; }
.bridge-ascii-stage { position:relative;width:100%;height:100%;min-height:480px;aspect-ratio:1;isolation:isolate; }
.bridge-ascii-stage canvas { display:block;width:100%;height:100%;touch-action:pan-y; }
.bridge-ascii-label { position:absolute;bottom:18px;left:50%;transform:translateX(-50%);white-space:nowrap;font:10px/1.3 "DM Mono",monospace;letter-spacing:.05em;color:#8b9b91;pointer-events:none; }
.bridge-ascii-receive .bridge-ascii-stage { min-height:230px;aspect-ratio:1.8;height:42%; }
.bridge-ascii-receive .bridge-privacy-boundary { margin:12px 0 0 4vw; }
.bridge-ascii-receive .bridge-ascii-label { bottom:0; }
@media (max-width:1023px),(hover:none) {
 .bridge-ascii-visual { max-height:none;width:100%; }
 .bridge-ascii-stage { min-height:340px;aspect-ratio:1;height:auto; }
 .bridge-ascii-proof { order:2; }
 .bridge-ascii-receive .bridge-ascii-stage { min-height:210px;aspect-ratio:1.5;height:auto; }
 .bridge-ascii-receive .bridge-privacy-boundary { margin-left:0;margin-top:24px; }
 .bridge-ascii-label { font-size:9px;bottom:8px; }
}
@media(max-width:360px) { .bridge-ascii-stage { min-height:300px; }.bridge-ascii-receive .bridge-ascii-stage { min-height:190px; } }
/* Keep the native mixed-script footer lettering inside narrow phone viewports. */
@media (max-width: 480px) {
 .bridge-product .story__end__title { font-size:10.5vw; max-width:calc(100vw - 40px); white-space:nowrap; }
 .bridge-product .story__end__title .t-script { font-size:14vw; }
}
