@import "https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,500;12..96,600;12..96,700;12..96,800&family=DM+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap";:root{--lightningcss-light:initial;--lightningcss-dark: ;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--color-bg:#f6f5ef;--color-surface:#efeee6;--color-surface-elevated:#fffef8;--color-surface-hover:#e9eee6;--color-fg:#242521;--color-muted:#686960;--color-dim:#686960;--color-accent:#6550b8;--color-accent-dim:#53409e;--color-accent-glow:#667cff38;--color-error:#a33b2e;--color-success:#287266;--color-border:#d9dad0;--color-border-strong:#aeb2a5;--color-border-subtle:#e5e5dc;--rule:1px;--font-display:"Bricolage Grotesque", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-body:"DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-technical:"IBM Plex Mono", monospace;--text-xs:clamp(.7rem, .75vw, .75rem);--text-sm:clamp(.8rem, .85vw, .875rem);--text-base:clamp(1rem, 1.05vw, 1.125rem);--text-md:clamp(1.25rem, 1.35vw, 1.4rem);--text-lg:clamp(1.5rem, 1.8vw, 1.875rem);--text-xl:clamp(2rem, 2.4vw, 2.5rem);--text-2xl:clamp(2.5rem, 3.5vw, 3.5rem);--text-3xl:clamp(3.5rem, 5.5vw, 5rem);--line-height-display:1.15;--line-height-body:1.6;--max-line-length:65ch;--space-1:4px;--space-2:8px;--space-3:16px;--space-4:24px;--space-5:32px;--space-6:48px;--space-7:64px;--space-8:96px;--space-9:128px;--frame-inset:clamp(.75rem, 1.45vw, 1.75rem);--page-gutter:clamp(2.5rem, 6.5vw, 7.5rem);--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-full:9999px;--shadow-sm:0 2px 8px #00000059;--shadow-md:0 8px 24px -4px #00000073, 0 0 1px #f1efe91a;--shadow-lg:0 16px 48px -8px #0000008c, 0 0 1px #f1efe91f;--shadow-accent:0 4px 24px var(--color-accent-glow);--shadow-device:0 1.4rem 4.5rem -.5rem #0000008c, 0 0 32px #667cff1f;--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in-out:cubic-bezier(.65, 0, .35, 1);--duration-fast:.22s;--duration-medium:.7s;--duration-slow:1.2s;--commission-bg:var(--color-bg);--commission-fg:var(--color-fg);--commission-muted:var(--color-muted);--commission-dim:var(--color-dim);--commission-accent:var(--color-accent);--commission-border:var(--color-border);--commission-border-strong:var(--color-border-strong);--commission-error:var(--color-error);--bg-primary:var(--color-bg);--bg-secondary:var(--color-surface);--bg-card:var(--color-surface);--bg-card-hover:var(--color-surface-hover);--text-primary:var(--color-fg);--text-secondary:var(--color-muted);--text-muted:var(--color-dim);--accent:var(--color-accent);--accent-dim:var(--color-accent-dim);--accent-glow:var(--color-accent-glow);--border:var(--color-border);--border-hover:var(--color-border-strong);--error:var(--color-error);--success:var(--color-success);--space-xs:var(--space-2);--space-sm:var(--space-3);--space-md:var(--space-4);--space-lg:var(--space-6);--space-xl:var(--space-8);--font-sans:var(--font-body);--font-mono:var(--font-technical);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--paper:var(--color-bg);--ink:var(--color-fg);--muted:var(--color-muted);--line:var(--color-border);--violet:var(--color-accent);--teal:#287266;--rust:#a64c32;--display:var(--font-display);--body:var(--font-body);--mono:var(--font-technical)}*{box-sizing:border-box}html{background:var(--paper);scroll-behavior:smooth;scroll-padding-top:24px}body{color:var(--ink);background:var(--paper);font:16px/1.6 var(--body);-webkit-font-smoothing:antialiased;margin:0}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}:focus-visible{outline:2px solid var(--violet);outline-offset:5px}::selection{color:var(--ink);background:#dfd6f7}p,h1,h2,h3,figure{margin:0}.portfolio{max-width:1440px;margin:auto;padding:0 80px}.skip-link{z-index:10;background:var(--ink);color:#fff;padding:12px 20px;position:fixed;top:12px;left:12px;transform:translateY(-180%)}.skip-link:focus{transform:none}.site-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:24px;min-height:88px;display:flex}.site-mark{font:800 18px/1 var(--display);letter-spacing:-.04em;white-space:nowrap}.cursor{color:var(--violet);margin-left:2px;transition:transform .2s;display:inline-block}.site-mark:hover .cursor{transform:translate(5px)}.site-header nav{gap:30px;font-size:14px;display:flex}.site-header nav a{padding:12px 0;position:relative}.site-header nav a:after{content:"";background:var(--violet);width:0;height:2px;transition:width .2s;position:absolute;bottom:8px;left:0}.site-header nav a:hover:after,.site-header nav a:focus-visible:after{width:100%}.eyebrow{font:500 10px/1.6 var(--mono);letter-spacing:.09em;color:var(--muted)}.introduction{grid-template-columns:minmax(0,1fr) 220px;align-items:end;gap:48px;padding:94px 0 100px;display:grid}.introduction .eyebrow{margin-bottom:24px}h1{font:700 clamp(44px,5.5vw,78px)/1.03 var(--display);letter-spacing:-.065em;max-width:920px}h1 em{color:var(--violet);font-style:normal}.playful-type{--type-weight:700;--type-optical:48;--type-color:var(--violet);font-variation-settings:"wght" var(--type-weight),"opsz" var(--type-optical);transition:font-variation-settings .18s}.playful-type em{color:var(--type-color);transition:color .18s;position:relative}.playful-type em:after{content:"";height:.035em;transform-origin:var(--type-origin,50%) center;background:currentColor;transition:transform .22s;position:absolute;bottom:-.08em;left:0;right:0;transform:scaleX(0)}.playful-type.is-playing em:after{transform:scaleX(1)}.playful-type.is-playing .headline-cursor{color:var(--type-color)}.headline-cursor{color:var(--rust);margin-left:.06em;font-weight:400}.intro-detail{color:var(--muted);max-width:490px;margin-top:28px;font-size:17px}.build-note{color:var(--muted);border-left:2px solid #cbbbe6;padding:18px 0 18px 22px;font-size:14px}.build-note .eyebrow{color:var(--violet);margin-bottom:12px}.note-corner{color:var(--violet);margin-top:10px;font-size:25px;line-height:1;display:block}.section-label{align-items:center;gap:22px;margin-bottom:20px;display:flex}.label-line{background:var(--line);flex:1;height:1px}.featured{padding-bottom:86px}.feature-card{background:#e9eee6;border:1px solid #cdd7ce;border-radius:20px;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);display:grid;overflow:hidden}.feature-copy{flex-direction:column;justify-content:center;align-items:start;padding:48px 36px;display:flex}.origin{color:var(--teal);align-items:center;gap:8px;display:flex}.origin>span{background:var(--teal);border-radius:50%;width:6px;height:6px}.feature-copy h2{font:700 clamp(40px,4.2vw,62px)/1.1 var(--display);letter-spacing:-.065em;margin:20px 0}.feature-copy h2>span{color:var(--teal)}.feature-copy h2 sup{color:var(--teal);font:400 24px/1 var(--mono);margin-left:8px}.feature-description{color:#50594e;max-width:380px;font-size:16px}.feature-bottom{margin-top:30px}.stack{font:500 10px/1.6 var(--mono);color:#515b51;flex-wrap:wrap;gap:18px;margin-bottom:28px;display:flex}.stack b{color:var(--teal);vertical-align:middle;margin-right:5px;font-size:18px}.button{background:var(--paper);border:1px solid #aeb9ac;border-radius:7px;justify-content:space-between;align-items:center;gap:24px;padding:12px 16px;font-size:13px;font-weight:500;transition:background .18s,box-shadow .18s,transform .18s;display:inline-flex}.button>span:last-child{color:var(--teal);transition:transform .18s}.button:hover{background:#fffef8;transform:translate(-1px,-1px);box-shadow:3px 3px #becdbb}.button:hover>span:last-child{transform:translate(2px,-2px)}.app-preview{background:#dde5d9;border:1px solid #c5d0bf;border-radius:12px;min-width:0;margin:22px 22px 22px 0;overflow:hidden}.preview-bar{font:10px/1 var(--mono);color:#596653;border-bottom:1px solid #c5d0bf;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.window-dots{gap:4px;display:flex}.window-dots i{background:#a7b59f;border-radius:50%;width:5px;height:5px}.window-dots i:first-child{background:#ad6958}.screens{justify-content:center;align-items:center;gap:18px;padding:30px 20px 20px;display:flex;position:relative}.screens figure{width:47%;min-width:0}.screens figure:last-child{width:42%;margin-top:30px}.screens img{border:3px solid #282a25;border-radius:17px;width:100%;height:auto;transition:transform .3s;display:block;box-shadow:0 8px 12px #35402d18}@media (hover:hover){.screens figure:hover img{transform:translateY(-5px)}}.screens figcaption{font:9px/1.4 var(--mono);color:#56644f;margin-top:14px}.screens figcaption span{color:var(--teal);margin-right:6px}.gallery-controls{display:none}.other-projects{padding-bottom:82px}.other-projects>h2{font:600 38px/1.15 var(--display);letter-spacing:-.045em;margin:14px 0 26px}.other-projects>h2 span{color:var(--rust)}.project-row{--row-accent:var(--rust);border-top:1px solid var(--line);grid-template-columns:36px minmax(0,1fr) 180px 26px;align-items:center;gap:20px;padding:24px 0;transition:background .2s,padding .2s;display:grid}.project-row:nth-child(2){--row-accent:var(--violet)}.project-row:nth-child(3){--row-accent:var(--teal)}.project-row:last-child{border-bottom:1px solid var(--line)}.project-number{font:11px/1 var(--mono);color:var(--row-accent)}.project-detail h3{font:600 21px/1.25 var(--display);letter-spacing:-.025em;font-variation-settings:"wght" 600,"opsz" 24;transition:color .18s,font-variation-settings .18s}.project-row:hover h3,.project-row:focus-visible h3{color:var(--row-accent);font-variation-settings:"wght" 800,"opsz" 72}.project-detail p{color:var(--muted);max-width:510px;margin-top:5px;font-size:13px}.project-stack{font:10px/1.5 var(--mono);color:var(--muted)}.project-arrow{color:var(--row-accent);font-size:22px;transition:transform .2s}.project-row:hover{background:#efeee6;padding-left:12px;padding-right:12px}.project-row:hover .project-arrow{transform:translate(2px,-2px)}.about{border-top:1px solid var(--line);padding:32px 0 64px}.about-content{grid-template-columns:1fr 1.3fr 90px;align-items:center;gap:45px;margin-top:24px;display:grid}.about h2{font:600 44px/1.05 var(--display);letter-spacing:-.05em}.about h2 span{color:var(--rust)}.about-content>p{max-width:540px;color:var(--muted);font-size:17px}.about-symbol{font:500 120px/.7 var(--display);color:var(--rust);justify-self:end;transition:transform .4s;transform:rotate(-12deg)}.about:hover .about-symbol{transform:rotate(28deg)}.contact{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:30px;padding:30px 0;display:flex}.contact h2{font:500 23px/1.25 var(--display);letter-spacing:-.025em;margin-top:12px}.contact .button{border-color:#cdc3e0;flex-shrink:0}.contact .button>span{color:var(--violet)}footer{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:24px;padding:25px 0 32px;display:flex}footer .site-mark{font-size:14px}footer nav{color:var(--muted);gap:18px;font-size:11px;display:flex}footer nav a:hover{color:var(--violet)}.mobile-copy{display:none}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}footer nav{flex-wrap:wrap}@media (width>=810px) and (width<=1199px){.portfolio{padding:0 40px}.introduction{grid-template-columns:1fr;gap:28px;padding:64px 0 72px}h1{font-size:clamp(58px,7vw,76px)}.build-note{max-width:420px;padding-block:0}.note-corner{display:none}.feature-copy{padding:32px 24px}.feature-copy h2{font-size:42px}.screens{gap:12px;padding-inline:14px}.project-row{grid-template-columns:30px minmax(0,1fr) 140px 24px;gap:14px}.about-content{grid-template-columns:1fr 1.4fr 60px;gap:24px}.about-symbol{font-size:85px}footer{flex-wrap:wrap}}@media (width<=809px){.portfolio{max-width:640px;padding:0 24px}.desktop-copy{display:none}.mobile-copy{display:inline}p.mobile-copy{display:block}.site-header{gap:14px;min-height:74px}.site-mark{font-size:16px}.site-header nav{gap:17px;font-size:12px}.introduction{padding:58px 0 68px;display:block}.introduction .eyebrow{margin-bottom:22px;font-size:9px}h1{font-size:clamp(43px,10vw,60px);line-height:1.04}.intro-detail{max-width:360px;margin-top:22px;font-size:15px}.build-note{display:none}.featured{padding-bottom:64px}.feature-card{border-radius:16px;flex-direction:column;display:flex}.feature-copy{display:contents}.feature-copy>.origin{order:0;margin:26px 24px 0;font-size:9px}.feature-copy>h2{order:1;margin:14px 24px;font-size:clamp(34px,11vw,44px)}.feature-copy>.feature-description{order:2;margin:0 24px 24px;font-size:15px}.app-preview{order:3;margin:0 12px}.preview-bar{padding:12px}.screens{scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#9aac92 transparent;justify-content:start;align-items:start;padding:24px 20px 18px;overflow-x:auto}.screens figure,.screens figure:last-child{scroll-snap-align:center;flex:0 0 210px;width:210px;margin-top:0}.screens img{border-radius:18px}.gallery-controls{justify-content:space-between;align-items:center;gap:8px;padding:8px 12px 12px;display:flex}.gallery-controls .eyebrow{font-size:8px}.gallery-controls>div{display:flex}.gallery-controls button{color:#52634b;font:10px/1 var(--mono);background:0 0;border:0;border-radius:4px;padding:12px 10px}.gallery-controls button[aria-pressed=true]{color:#253a22;background:#c5d3be}.feature-bottom{order:4;margin:24px}.stack{margin-bottom:18px}.other-projects{padding-bottom:68px}.other-projects>h2{margin:12px 0 22px;font-size:32px}.project-row{grid-template-columns:25px minmax(0,1fr) 20px;gap:12px;padding:22px 0}.project-number{align-self:start;margin-top:6px}.project-detail h3{font-size:20px}.project-detail p{font-size:13px}.project-stack{grid-area:2/2;margin-top:-3px;font-size:9px}.project-arrow{grid-area:1/3;align-self:start}.about{padding:26px 0 50px}.about-content{grid-template-columns:1fr;gap:18px;margin-top:18px}.about h2{font-size:34px}.about-content>p{padding-right:18px;font-size:15px}.about-symbol{display:none}.contact{flex-direction:column;align-items:start;gap:20px;padding:24px 0}.contact h2{max-width:320px;font-size:23px}footer{flex-direction:column;align-items:start;gap:16px;padding:22px 0 28px}}@media (width<=359px){.portfolio{padding:0 18px}.site-header nav{gap:12px}.site-mark{font-size:14px}h1{font-size:40px}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,:before,:after{transition:none!important;animation:none!important}.playful-type{font-variation-settings:"wght" 700,"opsz" 48}.project-row:hover h3,.project-row:focus-visible h3{font-variation-settings:"wght" 600,"opsz" 24}}
