.belt{touch-action:pan-y;height:480px;margin:24px -20px 0;position:relative;overflow:hidden}.belt-track{width:max-content;height:100%;animation:70s linear infinite belt;display:flex}.belt-list{align-items:center;margin:0;padding:0;list-style:none;display:flex}.belt[data-paused] .belt-track{animation-play-state:paused}.belt:has(:focus-visible) .belt-track{animation-play-state:paused}@media (hover:hover){.belt:hover .belt-track{animation-play-state:paused}}@keyframes belt{to{transform:translate(-50%)}}.card{background:var(--paper);color:var(--ground);text-align:left;transition:transform .5s var(--ease-out), box-shadow .5s var(--ease-out);border:0;border-radius:5px;flex-direction:column;flex:none;margin:0 16px;padding:8px 8px 0;display:flex;position:relative;box-shadow:0 18px 36px -18px #0009}.card-phone{width:180px}.card-browser{width:316px}.card-terminal{width:286px}.card-tilt-0{transform:translateY(-14px)rotate(-3deg)}.card-tilt-1{transform:translateY(16px)rotate(2.5deg)}.card-tilt-2{transform:translateY(-2px)rotate(-1.5deg)}.card-tilt-3{transform:translateY(10px)rotate(3deg)}.card:focus-visible{z-index:3;transform:translateY(-10px)rotate(0)scale(1.03)}@media (hover:hover){.card:hover{z-index:3;transform:translateY(-10px)rotate(0)scale(1.03);box-shadow:0 34px 70px -24px #000000bf}}.card-caption{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:2px 10px;padding:10px 2px 12px;display:flex}.card-caption b{letter-spacing:-.03em;font-size:15px;font-weight:700}.card-caption span{opacity:.6;font-size:12px}.card-peek{background:var(--ground);color:var(--paper);opacity:0;transition:opacity .25s, transform .4s var(--ease-out);pointer-events:none;border-radius:4px;flex-direction:column;gap:10px;padding:16px;display:none;position:absolute;bottom:56px;left:10px;right:10px;transform:translateY(14px)}.card-peek-line{font-size:15px;line-height:1.35}.card-chips{flex-wrap:wrap;gap:6px;display:flex}.card-chips span{border:1px solid var(--line);border-radius:100px;align-items:center;height:26px;padding:0 10px;font-size:12px;display:inline-flex}.card-peek-cta{color:var(--brand);align-items:center;gap:6px;font-size:14px;font-weight:700;display:flex}.card-peek-cta svg{width:16px;height:16px}.card:focus-visible .card-peek{opacity:1;transform:none}@media (hover:hover) and (min-width:768px){.card-peek{display:flex}.card:hover .card-peek{opacity:1;transform:none}}.shot{display:block;position:relative;overflow:hidden}.shot-card.shot-phone{border-radius:20px;width:164px;height:330px}.shot-card.shot-browser{border-radius:3px;width:300px;height:194px}.shot-card.shot-terminal{border-radius:3px;width:270px;height:182px}.shot-sheet{border:7px solid var(--paper);box-shadow:0 24px 50px -24px #000c}.shot-sheet.shot-phone{border-radius:26px;width:150px;height:300px}.shot-sheet.shot-browser{border-radius:5px;width:100%;height:200px}.shot-sheet.shot-terminal{border-radius:5px;width:100%;height:180px}.tint-surface{background:var(--surface);color:var(--paper)}.tint-paper{background:color-mix(in oklch, var(--paper), var(--ground) 8%);color:var(--ground)}.tint-sage{background:var(--featured-bg);color:var(--ground)}.tint-brand{background:var(--brand);color:var(--ground)}.tint-terminal{background:color-mix(in oklch, var(--ground), black 32%);color:var(--brand)}.ui{flex-direction:column;gap:8px;padding:14px 12px;display:flex;position:absolute;inset:0}.ui i{opacity:.16;background:currentColor;border-radius:5px;display:block}.ui .bar{opacity:.22;height:26px}.ui .w80{width:80%;height:8px}.ui .w60{width:60%;height:8px}.ui .w40{width:40%;height:8px}.ui .blk{opacity:.12;flex:1}.ui .tabs{opacity:.2;border-radius:10px;height:30px;margin-top:auto}.ui.ui-browser{gap:0;padding:0}.ui-browser .chrome{opacity:.2;border-radius:0;height:20px}.ui-browser .cols{flex:1;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px;display:grid}.ui-browser .cols i{opacity:.14}.ui.ui-term{gap:7px;padding:16px 14px}.ui-term i{opacity:.5;border-radius:2px;height:7px}.ph-tag{letter-spacing:.14em;text-transform:uppercase;opacity:.55;font-size:9px;position:absolute;bottom:8px;left:10px}.hint-touch{display:none}@media (hover:none){.hint-hover{display:none}.hint-touch{display:inline}}.project-sheet{background:var(--ground);width:100%;max-width:100%;height:100dvh;max-height:100dvh;color:var(--paper);overscroll-behavior:contain;border:0;outline:none;margin:0;padding:0;position:fixed;inset:0;overflow-y:auto}.project-sheet[open]{animation:sheet-in .45s var(--ease-out);display:block}.project-sheet[open] .sheet-reel-body{animation:sheet-reel-in .55s var(--reel-spring) both}html:has(.project-sheet[open]){overflow:hidden}@keyframes sheet-in{0%{opacity:0}to{opacity:1}}@keyframes sheet-reel-in{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}.reel-control,.reel-link{transition:transform .2s var(--ease-out), background-color .2s var(--ease-out), color .2s var(--ease-out)}.reel-control:active:not(:disabled),.reel-link:active{transform:scale(.96)}.reel-marker span{transition:background-color .2s var(--ease-out), transform .2s var(--ease-out)}@media (hover:hover) and (pointer:fine){.reel-control:hover:not(:disabled),.reel-link:hover{background:var(--brand);color:var(--ground);transform:translateY(-2px)}.reel-marker:hover span{background:var(--brand);transform:scaleY(2)}}.reel-marker:focus-visible span{background:var(--brand);transform:scaleY(2)}@media (prefers-reduced-motion:reduce){.project-sheet[open],.project-sheet[open] .sheet-reel-body{animation:none}.reel-control,.reel-link,.reel-marker span{transition:none;transform:none!important}}@media (min-width:768px){.belt{height:600px;margin:36px -72px 0}.belt-track{animation-duration:80s}.card{border-radius:6px;margin:0 26px;padding:10px 10px 0;box-shadow:0 22px 44px -22px #0009}.card-phone{width:232px}.card-browser{width:490px}.card-terminal{width:420px}.card-tilt-0{transform:translateY(-18px)rotate(-3deg)}.card-tilt-1{transform:translateY(22px)rotate(2.5deg)}.card-tilt-2{transform:translateY(-4px)rotate(-1.5deg)}.card-tilt-3{transform:translateY(12px)rotate(3deg)}.card-caption{column-gap:12px;padding:12px 4px 14px}.card-caption b{font-size:17px}.card-caption span{font-size:13px}.shot-card.shot-phone{border-radius:24px;width:212px;height:420px}.shot-card.shot-browser{border-radius:4px;width:470px;height:300px}.shot-card.shot-terminal{border-radius:4px;width:400px;height:270px}.shot-sheet{border-width:10px}.shot-sheet.shot-phone{border-radius:34px;width:300px;height:600px}.shot-sheet.shot-browser{border-radius:6px;height:440px}.shot-sheet.shot-terminal{border-radius:6px;height:380px}.ui{gap:10px;padding:18px 16px}.ui i{border-radius:6px}.ui .bar{height:34px}.ui .w80,.ui .w60,.ui .w40{height:10px}.ui .tabs{border-radius:12px;height:38px}.ui.ui-browser{gap:0;padding:0}.ui-browser .chrome{height:26px}.ui-browser .cols{gap:10px;padding:16px}.ui.ui-term{gap:9px;padding:22px 20px}.ui-term i{height:9px}.ph-tag{font-size:10px;bottom:10px;left:12px}}@media (prefers-reduced-motion:reduce){.belt{scroll-snap-type:x proximity;overflow-x:auto}.belt-list[aria-hidden]{display:none}.card{scroll-snap-align:center}}.conveyor-journey::backdrop{background:0 0}html:has(.conveyor-journey[open]){overflow:hidden}.conveyor-preview{animation:conveyor-preview-in .24s var(--ease-out) both}@keyframes conveyor-preview-in{0%{opacity:0;transform:translateY(8px)scale(.96)}to{opacity:1;transform:none}}.reel-story-in{animation:reel-story-in .28s var(--reel-spring) both}@keyframes reel-story-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.reel-tab{transition:color .2s var(--ease-out), background-color .2s var(--ease-out), transform .2s var(--ease-out)}.reel-tab:active{transform:scale(.97)}@media (hover:hover) and (pointer:fine){.reel-tab:hover:not([aria-pressed=true]){background:var(--surface);color:var(--paper)}}@media (prefers-reduced-motion:reduce){.reel-story-in{animation:none}.reel-tab{transition:none;transform:none!important}}