@layer base{*,:before,:after{box-sizing:border-box}html{text-size-adjust:none;scroll-behavior:smooth;overflow-y:scroll}@view-transition{navigation:auto}body,h1,h2,h3,h4,p,figure,blockquote,dl,dd{-webkit-margin-after:0;margin-block-end:0}ul[role=list],ol[role=list]{list-style:none}ul{padding-inline-start:0;list-style:none}body{min-block-size:100vh;line-height:1.5}h1,h2,h3,h4,button,input,label{line-height:1.1}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture{max-inline-size:100%;display:block}input,button,textarea,select{font:inherit}textarea:not([rows]){min-block-size:10em}:target{scroll-margin-block:5ex}:focus:not(:focus-visible){outline:0}body>*+*{-webkit-margin-before:var(--flow-space,1em);margin-block-start:var(--flow-space,1em)}:where(:focus,:focus-visible){outline:1px solid var(--orange-1)}::selection{background:var(--selection-color);color:light-dark(var(--text-dark-color),var(--text-light-color))}:root{--xxs:.125rem;--xs:.25rem;--s:.5rem;--m:1rem;--l:1.25rem;--xl:1.5rem;--xxl:2rem;--xxxl:3rem;--f-base:14px;--font-base:clamp(var(--f-base), calc(var(--f-base) + 1.92vmin), 1.5rem);--white-1:#fff;--white-2:#fafafa;--black-1:#000;--black-2:#fff;--black-3:#222b2f;--black-4:#333;--black-5:#787878;--gray-1:#6a767c;--gray-2:#6d7f88;--blue-1:#0070a8;--blue-2:#3d7c9e;--blue-3:#059bff;--blue-4:#1ca0f2;--orange-1:#d59453a8;--orange-2:orange;--orange-3:#fb805b;--orange-4:#777;--color-email:#fb805b;--google-blue:#1a73e8;--google-blue-hover:#1557b0;--google-green:#34a853;--google-yellow:#fbbc04;--google-red:#ea4335;--google-logo-blue:#4285f4;--google-yellow-highlight:#ffd966;--google-yellow-soft:#fce8e6;--gray-neutral-light:#dadce0;--gray-neutral-dark:#5f6368;--max-width-email:800px;--header-height-email:60px;--ec-appbar-h:64px;--ec-sidebar-w:15ch;--checkmark-size-desktop:1.5rem;--checkmark-size-mobile:1.25rem;--checkmark-glyph-inline:.7rem;--checkmark-glyph-block:.35rem;--truck-icon-size:24px;--google-sans:"Google Sans", Roboto, Arial, sans-serif;--f-checkout-base:16px;--f-step-label:.85rem;--f-step-label-mobile:.75rem;--green-google:#34a853;--green-dark:#137333;--blue-google:#1a73e8;--blue-light:#e8f0fe;--yellow-google:#fbbc04;--red-google:#ea4335;--gray-border-light:#dadce0;--gray-border-dark:#5f6368;--gray-text-light:#5f6368;--gray-text-dark:#9aa0a6;--surface-dark-1:#202124;--surface-dark-2:#303134;--surface-dark-3:#292a2d;--surface-light-1:#f8f9fa;--surface-light-ec:#f6f8fc;--surface-dark-ec:#18191a;--checkout-accent-blue:var(--blue-google);--checkout-border-color:light-dark(var(--gray-border-light),oklch(from var(--gray-border-dark) l c h / .5));--checkout-card-bg:light-dark(var(--white-1),var(--surface-dark-2));--checkout-text-primary:light-dark(var(--surface-dark-1),oklch(93.6373% .00458111 258.324));--checkout-text-secondary:light-dark(var(--gray-text-light),var(--gray-text-dark));--checkout-highlight-bg:light-dark(#ffd966,var(--yellow-google));--ec-app-bg:light-dark(var(--surface-light-ec),var(--surface-dark-ec));--ec-surface:light-dark(var(--white-1),#242526);--ec-border:light-dark(#e0e0e0,#3a3b3c);--ec-active-bg:light-dark(oklch(91% .08 260),oklch(35% .18 260/.2));--ec-active-color:light-dark(oklch(35% .18 260),oklch(85% .15 260));--checkout-card-radius:8px;--timeline-container-radius:1.25rem;--truck-speed:.76s;--check-transition:.2s;--line-progress:.25s;--truck-spring:cubic-bezier(.68, -.24, .265, 1.24);--truck-entrance:cubic-bezier(.68, -.55, .265, 1.55);--check-ease:cubic-bezier(.4, 0, .2, 1);--premium-ease:cubic-bezier(.23, 1, .32, 1);--bkgnd:var(--black-3);--border-radius:var(--s);--color-brand:var(--gray-1);--text-dark-color:var(--black-3);--text-light-color:var(--white-1);--text-shadow:var(--white-1);--text-shadow-subtle:drop-shadow(0 0 .125px var(--text-shadow));--link-color:var(--blue-2);--link-ease:cubic-bezier(.2, .8, .2, 1);--ease-3:cubic-bezier(.25, 0, .3, 1);--link-timing:.444s;--font-stack:"Recursive", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Open-sans, "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";--recursive-wght:400;--recursive-CASL:0;--recursive-MONO:0;--recursive-slnt:0;--recursive-CRSV:.5;--selection-color:var(--gray-1);color-scheme:light dark;--asset-theme: ;@supports (color:rgb(from white r g b)){--white-1:oklch(100% 5.96046e-8 90);--white-2:oklch(98.5104% 1.3328e-7 153.435);--black-1:oklch(0% 0 0);--black-2:oklch(100% 5.96046e-8 90);--black-3:oklch(28.2189% .0145414 226.594);--black-4:oklch(32.1092% 2.98023e-8 0);--black-5:oklch(57.2683% 5.96046e-8 0);--gray-1:oklch(55.7872% .0171475 229.187);--gray-2:oklch(58.5058% .0252279 229.396);--blue-1:oklch(52.1084% .12153 241.039);--blue-2:oklch(55.9125% .0834783 234.588);--blue-3:oklch(67.3777% .181331 248.245);--blue-4:oklch(67.9394% .159452 243.757);--orange-1:oklch(71.7686% .113237 64.2666);--orange-2:oklch(79.2689% .171026 70.6699);--orange-3:oklch(73.2594% .159131 37.5021);--orange-4:oklch(56.9262% 4.21468e-8 135);--color-email:oklch(73.2594% .159131 37.5021);--google-blue:oklch(57.3697% .194603 257.858);--google-blue-hover:oklch(47.0413% .15588 257.92);--google-green:oklch(64.7549% .160277 148.495);--google-yellow:oklch(83.0424% .169929 84.0143);--google-red:oklch(62.5731% .205841 29.0773);--google-logo-blue:oklch(63.0386% .180027 259.956);--google-yellow-highlight:oklch(89.5883% .139276 91.0705);--google-yellow-soft:oklch(94.645% .0220732 24.4405);--gray-neutral-light:oklch(89.41% .00586773 264.531);--gray-neutral-dark:oklch(49.7878% .00938858 253.914);--green-google:oklch(64.7549% .160277 148.495);--green-dark:oklch(48.8017% .129658 148.953);--blue-google:oklch(57.3697% .194603 257.858);--blue-light:oklch(95.3229% .0207144 261.772);--yellow-google:oklch(83.0424% .169929 84.0143);--red-google:oklch(62.5731% .205841 29.0773);--gray-border-light:oklch(89.41% .00586773 264.531);--gray-border-dark:oklch(49.7878% .00938858 253.914);--gray-text-light:oklch(49.7878% .00938858 253.914);--gray-text-dark:oklch(70.2767% .0111377 247.985);--surface-dark-1:oklch(24.7936% .00584602 271.176);--surface-dark-2:oklch(31.3318% .00550512 271.239);--surface-dark-3:oklch(28.5178% .0056395 271.216);--surface-light-1:oklch(98.1639% .0017073 247.841);--surface-light-ec:oklch(97.8745% .00573532 264.533);--surface-dark-ec:oklch(21.2742% .00250265 247.945)}}@media (prefers-color-scheme:dark){body,html{--text-shadow:var(--white-2)}}@font-face{font-family:Recursive;font-style:normal;font-weight:400 900;font-display:swap;src:url(/assets/recursive-variable-DkMQARP5.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*,:before,:after{font-variation-settings:"MONO" var(--recursive-MONO), "CASL" var(--recursive-CASL), "slnt" var(--recursive-slnt), "CRSV" var(--recursive-CRSV), "wght" var(--recursive-wght)}:where(:any-link,:-webkit-any-link){color:light-dark(var(--text-dark-color),var(--text-light-color));padding:0;text-decoration:none;transition:opacity .2s}:where(:any-link,:any-link){color:light-dark(var(--text-dark-color),var(--text-light-color));padding:0;text-decoration:none;transition:opacity .2s}h1{--recursive-wght:700;--recursive-CASL:.8;font-family:Recursive,sans-serif,system-ui;font-size:clamp(var(--f-base), calc(var(--f-base) + .4cqi), 1.5rem);text-transform:uppercase;filter:drop-shadow(.5px .5px 1px var(--text-shadow));contain:layout paint;line-height:1.1;transition:font-variation-settings .48s;&:hover{--recursive-wght:800;--recursive-CASL:.1}}:where(h1,.nav-item,.copyright){filter:drop-shadow(.5px .5px 1px var(--text-shadow), .75px .75px 3px var(--text-shadow), 1.25px 1.25px 6px var(--text-shadow))}}@layer layout{body{background:light-dark(var(--white-1),color-mix(in oklch, var(--bkgnd) 24%, var(--blue-3) 2%));color:light-dark(var(--text-dark-color),var(--text-light-color));font-family:var(--font-stack);font-optical-sizing:auto;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:auto;-moz-text-size-adjust:auto;flex-direction:column;min-block-size:100vh;padding:0 4cqi;font-size:clamp(1rem,1rem + .125cqi,2rem);display:flex;@media (prefers-reduced-motion:no-preference){interpolate-size:allow-keywords}}main{perspective:500px;transform-style:preserve-3d;margin:auto}.cover{min-block-size:100vh;padding:var(--m);text-wrap:pretty;flex-direction:column;justify-content:center;display:flex;position:relative;transform:translateZ(50px)}#main-content{max-inline-size:64ch}.header{justify-content:space-between;align-items:baseline;min-block-size:5rem;inline-size:100%;display:flex;& h1{contain:layout paint style}& a{filter:var(--text-shadow-subtle);padding-block-end:var(--s)}& nav>ul{align-items:center;gap:1cqi;transition:opacity .2s,font-weight .26s,font-variation-settings .26s;display:flex;& a:hover{--recursive-wght:850;opacity:.5;font-weight:850}}}body:has(.lab-container) header nav a[href*=lab\.html]{--recursive-wght:850;opacity:1;font-weight:850}.footer-menu{--recursive-wght:200;flex-wrap:wrap;justify-content:space-between;align-items:center;margin-block-start:auto;display:flex;& ul{flex-wrap:wrap;gap:1.25vmin;display:flex;@media (inline-size<264px){grid-template-columns:repeat(2,1fr);display:grid}}& .copyright{align-self:center;@media (224px<=inline-size<264px){margin-block-start:calc(9dvh - 1rem)}}}.footer-menu--item a{filter:drop-shadow(.5px .5px 1px var(--text-shadow));align-items:end;gap:1ch;margin-inline-end:var(--xxs);transition:fill .33s;display:flex;@supports (color:color(display-p3 1 1 1)) and (prefers-color-scheme:dark){& .footer-menu--item a{--text-shadow:color(display-p3 .873 .883 .889)}}& svg,& [role=img]{display:none}}.footer-menu--item a.twitter:where(:hover,:focus,:active){fill:var(--blue-4);filter:drop-shadow(1px 1px 1px var(--black-5))}.footer-menu--item a.email:where(:hover,:focus,:active){fill:var(--color-email,#fb805b);filter:drop-shadow(1px 1px 1px var(--orange-4))}.footer-menu--item a.linkedIn:where(:hover,:focus,:active){fill:var(--blue-1);filter:drop-shadow(1px 1px 1px var(--black-5))}.footer-menu--item a.github:where(:hover,:focus,:active){fill:var(--black-4);filter:drop-shadow(1px 1px 1px var(--black-5))}}@layer components{.lab-container{inline-size:100%;container-type:inline-size}.demo-examples{--outline-color:light-dark(lch(96% 1 18),lch(16% 1 18/.1));grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8cqi;margin-block:20cqi;display:grid;& article{animation:enter .6s var(--ease-3) forwards;animation-delay:calc((.6 + (sibling-index() * .05)) *1s);opacity:0;transition:transform .24s var(--ease-3), box-shadow .32s var(--ease-3);cursor:pointer;outline:none;position:relative;&:hover,&:focus,&:focus-within{z-index:10;transform:translateY(-.75rem)}}& article>iframe{aspect-ratio:6/9;inline-size:100%;box-shadow:0 0 8px color-mix(in oklch, var(--blue-2) 24%, transparent 76%);transition:transform .24s var(--ease-3), box-shadow .28s var(--ease-3);border:0;border-radius:.5rem;outline:1px solid lch(96% 1 18/.12);overflow:hidden;@supports (corner-shape:squircle){corner-shape:squircle;border-radius:1.5rem}}& article:hover>iframe,& article:focus-within>iframe{box-shadow:0 0 16px color-mix(in oklch, var(--blue-2) 36%, transparent 64%);transform:scale(1.01)}& .demo-link{z-index:20;color:light-dark(oklch(0% none none),oklch(100% none none));backdrop-filter:blur(4px);opacity:0;transition:opacity .2s var(--ease-3), outline-offset .2s var(--ease-3);background:light-dark(oklch(100% none none/.6),oklch(0% none none/.6));border-radius:.25rem;outline:1px solid light-dark(oklch(0% none none/.12),oklch(100% none none/.12));padding:.25rem;position:absolute;inset-block-start:1rem;inset-inline-start:1rem;&:focus-visible{opacity:1;outline-offset:.25rem;outline:2px solid}}& .external-icon{block-size:1.5rem;inline-size:1.5rem;display:block}& article:hover .demo-link,& article:focus-within .demo-link{opacity:1}}#main-content{max-inline-size:76ch}.brand{--recursive-wght:700;--recursive-CRSV:1;color:var(--gray-2);cursor:pointer;font:inherit;text-align:left;background:0 0;border:none;padding:0;text-decoration:none;transition:color .1s,font-weight .26s,font-variation-settings .26s,opacity .2s,outline .2s,border-radius 10ms;&:where(:hover,:focus,:active,:target,:focus-within){--recursive-wght:800;opacity:.5;outline:1px solid var(--orange-2);border-radius:var(--border-radius)}&:where(:active,:target){color:light-dark(var(--text-dark-color),var(--text-light-color));outline-width:var(--xxs)}}.brands{@media (inline-size<=264px){grid-template-columns:repeat(auto-fit,minmax(7rem,1fr));gap:4vmin;display:inline-grid}}.link-contact{--recursive-wght:550;cursor:pointer;transition:box-shadow var(--link-ease) var(--link-timing);--recursive-CRSV:1;padding:0;font-weight:550;box-shadow:inset 0 -1px oklch(64.6425% .0962106 232.714),inset 0 -2px oklch(64.6425% .0962106 232.714),inset 0 -6px oklch(64.6425% .0962106 232.714),inset 0 -10px oklch(64.6425% .0962106 232.714)}.link-contact:is(:hover,:focus,:focus-within){opacity:.76;box-shadow:inset 0 -2px oklch(64.6425% .0962106 232.714),inset 0 -4px oklch(64.6425% .0962106 232.714),inset 0 -8px oklch(64.6425% .0962106 232.714),inset 0 -12px oklch(64.6425% .0962106 232.714)}.skip-to-content{z-index:1000;padding:var(--s) var(--m);background:var(--blue-2);color:var(--white-1);--recursive-wght:700;border-radius:0 0 var(--border-radius) 0;transition:transform .2s var(--ease-3);font-weight:700;text-decoration:none;position:absolute;inset-block-start:-9999px;inset-inline-start:0}.skip-to-content:focus{outline:2px solid var(--white-1);outline-offset:-2px;inset-block-start:0}.popover,.interest-popover{background:var(--bkgnd);background:light-dark(var(--white-1),color-mix(in oklch, var(--bkgnd) 92%, var(--blue-3) 4%));border:1px solid color-mix(in oklch, var(--blue-2) 88%, transparent 12%);border-radius:var(--border-radius);padding:var(--m);text-wrap:pretty;block-size:fit-content;inline-size:min(80%,480px);transition:opacity var(--link-timing) var(--link-ease), transform var(--link-timing) var(--link-ease), display var(--link-timing) allow-discrete, overlay var(--link-timing) allow-discrete;opacity:0;box-shadow:inset 0 0 2px light-dark(oklch(100% 5.96046e-8 none/.8),color-mix(in oklch, var(--white-1) 44%, transparent 56%)), inset 0 0 1px light-dark(oklch(100% 5.96046e-8 none/.9),color-mix(in oklch, var(--white-1) 72%, transparent 28%)), 0 0 4px light-dark(color-mix(in oklch, var(--blue-2) 12%, transparent),color-mix(in oklch, var(--blue-2) 48%, transparent 52%)), 0 0 8px light-dark(color-mix(in oklch, var(--black-1) 4%, transparent),color-mix(in oklch, var(--white-1) 8%, transparent 92%)), 0 0 16px light-dark(color-mix(in oklch, var(--blue-2) 8%, transparent),color-mix(in oklch, var(--blue-2) 16%, transparent 84%)), 0 0 32px light-dark(color-mix(in oklch, var(--black-1) 12%, transparent),color-mix(in oklch, var(--white-1) 24%, transparent 76%));padding-block-end:1.125rem;font-size:.875rem;line-height:1.4;position:fixed;transform:translateY(2rem);&:popover-open{opacity:1;transform:translateY(0)}}.popover{margin:auto;inset:0;& .company-description{--recursive-wght:650;--recursive-CASL:.75;filter:var(--text-shadow-subtle);margin-block-start:var(--xxs);margin-block-end:calc(var(--xxs) + var(--s))}& .work-summary{color:light-dark(var(--text-dark-color),var(--text-light-color));margin-block-end:var(--m)}& .roles{gap:var(--s);flex-wrap:wrap;display:flex}& .role{padding:var(--xxs) var(--s);border-radius:var(--border-radius);font-size:calc(var(--xxs) + var(--s));border:1px solid}}.interest-popover{position-anchor:--lab-link;position-area:top right;position-try-fallbacks:flip-inline, flip-block;position-try:flip-inline, flip-block;inline-size:max-content;transition:opacity var(--link-timing) var(--link-ease), transform var(--link-timing) var(--link-ease), display var(--link-timing) allow-discrete, overlay var(--link-timing) allow-discrete;opacity:0;margin:auto;position:fixed;inset:0;transform:translateY(2rem);&:popover-open{opacity:1;transform:translateY(0)}}main{transition:filter var(--link-timing) var(--link-ease), opacity var(--link-timing) var(--link-ease)}main:has(~.popover:popover-open){filter:blur(4px)opacity(.64)hue-rotate(206deg);will-change:filter, opacity}[interestfor]{interest-delay:.24s .72s}.lab-link-anchor{anchor-name:--lab-link}@starting-style{:is(.popover:popover-open,.interest-popover:popover-open){opacity:0;transform:translateY(2rem)}}.resume-container{inline-size:clamp(32vmin,36rem,64vmin)}:where(#technical-skills-heading,#work-experience-heading,#education-heading,#certifications-heading,[aria-label=technical-skills],date){visibility:hidden}:where(.bio,.skills-container){display:none}:where([aria-label=technical-skills],[aria-label=work-experience],[aria-label=education],[aria-label=certifications]){margin-block-end:2.5rem}:where(summary h3,date,.copyright){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}details{margin-block-end:var(--xxl);margin-inline-start:var(--m);& *{margin:0}& ul{padding-block-start:var(--m);padding-inline-start:var(--m)}& li{padding-block:var(--s)}&>summary{cursor:pointer;justify-content:space-between;align-items:baseline;padding-inline-end:var(--xl);list-style:outside;transition:text-shadow .32s ease-in-out;display:flex;position:relative}&>summary:after{content:"";inline-size:var(--s);block-size:var(--s);transition:transform .32s var(--link-ease);border-block-end:2px solid;border-inline-end:2px solid;position:absolute;inset-block-start:50%;inset-inline-end:0;transform:translateY(-80%)rotate(45deg)}&[open]>summary:after{transform:translateY(-20%)rotate(225deg)}&[open]>summary:focus{text-shadow:2px 2px 5px var(--text-shadow)}& .job-title{transition:opacity .32s var(--link-ease), translate .32s var(--link-ease)}}.resume-container section{@media (hover) and (prefers-reduced-motion:no-preference){&>details>summary{transition:opacity .32s var(--link-ease), transform .32s var(--link-ease)}&:has(:hover)>details>summary:not(:hover),&:has(:focus)>details>summary:not(:focus){opacity:.25;transform:scale(.75), translate(var(--xxs), 0);transition:opacity .32s var(--link-ease), transform .32s var(--link-ease)}}}::details-content{block-size:0;opacity:0;transition:block-size .32s ease-in-out, content-visibility .32s ease-in-out allow-discrete, opacity .64s, text-shadow .32s ease-in-out;padding-inline-start:var(--xl);overflow:clip}[open]::details-content{opacity:1;block-size:auto}.job-title{--recursive-wght:550;justify-content:space-between;padding-block-start:var(--l);font-style:italic;font-weight:550;display:flex}[role=img]{inline-size:var(--l);block-size:var(--l);fill:light-dark(var(--black-1),var(--white-1));flex-shrink:0;margin-block-end:.3rem}.icon-set,.footer-menu svg{display:none}.icon-text{margin-block-end:.1rem}#icon-twitter{margin-block-end:.3rem}@media (inline-size<=760px){[role=img]{display:none}}:where(.about-item){font-size:max(var(--f-base), calc(1rem + 1cqi))}.headline{--recursive-wght:500;margin-block-end:var(--m);display:inline-block}.styleguide{gap:var(--xl);padding-block:var(--m);grid-column:2/-2;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));display:grid;& .footer-menu [role=img]{inline-size:var(--xl);block-size:var(--xl);display:block}}.styleguide article{background:oklch(from var(--white-1) l c h / .02);border:1px solid oklch(from var(--white-1) l c h / .08);border-radius:var(--border-radius);padding:var(--m);gap:var(--xxxl);flex-direction:column;display:flex}.color-tokens-section{gap:var(--l);flex-direction:column;grid-column:1/-1;display:flex}.color-group{gap:var(--m);flex-direction:column;display:flex}.color-group h3{font-size:var(--m);color:var(--text-light-color);opacity:.85;margin-block-start:0;margin-block-end:var(--xxs);margin-inline-start:1.5rem}.styleguide h2{font-size:var(--l);margin-bottom:var(--xs);border-bottom:1px solid oklch(from var(--white-1) l c h / .12);padding-bottom:var(--xs);color:var(--text-light-color)}.token-group{gap:var(--m);flex-wrap:wrap;align-items:flex-start;display:flex}.token-card{align-items:center;gap:var(--xxl);text-align:center;flex-direction:column;flex:none;display:flex}.asset{--space:calc(var(--xxxl) * 2);--deg:50%;block-size:var(--space);inline-size:var(--space);border-radius:var(--deg);background-color:var(--asset-theme,var(--color-brand));outline:var(--xxs) solid var(--asset-theme,var(--color-brand));outline-offset:calc(1 * var(--xxs));box-shadow:0 var(--xs) var(--s) oklch(0% 0 0/.3);display:inline-block}.token-code{font-family:var(--font-stack);--recursive-MONO:1;font-size:calc(3 * var(--xs));color:var(--text-light-color);background:var(--black-4);padding:var(--xxs) var(--xs);border-radius:var(--xs);border:1px solid oklch(from var(--white-1) l c h / .1);text-overflow:ellipsis;white-space:nowrap;max-inline-size:100%;display:inline-block;overflow:hidden}.txt-cntr{text-align:center;margin-bottom:var(--xl)}.background-mid{background:var(--color-brand)}.font{font-size:var(--font-size,var(--m));padding:var(--xs) 0;border-bottom:1px dashed oklch(from var(--white-1) l c h / .1);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.text-ellipsis{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.icon-set-display svg{cursor:pointer;transition:fill .33s,filter .33s}.icon-set-display svg.twitter:hover{fill:var(--blue-4);filter:drop-shadow(1px 1px 1px var(--black-5))}.icon-set-display svg.linkedIn:hover{fill:var(--blue-1);filter:drop-shadow(1px 1px 1px var(--black-5))}.icon-set-display svg.github:hover{fill:var(--black-4);filter:drop-shadow(1px 1px 1px var(--black-5))}.icon-set-display svg.codepen:hover{fill:var(--orange-3);filter:drop-shadow(1px 1px 1px var(--black-5))}.icon-set-display svg.email:hover{fill:#fb805b;filter:drop-shadow(1px 1px 1px var(--orange-4))}.motion{align-items:center;gap:var(--m);display:flex}.motion-item{animation:4s linear infinite rotate}.motion-item.pause{animation-play-state:paused}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}body:has(.styleguide){font-size:var(--font-base);place-items:initial;grid-template-rows:auto 1fr auto;display:grid}.spacer-card{align-items:center;gap:var(--s);text-align:center;flex-direction:column;display:flex}.spacer-box{inline-size:var(--space,var(--m));block-size:var(--space,var(--m));background-color:var(--color-brand);border-radius:var(--card-radius,var(--border-radius));border:1px solid oklch(from var(--white-1) l c h / .2);min-block-size:2px;min-inline-size:2px;display:inline-block}.axis-grid{gap:var(--m);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));display:grid}.axis-card{background:oklch(from var(--white-1) l c h / .03);border:1px solid oklch(from var(--white-1) l c h / .08);border-radius:var(--border-radius);padding:var(--m);gap:var(--xs);flex-direction:column;display:flex}.axis-card h4{font-size:var(--m);color:var(--text-light-color);margin:0}.axis-sample{font-family:var(--font-stack);font-size:var(--l);color:var(--text-light-color);padding:var(--xs);background:var(--black-4);border-radius:var(--xs);margin-block-start:var(--xs)}.easing-grid{gap:var(--m);grid-template-columns:repeat(auto-fit,minmax(200px,1fr));display:grid}.easing-card{background:oklch(from var(--white-1) l c h / .03);border:1px solid oklch(from var(--white-1) l c h / .08);border-radius:var(--border-radius);padding:var(--m);gap:var(--xs);flex-direction:column;display:flex}.easing-card h4{font-size:var(--s);color:var(--text-light-color);margin:0}.easing-demo{inline-size:100%;block-size:var(--xl);background:var(--black-4);border-radius:var(--xs);position:relative;overflow:hidden}.easing-ball{inline-size:var(--xl);block-size:var(--xl);background:var(--blue-2);animation:2.5s infinite alternate ease-slide;animation-timing-function:var(--ease-curve,ease);border-radius:50%;position:absolute;inset-inline-start:0}@keyframes ease-slide{to{inset-inline-start:calc(100% - var(--xl))}}.media-player-showcase{inline-size:100%;max-inline-size:24rem;padding:var(--m);gap:var(--m);background:oklch(28.5017% 4.71216e-8 161.565);border-radius:2rem;flex-direction:column;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 12px oklch(0% 0 0/.3);container-type:inline-size}.media-player-showcase .media-player__controls{padding:.5rem var(--s);background:oklch(32.1092% 2.98023e-8 0);border-radius:1.25rem;grid-template-columns:auto 1fr auto auto;align-items:center;gap:.5rem;display:grid}.media-player-showcase .media-player__controls button,.media-player-showcase .media-player-inline__controls button{cursor:pointer;color:#fff;background:0 0;border:none;border-radius:50%;place-items:center;min-block-size:36px;min-inline-size:36px;padding:.25rem;display:grid}.media-player-showcase .media-player__meta{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.media-player-showcase .media-player__meta__title{font-weight:700;font-size:var(--s);color:#fff;margin:0}.media-player-showcase .media-player__meta__artist{font-size:var(--xs);color:oklch(84.5222% 1.6049e-7 158.199);margin:0}.media-player-showcase .media-player__progress{padding:var(--s) var(--m);background:oklch(32.1092% 2.98023e-8 0);border-radius:1rem;align-items:center;display:flex}.progress-slider{appearance:none;cursor:pointer;background:oklch(100% 5.96046e-8 90/.3);border-radius:2px;outline:none;block-size:4px;inline-size:100%}.progress-slider::-webkit-slider-thumb{appearance:none;cursor:pointer;background:#fff;border-radius:50%;block-size:12px;inline-size:12px}.media-player-showcase .media-player__equalizer{border-radius:var(--border-radius);padding:var(--s);backdrop-filter:blur(10px);justify-content:space-around;align-items:center;gap:var(--xs);background:oklch(21.7786% 7.45058e-9 180/.9);min-block-size:80px;display:flex}.eq-bar{background:var(--blue-2);border-radius:4px;inline-size:8px;animation:1.2s ease-in-out infinite alternate eq-pulse}.eq-bar:first-child{block-size:30%;animation-delay:.1s}.eq-bar:nth-child(2){block-size:70%;animation-delay:.3s}.eq-bar:nth-child(3){block-size:45%;animation-delay:.2s}.eq-bar:nth-child(4){block-size:85%;animation-delay:.4s}.eq-bar:nth-child(5){block-size:60%;animation-delay:.15s}@keyframes eq-pulse{0%{transform:scaleY(.4)}to{transform:scaleY(1)}}.media-player-inline{justify-content:space-between;align-items:center;gap:var(--s);padding:var(--s) var(--m);background:var(--player-bg,oklch(20% .05 240/.85));border:1px solid var(--player-border,oklch(40% .05 240/.3));inline-size:100%;max-inline-size:24rem;color:var(--player-text,oklch(90% .02 240));border-radius:2rem;display:flex}.media-player-inline__meta{flex-direction:column;display:flex;overflow:hidden}.media-player-inline__title{font-weight:600;font-size:var(--s)}.media-player-inline__artist{font-size:var(--xs);opacity:.7}.media-player-inline__controls{align-items:center;gap:var(--xs);display:flex}.media-player-inline__controls button{cursor:pointer;color:inherit;background:0 0;border:none;border-radius:50%;place-items:center;padding:.25rem;display:grid}.media-player-grid{block-size:9.4rem;inline-size:100%;max-inline-size:20rem;padding:var(--s);backdrop-filter:blur(10px);background:linear-gradient(oklch(28.5017% 4.71216e-8 161.565/.8),oklch(28.5017% 4.71216e-8 161.565/.8));border:1px solid oklch(38.6654% 0 0/.5);border-radius:1.5rem;flex-direction:column;justify-content:space-between;display:flex;box-shadow:0 8px 32px oklch(0% 0 0/.4)}.checkout-timeline-container{background:var(--checkout-card-bg);border:1px solid var(--checkout-border-color);border-radius:var(--checkout-card-radius);inline-size:100%;max-inline-size:26rem;padding:var(--m);color:var(--checkout-text-primary);gap:var(--m);flex-direction:column;display:flex}.form-checkout{grid-template-columns:repeat(7,minmax(1.5rem,1fr));align-items:center;inline-size:100%;display:grid}.form-checkout label.check{align-items:center;gap:var(--xxs);cursor:pointer;text-align:center;flex-direction:column;display:flex}.form-checkout label.check input{opacity:0;pointer-events:none;position:absolute}.step-checkmark{border:2px solid var(--gray-border-dark);block-size:1.5rem;inline-size:1.5rem;transition:all var(--check-transition) var(--check-ease);color:#fff;border-radius:50%;place-items:center;font-size:.75rem;font-weight:700;display:grid}.form-checkout label.check input:checked~.step-checkmark,.step-checkmark.is-active{background:var(--checkout-accent-blue);border-color:var(--checkout-accent-blue)}.step-label{color:var(--checkout-text-secondary);font-size:.75rem}.form-checkout .line{background:var(--checkout-border-color);block-size:2px;inline-size:100%;position:relative}.form-checkout .line.active{background:var(--checkout-accent-blue)}.replay-btn{padding:var(--xs) var(--m);border-radius:var(--border-radius);background:var(--checkout-accent-blue);color:#fff;font-family:inherit;font-size:var(--s);cursor:pointer;align-self:center;align-items:center;gap:var(--xs);border:none;transition:opacity .2s;display:inline-flex}.replay-btn:hover{opacity:.9}.email-preview-container{background:var(--ec-surface);border:1px solid var(--ec-border);border-radius:var(--border-radius);inline-size:100%;max-inline-size:28rem;color:var(--checkout-text-primary);flex-direction:column;display:flex;overflow:hidden}.email-doc-header{padding:var(--s) var(--m);border-bottom:1px solid var(--ec-border);background:var(--ec-app-bg);justify-content:space-between;align-items:center;display:flex}.email-doc-header .brand-title{font-family:Google Sans,Roboto,sans-serif;font-weight:500;font-size:var(--s)}.email-hero-status{padding:var(--m);border-bottom:1px solid var(--ec-border)}.email-hero-status h3{margin:0 0 var(--xs) 0;font-size:var(--m);color:var(--green-google)}.email-hero-status p{font-size:var(--s);color:var(--checkout-text-secondary);margin:0}.email-product-item{gap:var(--m);padding:var(--m);border-bottom:1px solid var(--ec-border);align-items:center;display:flex}.email-product-img{border-radius:var(--xs);background:var(--black-4);block-size:48px;inline-size:48px;color:var(--text-light-color);flex-shrink:0;place-items:center;display:grid}.email-product-info{flex:1}.email-product-name{font-weight:600;font-size:var(--s);margin:0}.email-product-price{font-size:var(--s);color:var(--checkout-text-secondary);margin:var(--xxs) 0 0 0}.email-order-summary{gap:var(--s);padding:var(--m);font-size:var(--xs);color:var(--checkout-text-secondary);grid-template-columns:1fr 1fr;display:grid}.email-order-summary strong{color:var(--checkout-text-primary)}}@layer utilities{@keyframes enter{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes slide-in-left{0%{opacity:0;letter-spacing:.04rem;--recursive-CASL:1;scale:.96}to{opacity:1;letter-spacing:.12rem;--recursive-CASL:.8;scale:1}}.animate-letter{opacity:0;animation:slide-in-left .24s var(--ease-3) both;animation-delay:calc(var(--letter-index) * 24ms)}@supports (animation-delay:random(0s, 1s)){@keyframes slide-in-left-random{0%{opacity:0;scale:random(.24, .64);letter-spacing:.04rem;--recursive-CASL:random(0, 1)}to{opacity:1;letter-spacing:.12rem;--recursive-CASL:random(0, 1);scale:1}}.animate-letter{animation:slide-in-left-random .24s var(--ease-3) both;animation-delay:random(40ms, .28s)}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.animate-letter{opacity:1;animation:none!important}}@view-transition{navigation:auto}.link-clicked{animation:link-click var(--link-timing) ease-in-out;pointer-events:none}::view-transition-old(cover),::view-transition-new(cover){animation-duration:var(--link-timing);animation-timing-function:ease-in-out}::view-transition-old(cover){animation-name:fade-out,move-down;animation-duration:.4s,.36s;animation-timing-function:ease,ease;animation-iteration-count:1,1;animation-direction:normal,normal;animation-play-state:running,running;animation-delay:.1s;animation-fill-mode:none,none;animation-timeline:auto,auto}::view-transition-new(cover){animation:.4s fade-in,.36s move-up}.header a.active{border-block-end:var(--xxs) solid var(--blue-2);padding-block-end:var(--xxs)}@keyframes link-click{0%,to{color:inherit;transform:scale(1)}50%{color:var(--blue-2);transform:scale(1.1)}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes move-down{0%{transform:translateY(0)}to{transform:translateY(1.25rem)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes move-up{0%{transform:translateY(1.25rem)}to{transform:translateY(0)}}}