/* Early page paint and same-origin document crossfades. */
html{background:#0b0d0c;color-scheme:dark}
html.portfolio-booting body{opacity:0}
.portfolio-route [hidden]{display:none!important}
@view-transition{navigation:auto}
::view-transition-old(root){animation:portfolio-page-out .32s ease both}
::view-transition-new(root){animation:portfolio-page-in .38s ease both}
@keyframes portfolio-page-out{to{opacity:0}}
@keyframes portfolio-page-in{from{opacity:0}}
.portfolio-route{--route-gold:#e4c689;--route-ice:#b7d6c7;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:9px clamp(16px,4vw,64px);min-height:84px;color:#eae5d5;border-bottom:1px solid #c4ae6b55;background:radial-gradient(ellipse at 15% 0,#cfb96e12,transparent 55%),linear-gradient(110deg,#15201ef5,#0c1014fa);box-shadow:0 8px 25px #0004,inset 0 1px #ffffff08;isolation:isolate;font-family:Inter,system-ui,sans-serif}
.site-nav.portfolio-route{position:sticky;top:0;z-index:1100;flex-direction:row;backdrop-filter:blur(14px)}
html.is-scrolling .site-nav.portfolio-route{backdrop-filter:none;-webkit-backdrop-filter:none}
.portfolio-route:after{content:"";position:absolute;left:4%;right:4%;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,#e9d48b80 22%,#afcec75c 67%,transparent);pointer-events:none}
.portfolio-route .route-path{display:flex;align-items:center;flex-wrap:nowrap;gap:0;min-width:0;flex:1}
.portfolio-route .route-node{display:flex;align-items:center;gap:11px;min-width:0;padding:7px 10px;border:1px solid transparent;border-radius:13px;position:relative}
.portfolio-route .route-home{color:#efe4c0;text-decoration:none;flex-shrink:0;background:linear-gradient(145deg,#d2b47b0b,#1d2f2c18);border-color:#c4aa6133;transition:background .5s,box-shadow .5s,border-color .5s;color:#f1e5c5}
.portfolio-route .route-home:hover{border-color:#e0c78977;box-shadow:0 0 22px #e6c46e1f,inset 0 0 16px #e6c46e09}
.portfolio-route .route-mark{width:48px;height:48px;object-fit:contain;filter:drop-shadow(0 0 7px #e3cb7644);flex-shrink:0}
.portfolio-route .route-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.portfolio-route .route-copy small{font:500 8px/1.5 Inter,system-ui,sans-serif;letter-spacing:.17em;color:#9caeaa;text-transform:uppercase;white-space:nowrap}
.portfolio-route .route-copy strong{font:500 18px/1.2 'Playfair Display',Georgia,serif;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;color:inherit}
.portfolio-route .route-home strong{font-size:21px;letter-spacing:.01em;text-shadow:0 0 18px #e1c27222}
.portfolio-route .route-group{flex-shrink:0;color:#c3dacd}
.portfolio-route .route-group .route-copy strong{font-size:17px}
.portfolio-route .route-project{max-width:560px;flex:0 1 auto;color:#e4ddc6}
.portfolio-route .route-project .route-copy strong{font-size:18px}
.portfolio-route .route-glyph{display:grid;place-items:center;width:31px;height:31px;flex-shrink:0;color:var(--route-ice);font:20px/1 Georgia,serif;border:1px solid #accec631;border-radius:50%;box-shadow:0 0 16px #9bcec511,inset 0 0 9px #a5bbaa08}
.portfolio-route .route-thumb{width:39px;height:39px;object-fit:cover;flex-shrink:0;border-radius:10px;border:1px solid #d6c48a66;box-shadow:0 0 16px #dfc67e12}
.portfolio-route .route-wire{position:relative;display:block;width:clamp(22px,3.2vw,64px);height:24px;flex:0 1 64px;min-width:16px;opacity:.8}
.route-wire:before,.route-wire:after{content:"";position:absolute;left:0;right:0;height:1px;background:linear-gradient(90deg,#c7b77644,#f2d58caa,#9fcbc444);top:11px}
.route-wire:after{top:15px;opacity:.25}
.route-wire i{position:absolute;left:48%;top:8px;width:7px;height:7px;transform:rotate(45deg);border-top:1px solid #ead7a3;border-right:1px solid #ead7a3;box-shadow:3px -3px 9px #e4bc5933}
.route-wire b{position:absolute;top:6px;left:0;width:1px;height:11px;background:#c7b77644}
.portfolio-route .route-end{display:flex;align-items:center;gap:18px;flex-shrink:0}
.route-meter{display:flex;align-items:center;gap:5px;width:64px;height:24px;opacity:.75}
.route-meter i{display:block;width:2px;height:6px;background:#cabc8688}.route-meter i:nth-child(3n+1){height:15px;background:#cabc86}.route-meter i:nth-child(3n+2){height:10px;background:#afd4c3}
.portfolio-route .route-back,.portfolio-route .route-contact{display:inline-flex;align-items:center;justify-content:center;padding:9px 13px;border:1px solid #ddc38455;border-radius:10px;text-decoration:none;color:#e5d7b0;background:#d1b8650b;font:500 11px/1.5 Inter,system-ui,sans-serif;white-space:nowrap;transition:box-shadow .5s,border-color .5s,color .5s}
.portfolio-route .route-back:hover,.portfolio-route .route-contact:hover{color:#fff0be;border-color:#dfc884a0;box-shadow:0 0 20px #e0bc5b22}
.portfolio-route a:focus-visible{outline:2px solid #e9ce8c;outline-offset:3px}
.portfolio-route[data-route-group=mathematics]{--route-ice:#c3bde6}.portfolio-route[data-route-group=research]{--route-ice:#b5dbc0}.portfolio-route[data-route-group=graphics]{--route-ice:#a8cfdd}
.route-compact{position:relative;padding:4px 7px;border:0;background:transparent;box-shadow:none;min-height:46px;max-width:min(720px,calc(100vw - 28px))}
.route-compact .route-node{padding:3px 7px;gap:7px}.route-compact .route-mark{width:33px;height:33px}.route-compact .route-copy small{font-size:7px}.route-compact .route-copy strong,.route-compact .route-home strong,.route-compact .route-project .route-copy strong,.route-compact .route-group .route-copy strong{font-size:13px}.route-compact .route-glyph{width:24px;height:24px;font-size:15px}.route-compact .route-thumb{width:29px;height:29px}.route-compact .route-wire{width:24px;flex-basis:24px}.route-compact .route-end{display:none}.route-compact .route-project{max-width:280px}
.intent-experimental{color:#a9c9e7;border-color:#96bde256;background:#18293888}
.project-ribbon.intent-experimental{background:linear-gradient(110deg,#244138,#294755);color:#d7edee;border-color:#9ad5d36b}
.intent-wip,.intent-exploring{color:#edc898;border-color:#d6ad705c;background:#38281c88}
.project-ribbon.intent-wip,.project-ribbon.intent-exploring{background:linear-gradient(110deg,#5c3e26,#433424);color:#ffe1ad;border-color:#e7bf7c8a}
.project-discipline{margin-bottom:8px}
.technique-map-link,.primary-link,.text-link,.field-follow-ons a,.project-primary,.footer a{border:1px solid #d2b86555;border-radius:9px;padding:8px 12px;background:linear-gradient(120deg,#d6b96b0d,#19221a50);display:inline-flex;align-items:center;gap:12px;transition:color .5s,box-shadow .5s,border-color .5s;font-weight:500}
.technique-map-link:hover,.primary-link:hover,.text-link:hover,.field-follow-ons a:hover,.project-primary:hover,.footer a:hover{border-color:#e7cb86aa;box-shadow:0 0 20px #dcc07022;color:#f6e7c0}
.hero-hand-labels{display:none}
@media(max-width:1100px){.portfolio-route{gap:8px;padding:8px 18px}.portfolio-route .route-meter{display:none}.portfolio-route .route-wire{flex-basis:30px}.portfolio-route .route-project .route-copy strong{font-size:16px}}
@media(max-width:1100px){.portfolio-route .route-contact{display:none}}
@media(max-width:760px){.site-nav.portfolio-route{padding:7px 10px;gap:5px;min-height:70px}.portfolio-route .route-mark{width:33px;height:33px}.portfolio-route .route-node{gap:6px;padding:5px}.portfolio-route .route-copy small{font-size:7px;letter-spacing:.08em}.portfolio-route .route-home strong,.portfolio-route .route-group .route-copy strong{font-size:14px}.portfolio-route .route-project .route-copy strong{font-size:13px}.portfolio-route .route-glyph{display:none}.portfolio-route .route-project .route-thumb{display:none}.portfolio-route .route-wire{width:16px;flex-basis:16px}.portfolio-route .route-back{font-size:10px;padding:7px;max-width:90px;white-space:normal;text-align:center}.route-compact .route-project{max-width:185px}.route-compact .route-home strong{font-size:12px}.route-compact .route-mark{width:25px;height:25px}.route-compact .route-copy small{display:none}}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}::view-transition-old(root),::view-transition-new(root){animation:none}.portfolio-route *,.primary-link,.text-link,.field-follow-ons a,.project-primary,.footer a{transition:none!important}}
/* Shared presentation: one component on brochures, studies and live apps. */
html[data-portfolio-navigation="top"]{scroll-padding-top:max(100px,var(--portfolio-navigation-height,84px))}
html[data-portfolio-navigation="top"] body{box-sizing:border-box;padding-top:calc(var(--portfolio-original-padding-top,0px) + var(--portfolio-navigation-height,84px))!important}
html[data-portfolio-navigation="top"] .portfolio-viewport-root{height:calc(100dvh - var(--portfolio-navigation-height,84px))!important;min-height:0!important}
html[data-portfolio-navigation="top"] .portfolio-viewport-root>*{min-height:0}
html[data-portfolio-navigation="top"] .portfolio-fixed-root{top:var(--portfolio-navigation-height,84px)!important;bottom:0!important}
html[data-portfolio-navigation="top"] .portfolio-fixed-toolbar{top:calc(var(--portfolio-toolbar-top,0px) + var(--portfolio-navigation-height,84px))!important;max-height:calc(100dvh - var(--portfolio-navigation-height,84px) - var(--portfolio-toolbar-top,0px) - var(--portfolio-toolbar-bottom,12px));min-height:0}
html[data-portfolio-navigation="top"] .portfolio-sticky-header{top:calc(var(--portfolio-sticky-top,0px) + var(--portfolio-navigation-height,84px))!important}
.portfolio-route.universal-route-top{position:fixed!important;inset:0 0 auto!important;width:100%!important;max-width:none!important;margin:0!important;z-index:2147483000!important;min-height:84px;border-radius:0;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.portfolio-route.universal-route-dock{position:fixed!important;inset:auto auto max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))!important;z-index:2147483000!important;width:auto!important;max-width:calc(100vw - 24px)!important;margin:0!important;padding:6px 10px!important;gap:9px;border:1px solid #dbc07c88!important;border-radius:16px;background:linear-gradient(135deg,#25352ff5,#101b1df8)!important;box-shadow:0 7px 24px #0007,inset 0 1px #fff2!important;backdrop-filter:blur(14px)}
html.is-scrolling .portfolio-route[data-universal-route]{backdrop-filter:none;-webkit-backdrop-filter:none}
.portfolio-route[data-universal-route] .route-project{max-width:none;min-width:0}
.portfolio-route[data-universal-route] .route-project>.route-copy{max-width:min(34vw,580px)}
.portfolio-route a.route-group{text-decoration:none}
.portfolio-route .route-branches{display:grid;grid-template-columns:58px auto;grid-template-rows:30px;column-gap:0;row-gap:4px;align-items:center;position:relative;margin-left:4px;flex:0 0 auto}
.portfolio-route .route-branches:has([data-branch="project"]){grid-template-rows:30px 30px}
.portfolio-route .route-fork{grid-area:1 / 1 / -1 / 2;width:58px;height:100%;overflow:visible;pointer-events:none}
.portfolio-route .route-fork-line{fill:none;stroke:#cab88888;stroke-width:1;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke;transition:stroke .25s,filter .25s}
.portfolio-route .route-fork-line.is-current,.portfolio-route .route-branches:has([data-branch="project"]:hover) .route-fork-project,.portfolio-route .route-branches:has([data-branch="brochure"]:hover) .route-fork-brochure{stroke:#f1d58d;filter:drop-shadow(0 0 3px #f1d58d66)}
.portfolio-route .route-branch{box-sizing:border-box;grid-column:2;display:flex;align-items:center;justify-content:flex-start;height:30px;min-width:88px;gap:9px;padding:4px 0;border:0;border-radius:0;background:none;color:#b8cbbf;text-decoration:none;font:500 12px/1.3 Inter,system-ui,sans-serif;white-space:nowrap;transition:color .25s,text-shadow .25s}
.portfolio-route .route-branch[aria-current]{color:#fff1c3;background:none;box-shadow:none;text-shadow:0 0 10px #e4c87888,0 0 22px #e4c87840}
.portfolio-route .route-branch:hover{color:#fff1c3;text-shadow:0 0 10px #e4c87888}
.portfolio-route .route-overview{align-self:flex-start;color:#b3cabc;text-decoration:none;font:500 10px/1.2 Inter,system-ui,sans-serif;letter-spacing:.02em;border-bottom:1px solid #c7b77640;padding:1px 0 2px}
.portfolio-route .route-overview:hover,.portfolio-route .route-overview[aria-current]{color:#f5d992;border-color:#f5d992}
.portfolio-route .route-presentation-toggle{box-sizing:border-box;flex:0 0 auto;position:static;display:grid;place-items:center;min-width:38px;width:auto;height:30px;margin:0;padding:4px 8px;border:1px solid #b3c6ba38;border-radius:9px;background:#b3c6ba0a;color:#b3c6ba;font:500 10px/1 Inter,system-ui,sans-serif;letter-spacing:.03em;cursor:pointer;transition:border-color .25s,color .25s,box-shadow .25s}
.portfolio-route .route-presentation-toggle:hover{border-color:#e5c689a0;color:#f5e2b5;box-shadow:0 0 14px #e5c6891c}
.portfolio-route .route-presentation-toggle:focus-visible{outline:2px solid #e9ce8c;outline-offset:3px}
.portfolio-route.universal-route-dock .route-end{display:none}
.portfolio-route.universal-route-dock .route-project>.route-copy{max-width:200px}
.portfolio-route.universal-route-dock .route-branches{grid-template-columns:40px auto;margin-left:0}
.portfolio-route.universal-route-dock .route-fork{width:40px}
.portfolio-route.universal-route-dock .route-branch{font-size:11px;min-width:78px;padding-inline:10px}
.portfolio-route.universal-route-dock .route-group{max-width:100px}
.portfolio-route[data-universal-route] [hidden]{display:none!important}
@media(max-width:900px){.portfolio-route[data-universal-route] .route-end{display:none}.portfolio-route[data-universal-route]{gap:8px}.portfolio-route .route-branches{grid-template-columns:42px auto}.portfolio-route .route-fork{width:42px}.portfolio-route .route-branch{min-width:80px;padding-inline:9px}}
@media(max-width:600px){.portfolio-route[data-universal-route] .route-group,.portfolio-route[data-universal-route] .route-group+.route-wire{display:none}.portfolio-route[data-universal-route] .route-project>.route-copy{max-width:140px}.portfolio-route .route-branches{grid-template-columns:32px auto;margin-left:0}.portfolio-route .route-fork{width:32px}.portfolio-route .route-branch{font-size:11px;min-width:73px;padding-inline:8px}.portfolio-route.universal-route-dock{max-width:calc(100vw - 16px)!important;left:8px!important;bottom:8px!important}}
@media(max-width:520px){.portfolio-route[data-universal-route] .route-home .route-copy{display:none}.portfolio-route[data-universal-route] .route-project>.route-copy{max-width:calc(100vw - 240px)}.portfolio-route[data-universal-route] .route-wire{min-width:10px;flex-basis:16px}.portfolio-route.universal-route-dock .route-branches{grid-template-columns:26px auto}.portfolio-route.universal-route-dock .route-fork{width:26px}}

/* Etched continuation wires and endpoint indicators match the earlier levels. */
.portfolio-route .route-fork-echo{opacity:.25}
.portfolio-route .route-branch::before{content:"";box-sizing:border-box;width:9px;height:9px;flex:0 0 9px;border:1px solid currentColor;border-radius:50%;opacity:.6}
.portfolio-route .route-branch[aria-current]::before,.portfolio-route .route-branch:hover::before{opacity:1;box-shadow:0 0 8px #e4c87855}
.portfolio-route[data-universal-route] .route-branch{padding-inline:0}

/* Optional single header for live instruments. The native element is moved,
   keeping its controls, fonts and live performance readouts intact. */
.route-app-title{min-width:0;flex:1 1 260px;padding-left:24px;border-left:1px solid #d9c18435}
.route-app-title[hidden]{display:none!important}
.route-title-bundle{min-width:0}
.route-title-bundle>p{font-family:inherit;font-size:12px;font-weight:400;line-height:1.45;margin:5px 0 0;color:#b6c6c0}
.route-app-title[data-app="balanceforge"]>.topbar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px;margin:0!important}
.route-app-title[data-app="balanceforge"] .brand{flex:1 1 240px;align-items:center;flex-wrap:wrap}
.route-app-title[data-app="balanceforge"] .brand-tag{display:block;flex-basis:100%;margin-left:45px;font-size:10px;line-height:1.4;white-space:normal}
.route-app-title[data-app="balanceforge"] .topbar-status{display:flex;flex-direction:column;align-items:flex-end;gap:2px;min-width:0}
.route-app-title[data-app="balanceforge"] .status-detail{font-size:10px;white-space:normal;max-width:300px}
.route-app-title:is([data-app="trees"],[data-app="complex_function"]) h1{color:#f6d860;text-shadow:0 0 15px #f6d86055,0 0 30px #d4af3733,2px 2px 8px #0009;letter-spacing:.025em}
html[data-portfolio-merged-title="trees"] .container{padding-top:8px}
html[data-portfolio-merged-title="trees"] .container>header.portfolio-title-vacated{margin-top:0;padding-top:0!important}
html[data-portfolio-merged-title="complex_function"] #header.portfolio-title-vacated{display:none!important}
.portfolio-hackenbush .hero-copy h1::before{content:"";display:inline-block;width:46px;height:46px;margin-right:12px;vertical-align:middle;background:url("media/identity/hackenbush-mark.svg") center/contain no-repeat;filter:drop-shadow(0 0 8px #e7c57733)}
.top-route-nav-brand .top-route-nav-mark{width:44px;height:44px;flex:0 0 44px;border-radius:0;font-size:0!important;color:transparent!important;background:url("media/identity/rubik-mark.svg") center/contain no-repeat;box-shadow:none;filter:drop-shadow(0 0 8px #e7c57733)}
#modeSwitch .ms-tip{scale:1 1.65}
.portfolio-stage-hint{position:fixed;z-index:2147482999;box-sizing:border-box;width:min(300px,calc(100vw - 24px));padding:16px 18px;border:1px solid #dec78999;border-radius:12px;background:linear-gradient(145deg,#24332af5,#101a20fa);color:#d4dcca;box-shadow:0 10px 30px #0007,0 0 22px #e5c67a18;font:13px/1.5 system-ui,sans-serif}
.portfolio-stage-hint strong{font:600 18px Georgia,serif;color:#f0dca4}.portfolio-stage-hint p{margin:7px 0 12px}.portfolio-stage-hint button{border:1px solid #d4be7966;background:#e3ce8512;color:#eed796;border-radius:7px;padding:5px 10px;font:inherit;cursor:pointer}
.route-app-title [data-portfolio-title-label]{cursor:default;pointer-events:none;text-decoration:none}
.route-title-bundle>:is(h1,.brand-name,.top-route-nav-brand){margin:0!important;font-size:clamp(18px,1.7vw,27px)!important;line-height:1.2}
.route-app-title :is(.identity,.brand,.brand-lockup){min-width:0;display:flex;align-items:center;gap:10px}
.route-title-bundle>:is(.identity,.brand,.brand-lockup){font-size:clamp(18px,1.7vw,27px);text-decoration:none}
.route-app-title :is(.identity,.brand,.brand-lockup)>svg{width:36px;height:36px;flex-shrink:0}
.route-app-title :is(h1,h2){font-size:clamp(18px,1.7vw,27px);line-height:1.2;margin-block:0}
header.portfolio-title-vacated,.brandbar.portfolio-title-vacated,.topbar.portfolio-title-vacated,.site-header.portfolio-title-vacated{min-height:0!important;height:auto!important;padding-block:6px!important}
/* App CSS may override the browser's default [hidden] rule. Hide only links
   proven to duplicate the universal route, plus their dedicated empty strip. */
[data-portfolio-return-duplicate="true"]{display:none!important}
.portfolio-return:not(a):has(> [data-portfolio-return-duplicate="true"]){display:none!important}
html[data-portfolio-merged-title] .portfolio-route .route-path{flex:0 0 auto;width:max-content}
html[data-portfolio-merged-title] .portfolio-route .route-end{display:none}
html[data-portfolio-merged-title="aperture"]{--aperture-header-height:0px}
html[data-portfolio-merged-title="aperture"] #container{grid-template-rows:minmax(0,1fr)}
.route-title-bundle>#header,.route-app-title>.topbar,.route-title-bundle>header{position:static!important;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;min-width:0;height:auto!important;grid-area:auto}
.route-title-bundle>#header h1,.route-title-bundle>header .identity{flex:1 1 240px;min-width:0}
.route-title-bundle>#header h1{margin:0;font-size:clamp(17px,1.45vw,27px)!important;line-height:1.25}
.route-title-bundle>#header .stats{margin-left:auto;flex-shrink:0}
.route-app-title[data-app="pipeline"] .intent{display:block;min-width:180px;flex:1 1 180px;font-size:11px}
.route-app-title[data-app="pipeline"] .metrics{gap:4px}
.route-app-title[data-app="pipeline"] .metrics>span{padding:5px 6px}
.route-title-toggle[aria-pressed="true"]{color:#ffe3a2!important;border-color:#d9bd7790!important}
.portfolio-route.has-code-stats .route-meter{display:none}
.portfolio-route .route-code-toggle[aria-pressed="true"]{color:#ffe3a2;border-color:#d9bd7790}
.portfolio-route .route-code-meter{box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;gap:5px;flex:0 0 96px;width:96px;min-width:0;height:34px;padding:3px 5px;margin:0;position:static;border:0;border-radius:6px;background:transparent;color:#dfc890;cursor:pointer;font:500 10px/1.1 Inter,system-ui,sans-serif;letter-spacing:.025em;white-space:nowrap}
.portfolio-route .route-code-meter:hover{background:#dbc07812;color:#fff1c5}
.portfolio-route .route-code-meter:focus-visible{outline:2px solid #e9ce8c;outline-offset:3px}
.route-code-bar{display:flex;gap:0;width:100%;height:6px;overflow:hidden;border-radius:2px;background:#dcc38016}
.route-code-segment{display:block;flex-basis:0;min-width:0;height:100%}
.route-code-panel{box-sizing:border-box;position:fixed;z-index:2147483001;right:max(12px,env(safe-area-inset-right));width:min(220px,calc(100vw - 24px));margin:0;padding:12px 14px;color:#d3dbcc;background:linear-gradient(145deg,#20332e,#102023 85%);border:1px solid #d5bc7480;border-radius:10px;box-shadow:0 14px 50px #0009,inset 0 1px #f1dc9620;font:400 12px/1.55 Inter,system-ui,sans-serif;overflow:auto;overscroll-behavior:contain;text-align:left}
.route-code-panel[hidden]{display:none!important}
.route-code-panel:focus{outline:none}
.route-code-panel *{box-sizing:border-box}
.route-code-panel .route-code-head{position:relative;padding-right:26px}
.route-code-panel h2{margin:0;color:#f5e3b6;font:500 16px/1.5 Georgia,serif;letter-spacing:0;text-transform:none}
.route-code-panel .route-code-close{position:absolute;inset:-5px -7px auto auto;width:28px;height:28px;margin:0;padding:0;border:0;border-radius:6px;background:transparent;color:#d7c690;font:400 22px/1 system-ui,sans-serif;cursor:pointer}
.route-code-panel .route-code-close:hover{background:#dcc17a16}
.route-code-panel p{margin:10px 0;font-size:12px;line-height:1.55}
.route-code-panel .route-code-list{display:grid;gap:0;margin:6px 0 0;padding:0;list-style:none}
.route-code-panel .route-code-language{display:grid;grid-template-columns:8px minmax(0,1fr);align-items:center;gap:9px;min-height:29px;margin:0;padding:4px 0;border:0;border-top:1px solid #cbbb8316;background:none;font:400 12px/1.4 Inter,system-ui,sans-serif;color:inherit}
.route-code-panel .route-code-swatch{display:block;width:8px;height:8px;border-radius:2px;box-shadow:0 0 5px #ffffff10}
.route-code-panel .route-code-name{overflow-wrap:anywhere;color:#e1e7db}
.route-code-panel .route-code-retry{padding:6px 10px;border:1px solid #d5bc7480;border-radius:6px;background:#ccb97412;color:#e6cf92;font:inherit;cursor:pointer}
.route-code-panel button:focus-visible,.route-code-panel summary:focus-visible{outline:2px solid #e9ce8c;outline-offset:3px}
.portfolio-route.universal-route-dock .route-code-meter{flex-basis:58px;width:58px;font-size:9px}
@media(max-width:1100px){.portfolio-route .route-code-meter{flex-basis:62px;width:62px;font-size:9px}}
@media(max-width:600px){.portfolio-route .route-code-meter,.portfolio-route.universal-route-dock .route-code-meter{flex-basis:24px;width:24px;padding:4px 1px}.portfolio-route .route-code-label{display:none}.portfolio-route .route-code-bar{height:16px;gap:0;border-radius:3px}.portfolio-route .route-code-bar.is-empty{border:1px dashed #d7bd7555}.portfolio-route .route-code-toggle{padding-inline:5px;min-width:33px}.portfolio-route.has-code-stats .route-project>.route-copy{max-width:calc(100vw - 313px)}.route-code-panel{padding:16px}}
@media(min-width:1100px) and (max-width:1400px){
 .route-app-title{padding-left:14px}
 .route-app-title[data-app="pipeline"] .metrics>span:not(:first-child){display:none}
}
/* Preserve the full route at ordinary laptop widths. The supplemental title
   gets a slim second row instead of squeezing the thumbnail/name/Overview. */
@media(min-width:1100px) and (max-width:1799px){
 html[data-portfolio-merged-title] .portfolio-route{display:grid;grid-template-columns:minmax(0,1fr) repeat(4,max-content);column-gap:14px;row-gap:10px}
 html[data-portfolio-merged-title] .portfolio-route .route-path{grid-row:1;grid-column:1;width:auto;min-width:0}
 html[data-portfolio-merged-title] .route-app-title{grid-row:2;grid-column:1/-1}
 html[data-portfolio-merged-title] .route-code-meter{grid-row:1;grid-column:2}
 html[data-portfolio-merged-title] .route-code-toggle{grid-row:1;grid-column:3}
 html[data-portfolio-merged-title] .route-title-toggle{grid-row:1;grid-column:4}
 html[data-portfolio-merged-title] .route-presentation-toggle:not(.route-code-toggle):not(.route-title-toggle){grid-row:1;grid-column:5}
}

/* These regions contain identity and explanatory artwork only. Their adjacent
   workbench controls, proof navigation and demonstrations stay in the app. */
.route-app-title[data-app="prism_optics"] .route-title-bundle>h1{text-align:left}
.route-app-title[data-app="prism_optics"] .route-title-bundle>p{max-width:none!important;margin:5px 0 0!important;text-align:left!important;font-size:11px;line-height:1.45!important}
.route-app-title[data-app="image_processing"] .photo-hero{width:100%;margin:0!important;gap:8px 18px}
.route-app-title[data-app="image_processing"] .photo-hero>div{min-width:0;flex:1 1 240px}
.route-app-title[data-app="image_processing"] .photo-eyebrow{display:block;font-size:9px;line-height:1.4;letter-spacing:.08em;margin:0 0 4px}
.route-app-title[data-app="image_processing"] .photo-hero h1{font-size:clamp(18px,1.4vw,24px)!important;line-height:1.18;margin:0;text-align:left}
.route-app-title[data-app="image_processing"] .photo-hero .subtitle{max-width:none;margin:5px 0 0;font-size:11px;line-height:1.45;text-align:left}
.route-app-title[data-app="image_processing"] .photo-hero-diagram{display:block;flex:0 0 106px;width:106px;height:auto;max-height:74px;margin:0;overflow:visible}
.route-app-title[data-app="clique-proofs"] .route-title-bundle{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:18px;row-gap:4px}
.route-app-title[data-app="clique-proofs"] .route-title-bundle>.brand{grid-column:1;grid-row:1/3;align-self:center;margin:0;padding-right:18px;border-right:1px solid #d9c18435;white-space:nowrap}
.route-app-title[data-app="clique-proofs"] .route-title-bundle>.eyebrow{grid-column:2;grid-row:1;margin:0;font-size:9px;line-height:1.4;letter-spacing:.08em}
.route-app-title[data-app="clique-proofs"] .route-title-bundle>h1{grid-column:2;grid-row:2;font-family:"Fraunces",Georgia,serif;font-size:clamp(16px,1.3vw,21px)!important;line-height:1.25}