@font-face{font-family:Manrope;src:url('/assets/manrope.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{--paper:#fff;--ink:#242622;--muted:#62655f;--line:#dce3e1;--accent:#424840;--wash:#fafbf9;--gutter:clamp(22px,5vw,88px);font-family:Manrope,-apple-system,BlinkMacSystemFont,'Helvetica Neue',sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}html{scroll-padding-top:100px}body{margin:0;font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none;touch-action:manipulation}a:hover{text-decoration:underline;text-underline-offset:5px}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:5px}button{font:inherit;touch-action:manipulation}h1,h2,h3,p{overflow-wrap:break-word}.accent{color:var(--accent)}.opening-skip{position:fixed;top:-100px;left:var(--gutter);z-index:20;background:white;padding:12px}.opening-skip:focus{top:10px}
.opening-header{height:88px;position:absolute;inset:0 0 auto;z-index:5;padding-inline:var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;border-bottom:1px solid var(--line)}.opening-brand{font-size:15px;font-weight:750;letter-spacing:-.04em;white-space:nowrap}.opening-header nav{display:flex;align-items:center;gap:32px;font-size:14px}.opening-header nav>a,.opening-languages a{display:inline-flex;align-items:center;min-height:44px}.opening-languages{display:flex;gap:8px;align-items:center}.opening-languages a{color:var(--muted);min-width:24px;justify-content:center}.opening-languages [aria-current]{color:var(--ink);text-decoration:underline;text-underline-offset:5px}.opening-languages>span{color:var(--muted)}
.selected-work{padding-inline:var(--gutter);max-width:1800px;margin:auto}.work-piece{padding:80px 0;display:grid;grid-template-columns:.8fr 1.2fr;gap:7%;align-items:center;border-top:1px solid var(--line);isolation:isolate}.work-copy{min-width:0}.work-index{display:flex;gap:18px;align-items:center;font-size:12px;color:var(--muted);margin:0 0 26px}.work-index img{width:48px;height:48px;object-fit:contain;border-radius:12px}.work-copy h2{font-size:clamp(35px,4.1vw,64px);font-weight:550;letter-spacing:-.06em;line-height:1.08;margin:0 0 24px}.work-summary{font-size:clamp(17px,1.5vw,21px);line-height:1.6;max-width:460px;margin:0 0 22px}.work-stack{font-size:13px;color:var(--muted);max-width:400px;margin:0 0 20px;line-height:1.65}.work-link{display:inline-flex;align-items:center;gap:24px;min-height:44px;border-bottom:1px solid var(--line);font-size:14px}.project-status,.release-status{font-size:12px;margin:-10px 0 20px;color:var(--accent);font-weight:650}.project-status{border-left:2px solid var(--accent);padding-left:10px}.product-references{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:20px;font-size:13px}.product-references a{display:inline-flex;align-items:center;gap:9px;min-height:44px}.reference-icon{width:19px;height:19px;flex-shrink:0}.apple-icon{width:16px}.work-images{min-width:0;padding:28px;background:var(--wash);border-radius:3px;display:flex;align-items:center;justify-content:center}.work-gallery{width:100%;min-width:0}.shot-link{display:flex;flex-direction:column;align-items:center}.shot-link img{display:block;width:min(100%,calc(57svh * var(--shot-aspect,1)));height:auto;aspect-ratio:var(--shot-aspect,auto);max-width:100%;max-height:57svh;object-fit:contain;border:1px solid #d2dbd6;border-radius:4px}.image-zoom{font-size:11px;color:var(--muted);margin-top:12px;align-self:flex-end}.shot-tabs{display:flex;gap:20px;flex-wrap:wrap;margin:0 0 12px;justify-content:center}.shot-tabs button{display:none;font-size:12px;min-height:44px;padding:8px 2px;border:0;border-bottom:1px solid transparent;color:var(--muted);background:none;cursor:pointer}.has-gallery .shot-tabs button{display:block}.shot-tabs [aria-pressed=true]{border-color:var(--accent);color:var(--accent)}.mynabi{grid-template-columns:1.1fr .9fr}.mynabi .work-images{grid-column:1;grid-row:1}.mynabi .work-copy{grid-column:2;grid-row:1}.mynabi .work-images,.nova-rush .work-images{padding:24px 28px;background:#f0f3f1}.nova-rush .work-images{background:#f1f2f4}.emberwatch .work-images{background:#f3f1ed}.quietshield .work-images{background:#edf3f1}.chapter-progress{display:none}.chapter-progress>span{display:block;height:1px;background:var(--accent);transform-origin:left;transform:scaleX(0)}
.technology-section{margin:0 var(--gutter);padding:110px 0 85px;border-top:1px solid var(--line);display:grid;grid-template-columns:.9fr 1.1fr;gap:9vw;align-items:start;scroll-margin-top:80px}.technology-heading{position:sticky;top:140px;max-width:480px}.technology-heading h2{font-size:clamp(36px,4vw,60px);line-height:1.06;letter-spacing:-.06em;font-weight:550;margin:0 0 26px}.technology-heading>p:last-child{max-width:350px;color:var(--muted);font-size:16px;line-height:1.7}.technology-area{padding:0 0 36px;margin:0 0 36px;border-bottom:1px solid var(--line);position:relative}.technology-number{font-size:11px;color:var(--accent);display:block;margin-bottom:16px}.technology-area h3{font-size:27px;letter-spacing:-.045em;margin:0 0 18px;font-weight:600}.technology-stack{font-size:15px;font-weight:650;margin:0 0 16px}.technology-description{font-size:14px;color:var(--muted);line-height:1.75;margin:0 0 18px}.technology-examples{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:12px}.technology-examples a{min-height:44px;display:inline-flex;align-items:center;gap:6px;border-bottom:1px solid var(--line)}.technology-next{font-size:15px;color:var(--muted);line-height:1.7}.technology-next .section-label{margin-bottom:12px}.technology-next a{display:inline-flex;align-items:center;min-height:44px;color:var(--accent);font-size:13px}
.build-together{padding:110px var(--gutter);background:var(--wash);border-top:1px solid var(--line)}.closing-label{font-size:11px;letter-spacing:.1em;color:var(--accent);margin:0 0 32px}.build-together h2{font-size:clamp(44px,6.5vw,96px);line-height:1.02;letter-spacing:-.065em;font-weight:550;margin:0 0 50px}.closing-bottom{display:flex;justify-content:space-between;gap:40px;align-items:flex-end}.closing-bottom>p{font-size:18px;color:var(--muted);margin:0}.closing-actions{display:flex;flex-direction:column;align-items:flex-start;gap:20px}.closing-primary{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;min-height:58px;background:var(--accent);color:white;padding:16px 24px;font-size:15px;border-radius:3px}.closing-primary:hover{background:#11564e;text-decoration:none}.closing-email{font-size:15px;overflow-wrap:anywhere;min-height:44px;display:flex;align-items:center}.opening-footer{padding:36px var(--gutter);border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:36px;font-size:12px}.opening-footer>div{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px 24px;color:var(--muted)}.opening-footer a{display:inline-flex;align-items:center;min-height:44px}.opening-footer span{align-self:center}
.image-dialog{width:min(1320px,calc(100vw - 48px));height:92svh;max-width:none;max-height:none;padding:0;border:1px solid var(--line);background:var(--paper);color:var(--ink)}.image-dialog[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}.image-dialog::backdrop{background:#10160ec4}.viewer-header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:20px 28px;border-bottom:1px solid var(--line)}.viewer-label{font-size:12px;letter-spacing:.06em;color:var(--muted)}.viewer-header h2{font-size:24px;font-weight:550;letter-spacing:-.04em;margin:3px 0 0}.image-dialog button{font:14px Manrope,sans-serif;min-height:44px;min-width:44px;border:1px solid var(--line);background:var(--paper);color:var(--ink);padding:10px 14px;cursor:pointer}.image-dialog button:disabled{opacity:.35;cursor:default}.viewer-close{display:flex;align-items:center;gap:18px}.viewer-close>span{font-size:22px}.viewer-canvas{min-height:0;overflow:auto;overscroll-behavior:contain;display:flex;align-items:center;justify-content:center;padding:20px}.viewer-image{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;flex-shrink:0}.viewer-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:16px 28px;border-top:1px solid var(--line)}.viewer-caption{font-size:14px;color:var(--muted);margin:0;max-width:700px}.viewer-controls{display:flex;align-items:center;gap:10px;flex-shrink:0}.viewer-count{font-size:14px;min-width:38px;text-align:center}.image-dialog.is-zoomed .viewer-canvas{display:block}.image-dialog.is-zoomed .viewer-image{max-width:none;max-height:none;width:160%;height:auto;margin:0}.gallery-open{overflow:hidden}@media(max-width:700px){.image-dialog{width:100%;height:100dvh;border:0;margin:0}.viewer-header{padding:16px 18px}.viewer-header h2{font-size:21px}.viewer-canvas{padding:16px}.viewer-footer{padding:12px 16px max(20px,env(safe-area-inset-bottom));flex-direction:column;align-items:stretch;gap:12px}.viewer-controls{justify-content:center}.viewer-caption{font-size:13px}.viewer-label{font-size:11px}.image-dialog button{font-size:12px;padding:8px}}
/* Reserve image geometry before lazy decoding; no inline styles required by CSP. */
.shot-link img[src$="/assets/volpe-order-editor.png"]{--shot-aspect:1.4545454545454546}
.shot-link img[src$="/assets/volpe-orders.jpg"]{--shot-aspect:1.273}
.shot-link img[src$="/assets/nova-gameplay.jpg"]{--shot-aspect:0.46}
.shot-link img[src$="/assets/nova-hangar.jpg"]{--shot-aspect:0.46}
.shot-link img[src$="/assets/ember-realms-web.jpg"]{--shot-aspect:2.1739130434782608}
.shot-link img[src$="/assets/ember-battle-web.jpg"]{--shot-aspect:1.3333333333333333}
.shot-link img[src$="/assets/mynabi-today.jpg"]{--shot-aspect:0.46006389776357826}
.shot-link img[src$="/assets/quiet-capabilities.png"]{--shot-aspect:1.5533980582524272}
.shot-link img[src$="/assets/quiet-file-analysis.png"]{--shot-aspect:1.5533980582524272}
/* The approved centered typographic sequence. Every beat is readable without scripting. */
.eyebrow,.section-label{font-size:12px;letter-spacing:.08em;color:var(--muted);margin:0 0 26px}
.opening-header{border-bottom:0}.manifesto{padding-top:88px}.beat{min-height:85svh;padding:90px var(--gutter);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.beat h1,.beat h2{font-size:clamp(40px,7vw,100px);line-height:1.06;letter-spacing:-.065em;font-weight:550;margin:0}.identity h1{font-size:clamp(38px,7.4vw,106px);white-space:nowrap}.identity p{font-size:17px;color:var(--muted);margin:28px 0 0}.capabilities h2{font-size:clamp(34px,5.5vw,76px);line-height:1.25;letter-spacing:-.05em}.capabilities h2 span{display:block}.capability-note{font-size:13px;color:var(--muted);margin-top:24px}.technology h2{font-size:clamp(36px,5.8vw,80px)}.tech-line{font-size:clamp(20px,2.4vw,30px);letter-spacing:-.025em;margin:28px 0 0}.tech-line>span{color:var(--muted);padding-inline:8px}.tech-roles,.tech-future{font-size:14px;color:var(--muted);margin:12px 0 0}.technology-jump{font-size:13px;display:inline-flex;align-items:center;min-height:44px;margin-top:12px;border-bottom:1px solid var(--line)}.work-intro h2{font-size:clamp(38px,6.5vw,92px)}.scroll-cue{display:none}.scroll-track{display:none}
.project-title{display:none}.work-copy{text-align:center}.work-index{justify-content:center}.work-summary,.work-stack{margin-inline:auto}.product-references{justify-content:center}.work-images,.mynabi .work-images,.nova-rush .work-images,.emberwatch .work-images,.quietshield .work-images{background:transparent}.work-images{position:static}.shot-tabs{justify-content:center}.shot-tabs button{min-width:60px}.image-zoom{align-self:center}.shot-link img{border-radius:3px}.technology-section{text-align:center;display:block}.technology-heading{position:static;margin:0 auto 65px;max-width:850px}.technology-heading>p:last-child{max-width:600px;margin-inline:auto}.technology-areas{max-width:1100px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:44px 70px}.technology-area{padding-bottom:32px;margin:0}.technology-description{max-width:470px;margin-inline:auto}.technology-examples{justify-content:center}.technology-next{grid-column:1/-1;max-width:700px;margin:auto}.build-together{text-align:center;background:white}.closing-bottom{flex-direction:column;align-items:center;gap:30px}.closing-actions{align-items:center}.closing-primary{background:var(--ink)}
/* Animate only opacity and transform. The compatibility path uses the same scroll positions. */
@media(prefers-reduced-motion:no-preference) and (min-height:500px) and (min-width:320px){
.scroll-story .opening-header{position:fixed}
.scroll-story .manifesto{padding:0;height:340svh;view-timeline:--intro block;view-timeline-inset:0}
.scroll-story .manifesto-stage{height:100svh;position:sticky;top:0;overflow:clip}
.scroll-story .beat{position:absolute;inset:88px var(--gutter) 84px;min-height:0;padding:0;opacity:0;pointer-events:none;animation-duration:1ms;animation-timing-function:linear;animation-fill-mode:both;animation-timeline:--intro;animation-range:contain 0% contain 100%}
.scroll-story .identity{animation-name:center-identity}.scroll-story .build{animation-name:center-build}.scroll-story .capabilities{animation-name:center-capabilities}.scroll-story .technology{animation-name:center-technology}.scroll-story .work-intro{animation-name:center-work}
.scroll-story .scroll-cue{display:flex;position:absolute;bottom:32px;left:var(--gutter);right:var(--gutter);justify-content:space-between;align-items:center;min-height:44px;font-size:13px;color:var(--muted)}.scroll-cue>span{font-size:22px}
.scroll-story .scroll-track{display:block;position:absolute;bottom:18px;left:var(--gutter);right:var(--gutter);height:1px;background:var(--line)}.scroll-track>span{display:block;height:1px;background:var(--ink);transform-origin:left;animation:timeline-progress 1ms linear both;animation-timeline:--intro;animation-range:contain 0% contain 100%}
}
@keyframes center-identity{0%,10%{opacity:1;transform:translateY(0)}16%,100%{opacity:0;transform:translateY(-16px)}}
@keyframes center-build{0%,16%{opacity:0;transform:translateY(16px)}21%,28%{opacity:1;transform:translateY(0)}34%,100%{opacity:0;transform:translateY(-16px)}}
@keyframes center-capabilities{0%,34%{opacity:0;transform:translateY(16px)}39%,48%{opacity:1;transform:translateY(0)}54%,100%{opacity:0;transform:translateY(-16px)}}
@keyframes center-technology{0%,54%{opacity:0;transform:translateY(16px)}59%,76%{opacity:1;transform:translateY(0)}82%,100%{opacity:0;transform:translateY(-16px)}}
@keyframes center-work{0%,84%{opacity:0;transform:translateY(16px)}90%,100%{opacity:1;transform:translateY(0)}}
@keyframes timeline-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(prefers-reduced-motion:no-preference) and (min-width:901px) and (min-height:700px){
.scroll-story .project-chapter{height:170svh;view-timeline:--project block;view-timeline-inset:0}.scroll-story .work-piece{position:sticky;top:0;height:100svh;padding:112px 0 32px;border:0}.scroll-story .project-title{position:absolute;inset:88px 0 60px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;text-align:center;pointer-events:none;animation:project-identity 1ms linear both;animation-timeline:--project;animation-range:contain 0% contain 100%}.project-title img{width:64px;height:64px;object-fit:contain;border-radius:14px}.project-title>span{font-size:clamp(40px,6vw,84px);letter-spacing:-.055em;line-height:1.1;font-weight:550}.project-title>small{font-size:14px;color:var(--muted)}.scroll-story .work-copy,.scroll-story .work-images{animation:project-detail 1ms linear both;animation-timeline:--project;animation-range:contain 0% contain 100%}.scroll-story .chapter-progress{display:block;position:absolute;bottom:0;left:0;width:100%;height:1px;background:var(--line)}.chapter-progress>span{animation:timeline-progress 1ms linear both;animation-timeline:--project;animation-range:contain 0% contain 100%}
}
@keyframes project-identity{0%,15%{opacity:1;transform:translateY(0)}35%,100%{opacity:0;transform:translateY(-14px)}}
@keyframes project-detail{0%,25%{opacity:0;transform:translateY(14px)}45%,100%{opacity:1;transform:translateY(0)}}
@media(max-width:1000px){.opening-header nav{gap:22px}.work-piece{gap:5%;grid-template-columns:.95fr 1.05fr}.work-copy h2{font-size:36px}.work-images{padding:20px}.work-index{margin-bottom:18px}.work-summary{font-size:17px}.opening-footer{flex-direction:column}.opening-footer>div{justify-content:flex-start}}
@media(max-width:900px){.selected-work{max-width:800px}.work-piece,.mynabi{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:50px 0 75px}.work-copy{order:1;position:static;padding:26px 0 0;margin:0;box-shadow:none}.work-images{order:0;position:static;padding:22px 16px}.work-copy h2{font-size:40px;margin-bottom:24px}.work-index{font-size:12px;margin-bottom:22px}.work-summary{font-size:18px;max-width:550px;line-height:1.6}.work-stack{font-size:13px;margin-bottom:16px}.shot-link img{width:min(100%,calc(54svh * var(--shot-aspect,1)));max-height:54svh}.mynabi .work-images,.nova-rush .work-images{padding:20px 16px}.shot-tabs{gap:18px;margin:0 0 14px}.shot-tabs button{font-size:13px}.image-zoom{font-size:12px}.technology-section{padding:80px 0 60px}.technology-heading h2{font-size:40px}.technology-areas{gap:38px}.technology-area h3{font-size:25px}.technology-description{font-size:15px}.build-together{padding:80px var(--gutter)}.build-together h2{font-size:54px}.closing-bottom>p{font-size:17px}.opening-footer{padding-block:28px;gap:18px}.opening-footer>div{gap:4px 20px;font-size:12px}}
@media(max-width:600px){:root{--gutter:22px}.opening-header{height:72px;gap:12px}.opening-brand{font-size:13px}.opening-header nav{gap:15px;font-size:12px}.opening-languages{gap:6px}.manifesto{padding-top:72px}.beat{padding:60px var(--gutter);min-height:80svh}.beat h1{font-size:clamp(30px,8.5vw,50px);letter-spacing:-.06em}.identity p{font-size:15px;max-width:310px;line-height:1.6;margin-top:22px}.build h2{font-size:clamp(48px,13vw,76px)}.capabilities h2{font-size:clamp(27px,7vw,42px);line-height:1.4}.capability-note{font-size:12px;max-width:290px}.technology h2{font-size:clamp(35px,9.5vw,55px)}.tech-line{font-size:21px;line-height:1.6;margin-top:22px}.tech-line>span{padding-inline:2px}.tech-roles,.tech-future{font-size:13px}.work-intro h2{font-size:clamp(32px,8.8vw,52px)}.scroll-story .beat{inset:72px var(--gutter) 76px}.technology-areas{display:block}.technology-area{margin-bottom:36px}.technology-heading{margin-bottom:45px}.technology-heading h2{font-size:36px}.technology-heading>p:last-child{font-size:16px}.technology-examples{font-size:13px}.build-together h2{font-size:43px}.closing-actions{width:100%;gap:12px}.closing-primary{width:100%;font-size:14px}.work-copy h2{font-size:37px}.work-summary{font-size:17px}.product-references{font-size:13px}}
@media(max-width:360px){:root{--gutter:18px}.opening-header nav{gap:10px}.opening-brand{font-size:12px}}
@media(prefers-reduced-motion:reduce){.technology-heading,.work-images{position:static}.beat{min-height:0;padding-block:65px}.identity{min-height:70svh}}
@media(max-width:900px){.project-title{display:flex;order:-1;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center;padding:24px 0 42px}.project-title img{width:56px;height:56px;object-fit:contain;border-radius:12px}.project-title>span{font-size:38px;letter-spacing:-.055em;font-weight:550;line-height:1.1}.project-title>small{font-size:13px;color:var(--muted)}.work-copy h2{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;margin:0;padding:0}.work-summary{margin-top:0}.project-status,.release-status{margin-top:0}.work-index{margin-bottom:20px}}

@media(prefers-reduced-motion:no-preference) and (min-height:500px) and (min-width:320px){.scroll-story .technology-jump{pointer-events:auto}.js-scroll .beat,.js-scroll .scroll-track>span{animation:none}}
@media(prefers-reduced-motion:no-preference) and (min-width:901px) and (min-height:700px){.js-scroll .project-title,.js-scroll .work-copy,.js-scroll .work-images,.js-scroll .chapter-progress>span{animation:none}}

@media(min-height:500px) and (max-height:699px) and (max-width:900px){.scroll-story .technology h2{font-size:30px}.scroll-story .tech-line{font-size:18px;margin-top:14px}.scroll-story .tech-roles,.scroll-story .tech-future{font-size:12px;margin-top:6px}.scroll-story .technology-jump{margin-top:6px}.scroll-story .capabilities h2{font-size:27px;line-height:1.25}.scroll-story .capability-note{margin-top:14px}}
/* Longer travel gives each scene time to arrive and settle. */
@media(prefers-reduced-motion:no-preference) and (min-height:500px) and (min-width:320px){.scroll-story .manifesto{height:420svh}.scroll-story .beat{animation-timing-function:ease-in-out}}
@media(prefers-reduced-motion:no-preference) and (min-width:901px) and (min-height:700px){.scroll-story .project-chapter{height:210svh}.scroll-story .project-title,.scroll-story .work-copy,.scroll-story .work-images{animation-timing-function:ease-in-out}}
@keyframes soft-arrival{from{transform:translateY(28px)}to{transform:translateY(0)}}
@keyframes image-arrival{from{opacity:.3}to{opacity:1}}
@media(prefers-reduced-motion:no-preference){.motion-native .motion-arrival{animation:soft-arrival 1ms cubic-bezier(.2,.65,.25,1) both;animation-timeline:view();animation-range:entry 0% entry 90%}}
@view-transition{navigation:auto}
::view-transition-old(root){animation-duration:180ms}
::view-transition-new(root){animation-duration:240ms}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none}}
.analytics-consent[hidden],[data-analytics-preferences][hidden]{display:none}.analytics-consent{position:fixed;z-index:30;right:24px;bottom:24px;width:min(430px,calc(100% - 32px));padding:22px;background:#fff;border:1px solid var(--line);box-shadow:0 8px 32px #0000000d;font-size:13px}.analytics-consent p{margin:0 0 12px;line-height:1.6}.analytics-consent a{text-decoration:underline}.analytics-consent>div{display:flex;gap:12px}.analytics-consent button{flex:1;min-height:44px;padding:8px;border:1px solid var(--ink);background:white;color:var(--ink);font-size:13px;cursor:pointer}.opening-footer [data-analytics-preferences]{padding:0;border:0;background:none;color:var(--muted);font:inherit;min-height:44px;cursor:pointer}@media(max-width:600px){.analytics-consent{right:16px;bottom:max(16px,env(safe-area-inset-bottom));padding:18px}}

@media(prefers-reduced-motion:no-preference){.motion-native .motion-arrival img{animation:image-arrival 1ms ease-out both;animation-timeline:view();animation-range:entry 0% entry 90%}}
/* Each product is a discovery: identity, real screen, then explanation. */
@keyframes app-identity{0%,18%{opacity:1;transform:translateY(0)}30%,100%{opacity:0;transform:translateY(-18px)}}
@keyframes app-screen{0%,23%{opacity:0;transform:translateY(18px)}38%,62%{opacity:1;transform:translateY(0)}74%,100%{opacity:0;transform:translateY(-18px)}}
@keyframes app-explanation{0%,68%{opacity:0;transform:translateY(18px)}82%,100%{opacity:1;transform:translateY(0)}}
@keyframes app-screen-desktop{0%,23%{opacity:0;transform:translateY(18px)}40%,100%{opacity:1;transform:translateY(0)}}
@keyframes app-explanation-desktop{0%,50%{opacity:0;transform:translateY(18px)}70%,100%{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:no-preference) and (min-width:320px) and (min-height:500px){
.scroll-story .project-chapter{height:270svh;view-timeline:--project block;view-timeline-inset:0}
.scroll-story .work-piece{display:block;position:sticky;top:0;height:100svh;padding:0;border:0}
.scroll-story .project-title,.scroll-story .work-images,.scroll-story .work-copy{position:absolute;inset:88px 0 44px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0;margin:0;animation-duration:1ms;animation-timing-function:ease-in-out;animation-fill-mode:both;animation-timeline:--project;animation-range:contain 0% contain 100%}
.scroll-story .project-title{gap:20px;pointer-events:none;animation-name:app-identity}
.scroll-story .project-title img{width:64px;height:64px;border-radius:14px}
.scroll-story .project-title>span{font-size:clamp(36px,8vw,60px);letter-spacing:-.055em;line-height:1.1}
.scroll-story .project-title>small{font-size:13px;color:var(--muted)}
.scroll-story .work-images{animation-name:app-screen}
.scroll-story .work-copy{animation-name:app-explanation}
.scroll-story .work-copy h2{position:static;width:auto;height:auto;overflow:visible;clip-path:none;white-space:normal;margin:0 0 22px;padding:0;font-size:clamp(30px,5vw,44px)}
.scroll-story .work-index{margin-bottom:18px}.scroll-story .work-summary{max-width:490px}.scroll-story .work-stack{max-width:450px}
.scroll-story .shot-link img{width:min(100%,calc(50svh * var(--shot-aspect,1)));max-height:50svh}
.scroll-story .chapter-progress{display:block;position:absolute;bottom:20px;left:0;width:100%;height:1px;background:var(--line)}
.scroll-story .chapter-progress>span{animation:timeline-progress 1ms linear both;animation-timeline:--project;animation-range:contain 0% contain 100%}
.js-scroll .project-title,.js-scroll .work-images,.js-scroll .work-copy,.js-scroll .chapter-progress>span{animation:none}
}
@media(prefers-reduced-motion:no-preference) and (min-width:901px) and (min-height:700px){
.scroll-story .project-chapter{height:245svh}
.scroll-story .work-piece{display:grid;grid-template-columns:.8fr 1.2fr;gap:7%;padding:112px 0 48px}
.scroll-story .project-title{inset:88px 0 60px}.scroll-story .project-title>span{font-size:clamp(40px,6vw,84px)}
.scroll-story .work-images,.scroll-story .work-copy{position:relative;inset:auto;align-self:center}
.scroll-story .work-images{animation-name:app-screen-desktop}.scroll-story .work-copy{animation-name:app-explanation-desktop}
.scroll-story .mynabi{grid-template-columns:1.1fr .9fr}
.js-scroll .work-images,.js-scroll .work-copy{animation:none}
}
@media(prefers-reduced-motion:no-preference) and (max-width:600px) and (min-height:500px){.scroll-story .project-title,.scroll-story .work-images,.scroll-story .work-copy{inset:80px 0 40px}.scroll-story .work-summary{font-size:16px;line-height:1.55}.scroll-story .work-stack{font-size:12px}.scroll-story .product-references{gap:4px 18px}}
@media(prefers-reduced-motion:no-preference) and (max-height:699px) and (min-width:320px) and (min-height:500px){.scroll-story .work-copy h2{font-size:28px;margin-bottom:14px}.scroll-story .work-index{font-size:11px;margin-bottom:12px}.scroll-story .work-summary{font-size:15px;line-height:1.5;margin-bottom:12px}.scroll-story .work-stack{font-size:11px;line-height:1.5;margin-bottom:10px}.scroll-story .project-status,.scroll-story .release-status{font-size:11px;margin:0 0 12px}.scroll-story .work-link,.scroll-story .product-references{font-size:12px}.scroll-story .product-references{margin-top:10px}}
@media(prefers-reduced-motion:no-preference) and (max-width:900px) and (min-height:700px){.scroll-story .shot-link img{width:min(100%,calc(62svh * var(--shot-aspect,1)));max-height:62svh}}

/* Subtle horizontal convergence: every word keeps its baseline and reading order. */
.compose-line{display:block;line-height:1.18}
.beat h1 .compose-word,.beat h2 .compose-word{display:inline-block}
.compose-word{--assemble-x:0em;--assemble-y:0em}
.compose-left{--assemble-x:-.12em}
.compose-right{--assemble-x:.12em}
@keyframes compose-words{from{transform:translate(var(--assemble-x),var(--assemble-y))}to{transform:translate(0,0)}}
@media(prefers-reduced-motion:no-preference) and (min-width:320px) and (min-height:500px){
.native-scroll .compose-word{animation:compose-words 1ms cubic-bezier(.45,0,.55,1) both;animation-timeline:--intro}
.native-scroll .identity .compose-word{animation-range:contain 0% contain 8%}
.native-scroll .build .compose-word{animation-range:contain 18% contain 27%}
.native-scroll .capabilities .compose-word{animation-range:contain 36% contain 47%}
.native-scroll .technology .compose-word{animation-range:contain 56% contain 73%}
.native-scroll .work-intro .compose-word{animation-range:contain 86% contain 98%}
}
@media(max-width:600px){.compose-left{--assemble-x:-.09em}.compose-right{--assemble-x:.09em}}
