@charset "UTF-8";:root{--primary: #574b90;--primary-deep: #423679;--primary-soft: #efedf5;--accent: #c44569;--text: #1a1a2a;--muted: #596275;--bg: #fafaf8;--surface: #f0eff5;--border: #e0dff0;--border-soft: #ece9f3;--code-bg: #1f1a32;--code-text: #e8e6f2;--code-comment: #8a82a8;--on-primary: #ffffff;--on-primary-muted: rgba(255, 255, 255, .7);--on-primary-subtle: rgba(255, 255, 255, .1);--on-primary-border: rgba(255, 255, 255, .35);--on-primary-surface: rgba(255, 255, 255, .08);--on-primary-divider: rgba(255, 255, 255, .22);--highlight: #eeecf7;--mark: #ffc0d2;--reading-ref-js: #92600a;--reading-ref-front-end: #2d6a4f;--reading-ref-tools: #2c5fa0;--reading-ref-others: #3d4f63;--text-quote: 4rem;--text-quote-sm: 3.25rem;--space-card-gap: 16px;--space-card-inner: 6px;--space-section-divider: 32px;--space-section-head: 72px 0 28px;--space-grid-col: 32px;--space-lead-top: 28px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-8: 32px;--space-12: 48px;--line-height-prose: 1.75;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 10px;--radius-xl: 12px;--radius-pill: 999px;--font-display: "Rubik", system-ui, sans-serif;--font-body: "Inter", system-ui, sans-serif;--font-mono: "JetBrains Mono", ui-monospace, monospace;--text-xs: .75rem;--text-sm: .8125rem;--text-md: .875rem;--text-base: .9375rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.3125rem;--text-3xl: 1.375rem;--text-4xl: 1.75rem;--text-5xl: 1.875rem;--text-6xl: 2rem;--line-height-base: 1.4}@media(min-width:640px){:root{--space-card-gap: 28px;--space-card-inner: 12px;--space-section-divider: 64px;--text-base: 1rem}}:root{--col: 880px;--col-narrow: 720px;--col-wide: 1140px;--col-reading: 680px;--bp-tablet: 640px;--bp-desktop: 1280px}.link-prose,.post-prose a:not([class]),.case-study-prose a:not([class]){color:var(--primary);border-bottom:1px solid var(--border);transition:border-color .18s}@media(hover:hover){.link-prose:hover,.post-prose a:not([class]):hover,.case-study-prose a:not([class]):hover{border-bottom-color:var(--primary)}}.link-prose:focus-visible,.post-prose a:not([class]):focus-visible,.case-study-prose a:not([class]):focus-visible{border-bottom-color:var(--primary)}.link-underline{color:var(--text);font-family:var(--font-display);position:relative;padding-bottom:2px;text-decoration:none}.link-underline:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--primary);transform:scaleX(0);transform-origin:left;transition:transform .22s ease}@media(hover:hover){.link-underline:hover{color:var(--primary)}.link-underline:hover:after{transform:scaleX(1)}}.link-underline:focus-visible{color:var(--primary)}.link-underline:focus-visible:after{transform:scaleX(1)}.link-underline--md{font-size:var(--text-md)}.link-arrow{color:var(--text);font-family:var(--font-display);font-weight:500;font-size:var(--text-md);display:inline-flex;align-items:center;gap:var(--space-card-inner);position:relative;padding-bottom:2px;text-decoration:none}.link-arrow svg{flex-shrink:0;color:var(--muted);transition:transform .2s ease}.link-arrow:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--primary);transform:scaleX(0);transform-origin:left;transition:transform .22s ease}@media(hover:hover){.link-arrow:hover{color:var(--primary)}.link-arrow:hover svg{color:var(--primary);transform:translate(4px)}.link-arrow:hover:after{transform:scaleX(1)}}.link-arrow:focus-visible{color:var(--primary)}.link-arrow:focus-visible svg{color:var(--primary);transform:translate(4px)}.link-arrow:focus-visible:after{transform:scaleX(1)}.link-arrow--sm{font-size:var(--text-sm);font-weight:400}.link-external{color:var(--text);font-family:var(--font-display);font-weight:500;font-size:var(--text-md);display:inline-flex;align-items:center;gap:var(--space-card-inner);position:relative;padding-bottom:2px;text-decoration:none}.link-external svg{flex-shrink:0;color:var(--muted);transition:transform .2s ease}.link-external:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--primary);transform:scaleX(0);transform-origin:left;transition:transform .22s ease}@media(hover:hover){.link-external:hover{color:var(--primary)}.link-external:hover svg{color:var(--primary);transform:translate(3px,-3px)}.link-external:hover:after{transform:scaleX(1)}}.link-external:focus-visible{color:var(--primary)}.link-external:focus-visible svg{color:var(--primary);transform:translate(3px,-3px)}.link-external:focus-visible:after{transform:scaleX(1)}.link-external--sm{font-size:var(--text-sm);font-weight:400}.link-external--mono{font-family:var(--font-mono);font-size:var(--text-sm);font-weight:400;color:var(--muted)}.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:500;font-size:var(--text-base);padding:13px 22px;border-radius:var(--radius-pill);border:1px solid transparent;cursor:pointer;line-height:1;text-decoration:none;transition:background .18s,color .18s,border-color .18s,transform .12s}.btn svg{transition:transform .2s ease}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--primary);color:var(--on-primary)}@media(hover:hover){.btn-primary:hover{background:var(--primary-deep);color:var(--on-primary)}.btn-primary:hover svg{transform:translate(4px)}}.btn-primary:focus-visible{background:var(--primary-deep);color:var(--on-primary)}.btn-primary:focus-visible svg{transform:translate(4px)}.btn-ghost{background:transparent;color:var(--text);border-color:var(--text);padding:12px 20px}@media(hover:hover){.btn-ghost:hover{border-color:var(--primary);color:var(--primary)}.btn-ghost:hover svg{transform:translate(3px,-3px)}}.btn-ghost:focus-visible{border-color:var(--primary);color:var(--primary)}.btn-ghost:focus-visible svg{transform:translate(3px,-3px)}.project-links{display:flex;gap:18px;margin-top:4px}.post-prose,.case-study-prose{font-size:var(--text-base);line-height:var(--line-height-prose);color:var(--text)}.post-prose>:first-child,.case-study-prose>:first-child{margin-top:0}.post-prose section,.case-study-prose section{margin-bottom:var(--space-5)}.post-prose p,.post-prose ul,.post-prose ol,.post-prose blockquote,.case-study-prose p,.case-study-prose ul,.case-study-prose ol,.case-study-prose blockquote{max-width:var(--col-reading)}.post-prose p,.case-study-prose p{margin:0 0 var(--space-5)}.post-prose p:last-child,.case-study-prose p:last-child{margin-bottom:0}.post-prose h2,.case-study-prose h2{font-family:var(--font-display);font-size:var(--text-2xl);font-weight:700;letter-spacing:-.025em;margin:var(--space-12) 0 var(--space-4);color:var(--text)}.post-prose h2:first-child,.case-study-prose h2:first-child{margin-top:0}.post-prose h3:not(.cat-heading),.case-study-prose h3:not(.cat-heading){font-family:var(--font-display);font-size:var(--text-xl);font-weight:600;letter-spacing:-.015em;margin:var(--space-8) 0 var(--space-3);color:var(--text)}.post-prose ul,.post-prose ol,.case-study-prose ul,.case-study-prose ol{margin:0 0 var(--space-5);padding-left:30px}.post-prose .callout ul,.case-study-prose .callout ul,.post-prose .callout ul li,.case-study-prose .callout ul li{margin-bottom:0}.post-prose li,.case-study-prose li{margin:0 0 .25em}.post-prose li::marker,.case-study-prose li::marker{color:var(--primary);font-family:var(--font-mono);font-weight:500}.post-prose em,.case-study-prose em{font-family:var(--font-display);font-style:italic;font-weight:500}.post-prose code,.case-study-prose code{font-family:var(--font-mono);font-size:var(--text-xs);background:var(--surface);color:var(--primary);padding:.2em .5em;border-radius:var(--radius-sm)}.post-prose pre,.case-study-prose pre{background:var(--code-bg);color:var(--code-text);padding:24px 26px;border-radius:var(--radius-xl);overflow-x:auto;font-family:var(--font-mono);font-size:var(--text-sm);margin:0 0 30px}.post-prose pre code,.case-study-prose pre code{background:transparent;color:inherit;padding:0;font-size:inherit}.post-prose img,.case-study-prose img{width:100%;height:auto;margin:8px 0 30px;display:block;border-radius:var(--radius-lg);border:1px solid var(--border)}.post-prose a:not([class]),.case-study-prose a:not([class]){color:var(--primary)}.post-prose .wide,.post-prose .full-width,.case-study-prose .wide,.case-study-prose .full-width{max-width:var(--col);width:100%}.callout{position:relative;margin-block:var(--callout-margin-before, 56px) var(--callout-margin-after, 48px);margin-inline:0;padding:28px 22px 22px;background:var(--callout-bg, var(--surface));border-radius:var(--radius-xl);max-width:var(--col-narrow, 100%);margin:5rem auto}@media(min-width:640px){.callout{padding:40px 40px 36px}}.callout .mark{position:absolute;top:-34px;left:24px;font-family:var(--font-mono);font-weight:800;color:var(--primary);font-size:var(--text-quote);line-height:1;letter-spacing:-.04em;user-select:none}@media(max-width:639px){.callout .mark{font-size:var(--text-quote-sm);top:-28px;left:18px}}.callout .body{font-family:var(--font-body);font-size:var(--text-base);font-style:normal;color:var(--text);font-weight:400}.callout .body p{margin:0 0 14px}.callout .body p:last-child{margin-bottom:0}.callout .body strong{color:var(--primary);font-weight:600;font-style:normal}.callout .body em{color:var(--primary);font-style:normal}.callout .body a{color:var(--primary)}.callout .body ul,.callout .body ol{margin:0 0 14px;padding-left:1.25em}.callout .body ul:last-child,.callout .body ol:last-child{margin-bottom:0}.callout .body li{margin:0 0 .25em}.callout .body li:last-child{margin-bottom:0}.callout .body blockquote{margin:0 0 14px;padding-left:1em;border-left:2px solid var(--border);color:var(--muted)}.callout .body blockquote:last-child{margin-bottom:0}.about-page .callout{--callout-margin-before: 72px;--callout-margin-after: 56px;--callout-bg: var(--surface)}.post-reading .callout,.post-prose .callout{--callout-margin-before: 0;--callout-margin-after: 48px}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:var(--text-base);line-height:var(--line-height-base);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}a:not([class]){color:var(--primary);text-decoration:none}a:focus-visible,button:focus-visible,.btn:focus-visible,.post-row:focus-visible,.link-arrow:focus-visible,.link-external:focus-visible,.link-underline:focus-visible{outline:2px solid var(--primary);outline-offset:2px}h1,h2,h3,h4{font-family:var(--font-display);color:var(--text);margin:0;font-weight:600;letter-spacing:-.025em;line-height:1.25}h1{font-size:clamp(3rem,7.4vw,5.25rem);letter-spacing:-.04em;font-weight:600}h2{font-size:var(--text-5xl)}h3{font-size:var(--text-xl)}em,.italic{font-family:var(--font-display);font-style:italic;font-weight:500}::selection{background:var(--primary);color:var(--on-primary)}mark{font-weight:600;padding:0 .1em;color:var(--primary);position:relative;background:none;display:inline-block}mark:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 4' preserveAspectRatio='none'><path d='M0 2 Q 1.5 0 3 2 T 6 2 T 9 2 T 12 2' fill='none' stroke='%23574b90' stroke-width='1' stroke-linecap='round'/></svg>");background-repeat:repeat-x;background-size:12px 4px;pointer-events:none}.callout mark{padding:0}.wavy{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 5' preserveAspectRatio='none'><path d='M0 2.5 Q 1.75 0 3.5 2.5 T 7 2.5 T 10.5 2.5 T 14 2.5' fill='none' stroke='%23c44569' stroke-width='1.2' stroke-linecap='round'/></svg>");background-repeat:repeat-x;background-size:14px 5px;background-position:0 100%;padding-bottom:8px}hr{height:8px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 8' preserveAspectRatio='none'><path d='M0 4 Q 5 0 10 4 T 20 4 T 30 4 T 40 4 T 50 4 T 60 4 T 70 4 T 80 4' fill='none' stroke='%23574b90' stroke-width='1.1' stroke-linecap='round' opacity='0.55'/></svg>");background-repeat:repeat-x;background-size:80px 8px;background-position:0 50%;border:0;width:100%;margin:var(--space-section-divider) 0}.container{width:100%;max-width:var(--col);margin:0 auto;padding:0 16px}@media(min-width:640px){.container{padding:0 24px}}@media(min-width:1280px){.container{padding:0 32px}}.container.narrow{max-width:var(--col-narrow)}.container.reading{max-width:var(--col-reading)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.app{min-height:100vh;display:flex;flex-direction:column}.app>main{flex:1;padding:48px 0 64px}@media(min-width:528px){.app>main{padding:56px 0 88px}}@media(min-width:1280px){.app>main{padding:64px 0 96px}}.site-header{position:relative;z-index:10;background:transparent;border-bottom:1px solid var(--border-soft);transition:background .25s ease,border-color .25s ease,color .25s ease}.app:has(.home-main) .site-header{background:transparent;border-bottom-color:transparent;color:var(--on-primary)}.app:has(.home-main) .site-header .brand-name{color:var(--on-primary)}.app:has(.home-main) .site-header .brand-sub{color:var(--on-primary-muted)}.app:has(.home-main) .site-header .nav a:not(.icon-link){color:var(--on-primary)}@media(hover:hover){.app:has(.home-main) .site-header .nav a:not(.icon-link):hover{color:var(--on-primary)}}.app:has(.home-main) .site-header .nav a:not(.icon-link):focus-visible{outline-color:var(--on-primary)}.app:has(.home-main) .site-header .nav a:not(.icon-link):after{background:var(--on-primary)}.app:has(.home-main) .site-header .nav a:not(.icon-link).active{color:var(--on-primary)}.app:has(.home-main) .site-header .nav a:not(.icon-link).active:after{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 4' preserveAspectRatio='none'><path d='M0 2 Q 1.5 0 3 2 T 6 2 T 9 2 T 12 2' fill='none' stroke='%23ffffff' stroke-width='1.4' stroke-linecap='round'/></svg>")}.app:has(.home-main) .site-header .nav .icon-link{color:var(--on-primary-muted)}@media(hover:hover){.app:has(.home-main) .site-header .nav .icon-link:hover{color:var(--on-primary);background:var(--on-primary-subtle)}}.app:has(.home-main) .site-header .nav .icon-link:focus-visible{color:var(--on-primary);background:var(--on-primary-subtle);outline-color:var(--on-primary)}.app:has(.home-main) .site-header .nav-divider{background:var(--on-primary-divider)}.app:has(.home-main) .site-header .brand:focus-visible{outline-color:var(--on-primary);background:var(--on-primary-subtle)}.header-inner{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:16px;max-width:var(--col-wide);margin:0 auto}@media(min-width:528px){.header-inner{flex-direction:row;align-items:center;justify-content:space-between;gap:16px;padding:32px 24px 16px}}@media(min-width:1280px){.header-inner{padding:32px 32px 16px}}.brand{display:flex;flex-direction:column;gap:0;line-height:1;text-decoration:none;color:inherit;border-radius:var(--radius-sm);padding:4px 6px;margin:-4px -6px;transition:outline-color .18s,background .18s}.brand:focus-visible{outline:2px solid var(--primary);outline-offset:2px;background:var(--surface)}.brand-name{font-family:var(--font-display);font-weight:600;font-size:var(--text-xl);letter-spacing:-.015em;color:var(--text)}.brand-sub{font-family:var(--font-mono);font-size:var(--text-xs);color:var(--muted);letter-spacing:.02em;margin-top:5px}.nav{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:2px;width:100%;justify-content:space-between}@media(min-width:528px){.nav{gap:0;width:auto;justify-content:flex-end}}.nav a{font-family:var(--font-display);font-size:var(--text-base);font-weight:500;color:var(--text);padding:6px 0}@media(min-width:528px){.nav a{padding:8px 14px}}.nav a{position:relative;transition:color .18s}.nav a:not(.icon-link){text-decoration:none}.nav a:not(.icon-link):after{content:"";position:absolute;left:10px;right:10px;bottom:4px;height:1.5px;background:var(--primary);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}@media(min-width:528px){.nav a:not(.icon-link):after{left:14px;right:14px}}@media(hover:hover){.nav a:not(.icon-link):hover{color:var(--primary)}.nav a:not(.icon-link):hover:after{transform:scaleX(1)}}.nav a:not(.icon-link):focus-visible{color:var(--primary)}.nav a:not(.icon-link):focus-visible:after{transform:scaleX(1)}.nav a.active{color:var(--primary)}.nav a.active:after{transform:none;height:4px;background:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 4' preserveAspectRatio='none'><path d='M0 2 Q 1.5 0 3 2 T 6 2 T 9 2 T 12 2' fill='none' stroke='%23574b90' stroke-width='1.3' stroke-linecap='round'/></svg>");background-repeat:repeat-x;background-size:12px 4px;bottom:0}.nav .nav-divider{width:1px;height:18px;background:var(--border)}@media(min-width:528px){.nav .nav-divider{margin:0 8px}}.nav .icon-link{color:var(--muted);display:inline-flex;align-items:center;justify-content:center;width:20px;height:34px;padding:0;border-radius:var(--radius-pill);transition:color .18s,background .18s}@media(min-width:528px){.nav .icon-link{width:34px}}@media(hover:hover){.nav .icon-link:hover{color:var(--primary);background:var(--surface)}}.nav .icon-link:focus-visible{color:var(--primary);background:var(--surface)}.nav .icon-link :global(svg){width:17px;height:17px}.site-footer{border-top:1px solid var(--border);background:var(--bg);padding:48px 0 56px;color:var(--muted);font-size:var(--text-sm)}.footer-inner{max-width:var(--col-wide);margin:0 auto;padding:0 16px;display:flex;flex-direction:column;align-items:flex-start;gap:24px}@media(min-width:640px){.footer-inner{flex-direction:row;justify-content:space-between;align-items:flex-end}}@media(min-width:528px){.footer-inner{padding:0 24px}}@media(min-width:1280px){.footer-inner{padding:0 32px}}.footer-links{display:inline-flex;gap:22px}