.work-page{display:grid;gap:4rem}.work-page>section{margin:0;min-width:0;scroll-margin-top:6rem}.work-page .case-hero{min-height:38rem;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:2rem}.work-page .case-copy{display:grid;gap:1.5rem}.work-page .case-copy>*{margin:0}.work-page .case-copy h1{max-width:15ch;font-size:clamp(2.5rem,4.2vw,4.5rem);line-height:1.04}.work-page .case-study-scene{min-height:34rem}.work-page .case-actions{display:flex;flex-wrap:wrap;gap:1rem;margin:0}.work-brief,.work-chapter,.work-facts{display:grid;gap:2rem}.work-facts{grid-template-columns:repeat(4,minmax(0,1fr));padding:2rem 0;border-block:1px solid var(--studio-line);margin:0}.work-decision-detail>div,.work-facts>div{display:grid;align-content:start;gap:.5rem}.work-decision-detail dt,.work-facts dt{font-family:var(--font-mono),monospace;font-size:.75rem;color:var(--studio-label-ink);text-transform:uppercase}.work-facts dd{margin:0;font-size:.875rem;line-height:1.75;color:var(--studio-ink)}.work-context{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem}.work-reading{display:grid;align-content:start;gap:1rem}.work-context>p,.work-decision-detail dd,.work-page .work-reading>*{margin:0}.work-page h2{max-width:24ch;margin:0;font-size:var(--studio-type-title);line-height:1.1;font-weight:600;letter-spacing:-.045em;text-wrap:balance}.work-page .studio-section-intro{max-width:52rem}.work-page .studio-title-group{display:grid;gap:.5rem}.work-page .case-copy>[data-text=body],.work-page .studio-title-group>p,.work-page .work-reading>[data-text=body]{margin:0}.work-page h3{color:var(--studio-ink);font-size:clamp(1.25rem,2vw,1.75rem);font-weight:500;line-height:1.2;letter-spacing:-.035em}.work-contents{display:flex;flex-wrap:wrap;gap:1rem;border-bottom:1px solid var(--studio-line);padding:0 0 1rem}.work-evidence{display:grid;gap:1rem;margin:0}.work-dashboard{position:relative;aspect-ratio:1.43;overflow:hidden;border:1px solid var(--studio-line);border-radius:.5rem}.work-dashboard img{object-fit:contain}.work-decision,.work-decisions{display:grid;gap:2rem}.work-decision{grid-template-columns:minmax(0,.75fr) minmax(0,1.5fr);padding:2rem 0;border-top:1px solid var(--studio-line)}.work-decision-detail{display:grid;gap:1.5rem;margin:0}.work-decision-detail dd{font-size:1rem;line-height:1.75;color:var(--studio-muted)}.work-page .mobile-work-gallery,.work-page .work-gallery{margin:0}.work-measure{max-width:48rem}.work-page .implementation-body{grid-template-columns:minmax(0,.75fr) minmax(0,1.5fr);padding:1.5rem 0 2rem}.work-page .implementation-detail{scroll-margin-top:6rem}.code-block:focus-visible{outline:2px solid var(--studio-focus);outline-offset:-2px}@media (max-width:1000px){.work-page .case-hero{grid-template-columns:1fr}.work-page .case-copy h1{max-width:20ch}.work-page .case-study-scene{min-height:30rem}.work-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.work-page .implementation-body{grid-template-columns:1fr}}@media (max-width:600px){.work-context,.work-decision{grid-template-columns:1fr}.work-page .case-study-scene{min-height:22rem}.work-facts{gap:1.5rem}.work-contents{gap:.5rem}}.story-motion-scope{position:relative;container-type:inline-size}.story-motion-toolbar{position:absolute;top:1rem;right:clamp(1rem,3vw,3rem);z-index:6}.story-motion-toggle{display:inline-flex;align-items:center;gap:.5rem;min-height:2.75rem;color:var(--studio-muted);font-family:var(--font-mono),monospace;font-size:.6875rem;padding:.5rem;border-radius:.25rem}.story-motion-toggle:hover{color:var(--studio-ink)}.story-motion-toggle:focus-visible{outline:2px solid var(--studio-focus);outline-offset:2px}.story-motion-toggle:disabled{cursor:default}.work-overview{max-width:100rem;padding:4.5rem clamp(1.5rem,3.1vw,4rem) 0}.work-overview :is(h1,h2,h3,p,figure,dl,dd){margin:0}.work-overview h1{font-size:clamp(2.75rem,5.8vw,6rem);font-weight:600;line-height:1.02;letter-spacing:-.055em}.work-overview h2{font-size:clamp(2rem,3vw,2.5rem);font-weight:600;line-height:1.08;letter-spacing:-.045em}.work-opening{display:grid;gap:2rem}.work-opening-copy{display:flex;flex-direction:column;align-items:flex-start;gap:1.5rem}.story-heading-group{display:grid;gap:1rem}.story-detail-header h1 span,.story-heading-group h2 span{display:block}.connected-scene{position:relative;isolation:isolate;padding:0 0 2.5rem}.connected-products{position:relative;z-index:2;display:grid;grid-template-columns:19% 46% 21%;justify-content:space-between;align-items:start;gap:2rem;padding:1rem 2rem 7rem}.connected-products>div{display:grid;grid-template-columns:minmax(0,1fr);gap:1.5rem;min-width:0}.connected-products>div>p{text-align:center;font-size:.65rem;white-space:nowrap;letter-spacing:.12em}.connected-products>div>p:after{content:"";display:block;width:.3rem;height:.3rem;border-radius:50%;background:var(--studio-focus);margin:.5rem auto 0}.connected-input-list{display:grid;gap:1rem;padding-top:2rem}.connected-input{display:flex;align-items:center;gap:.75rem;padding:.75rem;border:1px solid var(--studio-border-control);border-radius:.5rem;background:var(--studio-canvas);color:var(--studio-ink);font-size:.75rem}.connected-input svg{color:var(--studio-muted);flex-shrink:0}.story-screen{position:relative;overflow:hidden;aspect-ratio:var(--screen-ratio);border:1px solid var(--studio-border-control);background:var(--studio-surface);box-shadow:0 1rem 2rem #00000018}.story-screen img{object-fit:contain}.story-screen-desktop{border-radius:.75rem}.story-screen-phone{border-radius:14%/6.44%;outline:3px solid var(--studio-surface);outline-offset:2px}.connected-builder .story-screen{transform:translateY(.5rem)}.connected-visitor{max-width:13rem;width:100%;justify-self:end}.connected-wires{position:absolute;inset:0 0 auto;width:100%;height:100%;z-index:1;overflow:visible}.connected-landscape{position:absolute;z-index:0;bottom:2rem;left:calc(-1 * clamp(1.5rem, 3.1vw, 4rem));width:100cqw;max-width:none;height:auto;max-height:100%;object-fit:cover;object-position:center bottom;pointer-events:none}.connected-captions{position:relative;z-index:4;display:flex;justify-content:space-between;gap:1rem;padding:0 2rem;font-family:var(--font-mono),monospace;font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--studio-muted)}.project-proof{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.3fr);align-items:center;gap:3rem;padding:3rem 0;border-block:1px solid var(--studio-line)}.project-proof-copy{display:flex;flex-direction:column;align-items:flex-start;gap:1.5rem}.project-proof-copy>p{max-width:40ch}.proof-facts{display:grid;grid-template-columns:.9fr .9fr 1.2fr;gap:1.5rem;padding-top:1rem;width:100%}.proof-facts>div{display:grid;align-content:start;gap:1rem;border-top:1px solid var(--studio-line);padding-top:1rem}.proof-facts dt{font-family:var(--font-mono),monospace;font-size:.625rem;text-transform:uppercase;color:var(--studio-label-ink)}.proof-facts dd{color:var(--studio-ink);font-size:.75rem;line-height:1.6}.proof-screens{position:relative;padding:0 13% 2rem 0}.proof-screens .story-screen-phone{position:absolute;width:27%;right:0;bottom:0}.visual-story,.work-story-list{scroll-margin-top:6rem}.visual-story{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:center;gap:4rem;padding:2rem 0;border-bottom:1px solid var(--studio-line)}.visual-story-reverse{grid-template-columns:minmax(0,1fr) minmax(0,1.3fr)}.visual-story-reverse .visual-story-copy{grid-column:1;grid-row:1}.visual-story-reverse .visual-story-art{grid-column:2}.visual-story-copy{display:flex;flex-direction:column;align-items:flex-start;gap:1.5rem}.visual-story-copy .studio-action-link{text-align:left;white-space:normal}.story-rule{height:2px;width:2rem;background:var(--studio-focus)}.story-diagram{width:100%;height:auto;display:block;overflow:visible;color:var(--studio-muted)}.story-diagram text{fill:var(--studio-ink);font-family:var(--font-display),sans-serif;font-size:13px}.story-diagram .diagram-secondary{fill:var(--studio-muted);font-size:11px}.diagram-panel,.diagram-phone{fill:var(--studio-canvas);stroke:var(--studio-border-control);stroke-width:1}.diagram-phone{stroke-width:1.5}.diagram-divider{fill:none;stroke:var(--studio-line)}.diagram-wire{fill:none;stroke:var(--studio-accent);stroke-opacity:.55;stroke-width:1.25}.diagram-signal{fill:none;stroke:var(--studio-focus);stroke-width:3;stroke-linecap:round;stroke-dasharray:2 650;stroke-dashoffset:0;opacity:0;animation:story-flow 10s linear infinite}.diagram-draft-wire{stroke:var(--studio-muted);stroke-dasharray:3 5}.diagram-icon{color:var(--studio-accent)}.diagram-accent{fill:var(--studio-action-fill)}.diagram-orange{fill:var(--studio-focus)}.diagram-muted-fill{fill:var(--studio-muted)}.diagram-field{fill:var(--studio-surface);stroke:var(--studio-line)}.diagram-ink-line{stroke:var(--studio-border-control);stroke-width:2;stroke-linecap:round}.diagram-content-line{fill:none;stroke:var(--studio-line);stroke-width:5;stroke-linecap:round}.diagram-image{fill:color-mix(in srgb,var(--studio-line) 65%,var(--studio-surface))}.diagram-mountain{fill:var(--studio-border-control);opacity:.65}.diagram-ink-fill{fill:var(--studio-muted)}.diagram-notch{fill:var(--studio-line)}.story-diagram .diagram-button-label{fill:var(--studio-accent-ink);font-size:8px}.diagram-edit-highlight,.diagram-preview-highlight{fill:none;stroke:var(--studio-accent);stroke-width:1.5;opacity:0;animation:story-edit 10s ease-in-out infinite}.diagram-preview-highlight{animation-delay:2s}.motion-scene [class*=diagram-]{animation-play-state:paused}.motion-scene[data-running=true] [class*=diagram-]{animation-play-state:running}.motion-scene[data-running=true] .story-diagram{animation:story-arrive .75s cubic-bezier(.22,1,.36,1) both}.story-motion-scope[data-motion=paused] *,.story-motion-scope[data-motion=paused] :before{animation-play-state:paused!important}@keyframes story-flow{0%,12%{opacity:0;stroke-dashoffset:0}16%,43%{opacity:1}53%,to{opacity:0;stroke-dashoffset:-650}}@keyframes story-edit{0%,10%,55%,to{opacity:0}20%,40%{opacity:.9}}@keyframes story-arrive{0%{transform:translateY(12px)}to{transform:translateY(0)}}.work-closing{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:4rem 0}.work-closing-actions{display:flex;flex-wrap:wrap;gap:1rem}.work-closing h2{font-size:clamp(1.5rem,2.5vw,2.5rem)}.story-detail-header{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:3rem;padding:2rem 0}.story-detail-header h1{font-size:clamp(2.5rem,4.5vw,4.5rem);line-height:1.05;font-weight:600;letter-spacing:-.05em;margin:0}.story-related{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;padding:2rem 0;border-top:1px solid var(--studio-line)}.work-detail .work-chapter{border-top:1px solid var(--studio-line);padding-top:3rem}.work-detail .mobile-work-gallery button{aspect-ratio:1206/2622!important}.work-detail .mobile-work-gallery img{object-fit:contain!important}.rail-work-subnav{display:grid;gap:.25rem;padding:.25rem 0 .5rem 1.75rem}.rail-work-subnav a{min-height:2rem;display:flex;align-items:center;color:var(--studio-muted);font-family:var(--font-mono),monospace;font-size:.65rem}.rail-work-subnav a:hover,.rail-work-subnav a[aria-current=page]{color:var(--studio-label-ink)}@media (max-width:1100px){.connected-products{gap:1rem;padding-inline:0;padding-bottom:8rem}.connected-input{gap:.5rem;padding:.5rem;font-size:.65rem}.connected-input-list{gap:.75rem;padding-top:1rem}.project-proof,.visual-story{gap:2rem}.work-closing{align-items:flex-start;flex-direction:column}}@media (max-width:760px){.work-overview{padding:7.5rem 1.25rem 0}.story-motion-toolbar{top:4.75rem;right:1rem}.work-opening{gap:2rem}.work-overview h1{font-size:clamp(2.5rem,8.5vw,4rem)}.connected-products{grid-template-columns:minmax(0,1fr) minmax(0,.42fr);gap:1.5rem;padding-bottom:7rem}.connected-inputs{display:none!important}.connected-label-detail{display:none}.connected-products>div>p{font-size:.5rem;letter-spacing:.06em;white-space:normal;min-height:3.25rem;overflow-wrap:anywhere}.connected-products>div{gap:.5rem}.connected-landscape{width:130%;left:-15%;bottom:2rem}.connected-scene{overflow:clip}.connected-captions{padding:0;font-size:.5rem}.connected-captions span:first-child,.connected-wires{display:none}.project-proof{grid-template-columns:1fr;gap:2rem;padding:3rem 0}.proof-screens{width:100%;max-width:36rem}.visual-story,.visual-story-reverse{grid-template-columns:1fr;gap:1.5rem;padding:3rem 0}.visual-story .visual-story-copy{grid-column:1;grid-row:1}.visual-story .visual-story-art{grid-column:1;grid-row:2}.visual-story-copy{gap:1rem}.visual-story-art{max-width:36rem}.story-detail-header{grid-template-columns:1fr;gap:2rem;padding:4rem 0 0}.work-detail .mobile-work-gallery{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;overflow:visible}}@media (prefers-reduced-motion:reduce){.story-motion-scope *,.story-motion-scope :before{animation:none!important;transition:none!important;scroll-behavior:auto!important}.diagram-signal{opacity:0}}.room-content:has(.work-overview)>.room-footer{display:block;padding-block:1.5rem}.room-content:has(.work-overview)>.room-footer>div:first-child{display:none}.room-content:has(.work-overview) .footer-actions{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;gap:1.5rem;width:100%}.visual-story-art{width:100%;max-width:35rem}.diagram-packet{fill:none;stroke:var(--studio-focus);stroke-width:4;stroke-linecap:round;stroke-dasharray:.045 1;opacity:0}.diagram-stage{opacity:1}.diagram-emphasis{fill:none}.diagram-active-input,.diagram-emphasis{stroke:var(--studio-accent);stroke-width:2}.diagram-active-input{fill:var(--studio-accent);fill-opacity:.16}.diagram-new-content{fill:none;stroke:var(--studio-accent);stroke-width:3;stroke-linecap:round}.diagram-empty-line{fill:none;stroke:var(--studio-line);stroke-width:3;stroke-linecap:round;opacity:.45}.diagram-ready-check{color:var(--studio-accent-ink)}.diagram-decision-input-0{animation:decision-input-0 16s ease-in-out infinite both}@keyframes decision-input-0{0%,1.875%{opacity:0}4.0625%,9.375%{opacity:1}12.5%,to{opacity:0}}.diagram-decision-packet-0{animation:decision-packet-0 16s linear infinite both}@keyframes decision-packet-0{0%,5.625%{opacity:0;stroke-dashoffset:.06}6.25%{opacity:1}11.875%{opacity:1}12.5%,to{opacity:0;stroke-dashoffset:-1}}.diagram-decision-row-0{animation:decision-row-0 16s ease-in-out infinite both}@keyframes decision-row-0{0%,12.5%{opacity:0}14.6875%,87.5%{opacity:1}90.625%,to{opacity:0}}.diagram-decision-input-1{animation:decision-input-1 16s ease-in-out infinite both}@keyframes decision-input-1{0%,14.375%{opacity:0}16.5625%,21.875%{opacity:1}25%,to{opacity:0}}.diagram-decision-packet-1{animation:decision-packet-1 16s linear infinite both}@keyframes decision-packet-1{0%,18.125%{opacity:0;stroke-dashoffset:.06}18.75%{opacity:1}24.375%{opacity:1}25%,to{opacity:0;stroke-dashoffset:-1}}.diagram-decision-row-1{animation:decision-row-1 16s ease-in-out infinite both}@keyframes decision-row-1{0%,25%{opacity:0}27.1875%,87.5%{opacity:1}90.625%,to{opacity:0}}.diagram-decision-input-2{animation:decision-input-2 16s ease-in-out infinite both}@keyframes decision-input-2{0%,26.875%{opacity:0}29.0625%,34.375%{opacity:1}37.5%,to{opacity:0}}.diagram-decision-packet-2{animation:decision-packet-2 16s linear infinite both}@keyframes decision-packet-2{0%,30.625%{opacity:0;stroke-dashoffset:.06}31.25%{opacity:1}36.875%{opacity:1}37.5%,to{opacity:0;stroke-dashoffset:-1}}.diagram-decision-row-2{animation:decision-row-2 16s ease-in-out infinite both}@keyframes decision-row-2{0%,37.5%{opacity:0}39.6875%,87.5%{opacity:1}90.625%,to{opacity:0}}.diagram-decision-input-3{animation:decision-input-3 16s ease-in-out infinite both}@keyframes decision-input-3{0%,39.375%{opacity:0}41.5625%,46.875%{opacity:1}50%,to{opacity:0}}.diagram-decision-packet-3{animation:decision-packet-3 16s linear infinite both}@keyframes decision-packet-3{0%,43.125%{opacity:0;stroke-dashoffset:.06}43.75%{opacity:1}49.375%{opacity:1}50%,to{opacity:0;stroke-dashoffset:-1}}.diagram-decision-row-3{animation:decision-row-3 16s ease-in-out infinite both}@keyframes decision-row-3{0%,50%{opacity:0}52.1875%,87.5%{opacity:1}90.625%,to{opacity:0}}.diagram-decision-result-packet{animation:decision-result-packet 16s linear infinite both}@keyframes decision-result-packet{0%,56.25%{opacity:0;stroke-dashoffset:.06}56.875%{opacity:1}63.75%{opacity:1}64.375%,to{opacity:0;stroke-dashoffset:-1}}.diagram-decision-result{animation:decision-result 16s ease-in-out infinite both}@keyframes decision-result{0%,64.375%{opacity:0}66.5625%,87.5%{opacity:1}90.625%,to{opacity:0}}.diagram-mobile-ios{animation:mobile-ios 16s ease-in-out infinite both}@keyframes mobile-ios{0%,40.625%{opacity:0}42.8125%,87.5%{opacity:1}90.625%,to{opacity:0}}.diagram-mobile-android{animation:mobile-android 16s ease-in-out infinite both}@keyframes mobile-android{0%,56.25%{opacity:0}58.4375%,87.5%{opacity:1}90.625%,to{opacity:0}}.diagram-mobile-ios-packet{animation:mobile-ios-packet 16s linear infinite both}@keyframes mobile-ios-packet{0%,34.375%{opacity:0;stroke-dashoffset:.06}35%{opacity:1}40%{opacity:1}40.625%,to{opacity:0;stroke-dashoffset:-1}}.diagram-mobile-android-packet{animation:mobile-android-packet 16s linear infinite both}@keyframes mobile-android-packet{0%,50%{opacity:0;stroke-dashoffset:.06}50.625%{opacity:1}55.625%{opacity:1}56.25%,to{opacity:0;stroke-dashoffset:-1}}@media (prefers-reduced-motion:reduce){.story-diagram .diagram-stage{opacity:1}.story-diagram .diagram-packet{opacity:0}}.diagram-writing{fill:none;stroke:var(--studio-accent);stroke-width:5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}.diagram-writing-first{animation:preview-write-first 12s linear infinite both}.diagram-writing-second{animation:preview-write-second 12s linear infinite both}@keyframes preview-write-first{0%,8%{stroke-dashoffset:1;opacity:0}9%{opacity:1}32%,86%{stroke-dashoffset:0;opacity:1}94%,to{stroke-dashoffset:0;opacity:0}}@keyframes preview-write-second{0%,38%{stroke-dashoffset:1;opacity:0}39%{opacity:1}66%,86%{stroke-dashoffset:0;opacity:1}94%,to{stroke-dashoffset:0;opacity:0}}.diagram-connection{fill:none;stroke:var(--studio-border-control);stroke-width:2}.diagram-arrowhead{fill:none;stroke:var(--studio-accent);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.story-diagram .diagram-label-large{font-size:20px;font-weight:500}.story-diagram .diagram-stack-detail{font-size:17px;fill:var(--studio-muted)}.story-diagram .diagram-preview-label{font-size:15px}.diagram-stack-rules{animation:stack-rules 12s ease-in-out infinite both}.diagram-stack-data{animation:stack-data 12s ease-in-out infinite both}.diagram-stack-clients{animation:stack-clients 12s ease-in-out infinite both}@keyframes stack-rules{0%,72%,8%,to{opacity:0}18%,35%{opacity:1}}@keyframes stack-data{0%,30%,85%,to{opacity:0}40%,56%{opacity:1}}@keyframes stack-clients{0%,54%,94%,to{opacity:0}64%,80%{opacity:1}}