:root{--page:#fff;--surface:#fff;--card:#ececec;--ink:#111;--on-ink:#fff;--text-secondary:#4d4d4d;--text-muted:#6b6b6b;--line:#d0d0d0;--image:#d4d4d4;--image-soft:#e6e6e6;--control-selected:#e6e6e6;--scrollbar:#c8c8c8;--link:#2f66c2;--link-hover:#1f4a92;--tag-bg:#ffffffb3;--btn-hover:#333;--avatar-shadow:#11111138;--sans:"Manrope", system-ui, sans-serif;--mono:"Geist Mono", ui-monospace, monospace;--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;--radius-card:28px;--radius-image:20px;--radius-small:12px;--radius-pill:999px;--margin:var(--space-6);--section-gap:var(--space-9);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font:400 16px/1.6 var(--sans);color:var(--ink);background:var(--page);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}:root[data-theme=dark]{--page:#0f0f10;--surface:#161618;--card:#1c1c1e;--ink:#f2f2f2;--on-ink:#0f0f10;--text-secondary:#b8b8b8;--text-muted:#8f8f8f;--line:#3d3d40;--image:#2a2a2c;--image-soft:#232325;--control-selected:#2a2a2c;--scrollbar:#2a2a2c;--link:#5888dc;--link-hover:#85aaf0;--tag-bg:#0f0f1099;--btn-hover:#d0d0d0;--avatar-shadow:#0000008c;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (width<=1199px){:root{--margin:var(--space-5);--section-gap:var(--space-8)}}@media (width<=699px){:root{--margin:var(--space-4);--section-gap:var(--space-7)}}*{box-sizing:border-box}body{background:var(--page);margin:0}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:500}:focus-visible{outline:2px solid var(--link);outline-offset:2px}.mono{font-family:var(--mono)}.label{font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);font-size:12px;line-height:1.2}.caption{font-family:var(--mono);font-size:12px;line-height:1.2}.underline-hover:hover{text-underline-offset:4px;text-decoration:underline}.underline-slide{background:linear-gradient(currentColor,currentColor) 0 calc(100% - 2px)/0 1px no-repeat;transition:background-size .3s}a:hover>.underline-slide,a:focus-visible>.underline-slide{background-size:100% 1px}@media (prefers-reduced-motion:reduce){.underline-slide{transition:none}}.placeholder{background:var(--image);border-radius:var(--radius-card);color:var(--text-secondary);font-family:var(--mono);justify-content:center;align-items:center;font-size:12px;display:flex}.tag{font-family:var(--mono);background:var(--tag-bg);color:var(--ink);padding:0 var(--space-2);border-radius:var(--radius-pill);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);white-space:nowrap;align-items:center;min-height:26px;font-size:12px;display:inline-flex}.button{background:var(--ink);color:var(--on-ink);border-radius:var(--radius-small);padding:0 var(--space-4);align-items:center;gap:6px;min-height:48px;font-size:16px;line-height:1.2;transition:background .2s;display:inline-flex}.button:hover{background:var(--btn-hover)}.link-inline{color:var(--link);font-weight:600}.link-inline:hover{color:var(--link-hover)}.theme-toggle{padding:var(--space-1);border:1px solid var(--line);border-radius:var(--radius-pill);flex:none;align-items:center;display:inline-flex}.theme-toggle button{width:var(--space-5);height:var(--space-5);border-radius:var(--radius-pill);color:var(--text-muted);cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;padding:0;display:inline-flex;position:relative}.theme-toggle button[aria-pressed=true]{background:var(--control-selected);color:var(--ink)}@media (pointer:coarse){.theme-toggle button:after{content:"";position:absolute;inset:-6px}}.visually-hidden{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.home{--top-space:var(--margin);max-width:1440px;min-height:100svh;padding:var(--top-space) var(--margin) var(--margin);margin:0 auto;position:relative}.home-inner{align-items:flex-start;gap:var(--space-6);display:flex}.home-intro{max-width:100%;top:var(--top-space);height:calc(100svh - var(--top-space) - var(--margin));flex:0 0 384px;grid-template:"id""bio""tools""contact""disclaimer"1fr/minmax(0,1fr);align-content:stretch;min-height:600px;display:grid;position:sticky}.home-id{align-items:center;gap:var(--space-3);grid-area:id;display:flex}.home-avatar{border-radius:var(--radius-image);width:72px;height:72px;box-shadow:0 8px 20px var(--avatar-shadow);border:2px solid #fff;flex:none;overflow:hidden;transform:rotate(-5deg)}.home-avatar img{object-fit:cover;width:100%;height:100%;display:block;transform:rotate(5deg)scale(1.1)}.home-name{font-weight:500}.home-bio{margin-top:var(--space-4);color:var(--text-muted);grid-area:bio;font-size:16px;line-height:1.6}.home-tools-row{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:var(--space-3) var(--space-5);flex-wrap:wrap;grid-area:tools;display:flex}.home-tools{gap:var(--space-2);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}.home-tools li{width:48px;height:48px;position:relative}.tooltip{border-radius:var(--radius-small);background:var(--ink);color:var(--on-ink);font-family:var(--mono);white-space:nowrap;pointer-events:none;opacity:0;z-index:2;padding:4px 8px;font-size:12px;line-height:1.2;transition:opacity .15s,transform .15s;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%,4px)}.home-tools li:hover .tooltip,.home-tools li:focus-visible .tooltip{opacity:1;transform:translate(-50%)}.home-tools li:focus-visible{outline:2px solid var(--link);outline-offset:2px;border-radius:var(--radius-small)}.home-tools img{border-radius:var(--radius-small);object-fit:cover;width:100%;height:100%;display:block}.home-contact{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--line);grid-area:contact;align-self:start}.home-disclaimer{color:var(--text-muted);margin:0;font-size:12px;line-height:1.5}.home-disclaimer-side{grid-area:disclaimer;align-self:end}.home-disclaimer-small{margin-top:var(--space-6);max-width:640px;display:none}.home-work{flex:1 1 0;min-width:0}.home-work-heading{padding-bottom:var(--space-3);justify-content:space-between;display:none}.home-cards{align-content:start;gap:var(--space-3);grid-template-columns:repeat(6,minmax(0,1fr));grid-auto-rows:356px;display:grid}.card{justify-content:flex-start;gap:var(--space-3);padding:var(--space-4);background:var(--card);border:1px solid var(--card);border-radius:var(--radius-card);--m1:#075057;--m2:#09606d;--m3:#5a9aa3;--m4:#d2ecf2;--base:var(--m3);--b1:var(--m1);--b2:var(--m3);--b3:var(--m4);--b4:var(--m1);--b5:var(--m4);flex-direction:column;grid-column:span 3;transition:border-color .2s;display:flex;position:relative;overflow:hidden;container-type:inline-size}.card[href=\#case-01]{--m1:#8ec5ee;--m2:#a9dcf2;--m3:#b9e6f0;--m4:#eef8fc;--b4:var(--m2)}.card[href=\#case-02]{--m1:#a8d5cc;--m2:#b5d6f2;--m3:#d4c8f3;--m4:#f6f3fb}.card[href=\#case-03]{--m1:#a9bff0;--m2:#bcd0fa;--m3:#cfdcfc;--m4:#f4f7ff;--b4:var(--m2)}.card[href=\#case-04]{--m1:#a3d0d3;--m2:#aee3f0;--m3:#c4e6f5;--m4:#eef6fb}.card[href=\#case-05]{--m1:#c3b9ee;--m2:#d4c9f6;--m3:#e2daf9;--m4:#f6f3fe}@property --x1{syntax:"<percentage>";inherits:false;initial-value:15%}@property --y1{syntax:"<percentage>";inherits:false;initial-value:20%}@property --x2{syntax:"<percentage>";inherits:false;initial-value:85%}@property --y2{syntax:"<percentage>";inherits:false;initial-value:40%}@property --x3{syntax:"<percentage>";inherits:false;initial-value:30%}@property --y3{syntax:"<percentage>";inherits:false;initial-value:95%}@property --x4{syntax:"<percentage>";inherits:false;initial-value:90%}@property --y4{syntax:"<percentage>";inherits:false;initial-value:5%}@property --x5{syntax:"<percentage>";inherits:false;initial-value:75%}@property --y5{syntax:"<percentage>";inherits:false;initial-value:100%}.card:before{content:"";opacity:0;background-color:var(--base);background-image:radial-gradient(circle 80cqw at var(--x1) var(--y1), color-mix(in srgb, var(--b1) 100%, transparent) 0%, color-mix(in srgb, var(--b1) 96%, transparent) 10%, color-mix(in srgb, var(--b1) 86%, transparent) 20%, color-mix(in srgb, var(--b1) 71%, transparent) 30%, color-mix(in srgb, var(--b1) 54%, transparent) 40%, color-mix(in srgb, var(--b1) 38%, transparent) 50%, color-mix(in srgb, var(--b1) 24%, transparent) 60%, color-mix(in srgb, var(--b1) 13%, transparent) 70%, color-mix(in srgb, var(--b1) 5%, transparent) 80%, color-mix(in srgb, var(--b1) 1%, transparent) 90%, color-mix(in srgb, var(--b1) 0%, transparent) 100%), radial-gradient(circle 66cqw at var(--x2) var(--y2), color-mix(in srgb, var(--b2) 100%, transparent) 0%, color-mix(in srgb, var(--b2) 96%, transparent) 10%, color-mix(in srgb, var(--b2) 86%, transparent) 20%, color-mix(in srgb, var(--b2) 71%, transparent) 30%, color-mix(in srgb, var(--b2) 54%, transparent) 40%, color-mix(in srgb, var(--b2) 38%, transparent) 50%, color-mix(in srgb, var(--b2) 24%, transparent) 60%, color-mix(in srgb, var(--b2) 13%, transparent) 70%, color-mix(in srgb, var(--b2) 5%, transparent) 80%, color-mix(in srgb, var(--b2) 1%, transparent) 90%, color-mix(in srgb, var(--b2) 0%, transparent) 100%), radial-gradient(circle 88cqw at var(--x3) var(--y3), color-mix(in srgb, var(--b3) 100%, transparent) 0%, color-mix(in srgb, var(--b3) 96%, transparent) 10%, color-mix(in srgb, var(--b3) 86%, transparent) 20%, color-mix(in srgb, var(--b3) 71%, transparent) 30%, color-mix(in srgb, var(--b3) 54%, transparent) 40%, color-mix(in srgb, var(--b3) 38%, transparent) 50%, color-mix(in srgb, var(--b3) 24%, transparent) 60%, color-mix(in srgb, var(--b3) 13%, transparent) 70%, color-mix(in srgb, var(--b3) 5%, transparent) 80%, color-mix(in srgb, var(--b3) 1%, transparent) 90%, color-mix(in srgb, var(--b3) 0%, transparent) 100%), radial-gradient(circle 72cqw at var(--x4) var(--y4), color-mix(in srgb, var(--b4) 100%, transparent) 0%, color-mix(in srgb, var(--b4) 96%, transparent) 10%, color-mix(in srgb, var(--b4) 86%, transparent) 20%, color-mix(in srgb, var(--b4) 71%, transparent) 30%, color-mix(in srgb, var(--b4) 54%, transparent) 40%, color-mix(in srgb, var(--b4) 38%, transparent) 50%, color-mix(in srgb, var(--b4) 24%, transparent) 60%, color-mix(in srgb, var(--b4) 13%, transparent) 70%, color-mix(in srgb, var(--b4) 5%, transparent) 80%, color-mix(in srgb, var(--b4) 1%, transparent) 90%, color-mix(in srgb, var(--b4) 0%, transparent) 100%), radial-gradient(circle 68cqw at var(--x5) var(--y5), color-mix(in srgb, var(--b5) 100%, transparent) 0%, color-mix(in srgb, var(--b5) 96%, transparent) 10%, color-mix(in srgb, var(--b5) 86%, transparent) 20%, color-mix(in srgb, var(--b5) 71%, transparent) 30%, color-mix(in srgb, var(--b5) 54%, transparent) 40%, color-mix(in srgb, var(--b5) 38%, transparent) 50%, color-mix(in srgb, var(--b5) 24%, transparent) 60%, color-mix(in srgb, var(--b5) 13%, transparent) 70%, color-mix(in srgb, var(--b5) 5%, transparent) 80%, color-mix(in srgb, var(--b5) 1%, transparent) 90%, color-mix(in srgb, var(--b5) 0%, transparent) 100%);transition:opacity .6s;animation-name:blob-1,blob-2,blob-3,blob-4,blob-5;animation-duration:9s,11s,13s,10s,12s;animation-timing-function:ease-in-out,ease-in-out,ease-in-out,ease-in-out,ease-in-out;animation-iteration-count:infinite,infinite,infinite,infinite,infinite;animation-direction:alternate,alternate,alternate,alternate,alternate;animation-play-state:paused;animation-delay:0s,0s,0s,0s,0s;animation-fill-mode:none,none,none,none,none;animation-timeline:auto,auto,auto,auto,auto;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#0000 20%,#000 70% 100%);mask-image:linear-gradient(#0000 20%,#000 70% 100%)}.card:hover:before{opacity:1;animation-play-state:running}@keyframes blob-1{0%{--x1:5%;--y1:95%}50%{--x1:65%;--y1:110%}to{--x1:30%;--y1:100%}}@keyframes blob-2{0%{--x2:95%;--y2:95%}50%{--x2:25%;--y2:85%}to{--x2:65%;--y2:105%}}@keyframes blob-3{0%{--x3:25%;--y3:80%}50%{--x3:80%;--y3:60%}to{--x3:10%;--y3:70%}}@keyframes blob-4{0%{--x4:90%;--y4:100%}50%{--x4:35%;--y4:110%}to{--x4:75%;--y4:95%}}@keyframes blob-5{0%{--x5:70%;--y5:75%}50%{--x5:15%;--y5:65%}to{--x5:95%;--y5:80%}}@media (prefers-reduced-motion:reduce){.card:before{animation:none}.card-layers img,.layer,.card-frames img,.card-images:not(.card-images-stack) img,.card-images-stack img{transition:none}}.card-wide{grid-column:span 6}.card-images{inset:168px var(--space-6) var(--space-5);justify-content:center;align-items:center;gap:var(--space-2);display:flex;position:absolute}.card-images img{object-fit:contain;border-radius:var(--radius-small);flex:1 1 0;min-width:0;max-width:100%;max-height:100%}.card[href=\#case-03] .card-images img{border-radius:0}.card[href=\#case-05] .card-images{inset:100px var(--space-6) -40px}.card-layers{left:var(--space-4);right:var(--space-4);aspect-ratio:1000/646;position:absolute;bottom:0;transform:translateY(41%)}.card-layers img{object-fit:contain;border-radius:var(--radius-small);width:100%;height:100%;display:block;position:relative}.layer{border-radius:var(--radius-small);background:#fff;position:absolute;bottom:0;box-shadow:0 4px 16px #0000000f}.layer-1{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#fffc;top:-8%;left:5%;right:5%}.card-layers img,.layer{transition:transform .7s cubic-bezier(.22,.8,.3,1)}.card:hover .card-layers img,.card:hover .layer{transform:translateY(-14px)}.card:hover .layer-1{transition-delay:70ms}.card:hover .layer-2{transition-delay:.14s}.layer-2{background:#fff9;top:-16%;left:10%;right:10%}.card-frames img,.card-images:not(.card-images-stack) img{transition:transform .7s cubic-bezier(.22,.8,.3,1)}.card:hover .card-frames img,.card:hover .card-images:not(.card-images-stack) img{transform:translateY(-14px)}.card-frames{--p:calc((100cqw + 48px) / 4 * 1.15);--s:calc(var(--p) * .92);left:calc(50% - var(--p) * 2 - var(--s) / 2);top:calc(100% - var(--s) * 1.52);grid-template-columns:repeat(5, var(--s));grid-auto-rows:var(--s);column-gap:calc(var(--p) - var(--s));row-gap:calc(var(--s) * .1);display:grid;position:absolute}.card-frames img{width:var(--s);height:var(--s);object-fit:contain}.frame{border-radius:calc(var(--s) * .23);-webkit-backdrop-filter:blur(14px)saturate(160%);backdrop-filter:blur(14px)saturate(160%);background:linear-gradient(150deg,#fffffff2 0%,#ffffff80 45%,#d6e0ee47 100%);border:1px solid #fffc;box-shadow:inset 0 1px #fffffff2,inset 0 -8px 16px #ffffff59,0 8px 22px #0000000a}.card-frames img,.card[href=\#case-02] .card-layers img,.card[href=\#case-03] .card-images img{filter:drop-shadow(0 4px 8px #0000001f)}.card-images-stack{--u:min(1cqw, 3.08px);inset:auto calc(var(--u) * -64.9) calc(var(--u) * -25) auto;justify-content:flex-end;align-items:flex-end;gap:0;width:100%}.card-images-stack img{width:calc(var(--u) * 113.6);height:calc(var(--u) * 83.4);max-width:none;max-height:none;margin-left:calc(var(--u) * -78.9);object-fit:cover;object-position:top left;transform:translateY(calc(var(--step,0px) + var(--lift,0px))) rotate(-4deg);flex:none;transition:transform .7s cubic-bezier(.22,.8,.3,1);box-shadow:0 4px 16px #0000001f}.card:hover .card-images-stack img{--lift:calc(var(--u) * -4.5)}.card:hover .card-images-stack img:nth-child(2){transition-delay:70ms}.card:hover .card-images-stack img:first-child{transition-delay:.14s}.card-images-stack img:first-child{--step:calc(var(--u) * -9.1);margin-left:0}.card-images-stack img:nth-child(2){--step:calc(var(--u) * -4.5)}:is(.card:has(.card-images-stack) .card-tags,.card:has(.card-images-stack) .card-text){z-index:1}.card-tags{align-content:flex-start;gap:var(--space-2);flex-wrap:wrap;display:flex;position:relative}.card-text{position:relative}.card-title{letter-spacing:-.01em;font-size:20px;line-height:1.25}.rows{display:none}.row{align-items:center;gap:var(--space-3);margin-inline:calc(var(--space-3) * -1);padding:var(--space-3);border-radius:20px;min-height:72px;transition:background-color .15s;display:flex;position:relative}.row:before,.row:last-child:after{content:"";left:var(--space-3);right:var(--space-3);background:var(--line);height:1px;transition:opacity .15s;position:absolute}.row:before{top:0}.row:last-child:after{bottom:0}.row:is(:hover,:focus-visible,:active):before,.row:is(:hover,:focus-visible,:active)+.row:before,.row:last-child:is(:hover,:focus-visible,:active):after{opacity:0}.row:hover,.row:focus-visible,.row:active{background:var(--card)}.row-thumb{background:var(--image);border-radius:var(--radius-small);flex:0 0 72px;width:72px;height:72px;padding:0;transition:background-color .15s;position:relative;overflow:hidden}.row-thumb img{left:var(--thumb-left,8px);top:var(--thumb-top,8px);width:var(--thumb-w,56px);max-width:none;height:auto;transform:var(--thumb-tf,none);display:block;position:absolute}.row[href=\#case-01] .row-thumb img{--thumb-w:100%;--thumb-left:0;--thumb-top:0;--thumb-tf:scale(1.06)}.row[href=\#case-02] .row-thumb img{--thumb-w:190px;--thumb-left:14px;--thumb-top:-44px}.row[href=\#case-04] .row-thumb img{--thumb-w:170px;--thumb-left:14px;--thumb-top:14px}.row[href=\#case-03] .row-thumb img{--thumb-w:190px;--thumb-top:50%;--thumb-tf:translateY(-50%)}.row[href=\#case-05] .row-thumb img{--thumb-w:112px;--thumb-left:50%;--thumb-top:60%;--thumb-tf:translate(-50%, -50%)}.row-body{flex:auto;min-width:0}.row-title{font-size:16px;font-weight:500;line-height:1.25}.row[href=\#case-01]:is(:hover,:focus-visible,:active) .row-thumb{background:#b9e6f0}.row[href=\#case-02]:is(:hover,:focus-visible,:active) .row-thumb{background:#d4c8f3}.row[href=\#case-03]:is(:hover,:focus-visible,:active) .row-thumb{background:#cfdcfc}.row[href=\#case-04]:is(:hover,:focus-visible,:active) .row-thumb{background:#c4e6f5}.row[href=\#case-05]:is(:hover,:focus-visible,:active) .row-thumb{background:#e2daf9}.row-tags{gap:var(--space-2);margin-top:var(--space-2);scrollbar-width:none;display:flex;overflow-x:auto}.row-tags::-webkit-scrollbar{display:none}.row .tag{background:var(--image-soft);-webkit-backdrop-filter:none;backdrop-filter:none;flex:none}@media (width<=1199px){.home-inner{flex-direction:column;align-items:stretch;gap:0;max-width:704px;margin:0 auto}.home-intro{gap:0 var(--space-5);flex:none;grid-template:"id contact""bio bio""tools tools"/minmax(0,1fr) auto;width:100%;height:auto;min-height:0;position:static}.home-contact{border-top:0;align-self:center;margin-top:0;padding-top:0}.home-disclaimer-side{display:none}.home-disclaimer-small{display:block}.home-contact .text-link{order:-1}.home-bio{max-width:528px}.bio-break{display:none}.home-work{margin-top:var(--space-7)}.home-cards{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(336px,auto)}.card{grid-column:span 1}.card-wide{grid-column:span 2}}@media (width<=699px){.home-intro{grid-template-columns:minmax(0,1fr);grid-template-areas:"id""bio""tools""contact"}.home-contact{margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--line)}.home-contact .text-link{order:0}.home-bio{max-width:none;font-size:14px}.home-tools{flex-wrap:nowrap;justify-content:flex-start;width:100%}.home-tools li{aspect-ratio:1;border-radius:25%;flex:1 1 0;width:auto;min-width:0;max-width:48px;height:auto}.home-tools img{border-radius:25%}.home-contact .copy-email{flex:auto}.home-contact .copy-email-button{justify-content:center;width:100%}.home-contact .text-link{margin-inline:auto}.home-work{margin-top:var(--space-6)}.home-work-heading{display:flex}.home-cards{display:none}.rows{display:block}}.copy-email{display:inline-flex;position:relative}.copy-email-button{z-index:1;cursor:pointer;border:0;font-family:inherit;position:relative}.copy-email-label{display:inline-grid}.copy-email-label>span{grid-area:1/1;justify-self:center}.copy-email-label>.is-hidden{visibility:hidden}.copy-email-cat{z-index:0;pointer-events:none;opacity:0;width:80px;height:80px;margin-left:-40px;animation:.7s ease-out forwards cat-rise;position:absolute;bottom:12px;left:50%}.copy-email-cat img{object-fit:cover;border-radius:50%;width:100%;height:100%;display:block}@keyframes cat-rise{0%{opacity:0;transform:translateY(0)}15%{opacity:1}60%{opacity:1}to{opacity:0;transform:translateY(-70px)}}@media (prefers-reduced-motion:reduce){.copy-email-cat{animation:.7s ease-out forwards cat-fade}@keyframes cat-fade{0%,to{opacity:0}30%,70%{opacity:1}}}.copy-email-button.is-copied svg{visibility:hidden}.copy-email-button.is-copied .copy-email-label{transform:translate(13px)}.text-link{align-items:center;min-height:48px;display:inline-flex}.contact-buttons{align-items:center;gap:var(--space-2) var(--space-5);flex-wrap:wrap;display:flex}.scroll-top{display:none}@media (width<=699px){.scroll-top{left:var(--margin);bottom:var(--margin);z-index:20;border-radius:var(--radius-small);background:var(--ink);width:48px;height:48px;color:var(--on-ink);cursor:pointer;opacity:0;pointer-events:none;border:0;justify-content:center;align-items:center;transition:opacity .2s,transform .2s,background .2s;display:inline-flex;position:fixed;transform:translateY(8px);box-shadow:0 4px 16px #0003}.scroll-top.is-visible{opacity:1;pointer-events:auto;transform:none}.scroll-top:active{background:var(--btn-hover)}}@media (prefers-reduced-motion:reduce){.scroll-top{transition:none}}.cs-inner{max-width:1360px;padding:0 var(--margin);margin:0 auto}.cs-header{justify-content:space-between;align-items:center;gap:var(--space-1) var(--space-3);flex-wrap:wrap;min-height:88px;display:flex}.cs-header-name{align-items:center;min-height:44px;font-weight:500;display:flex}.cs-hero,.cs-wide-image{height:560px}.cs-hero.cs-hero-image{aspect-ratio:2000/899;object-fit:cover;border-radius:var(--radius-card);width:100%;height:auto;max-height:560px;display:block}.cs-hero.cs-hero-blink{aspect-ratio:1920/1080;border-radius:var(--radius-card);width:100%;height:auto;max-height:560px;position:relative;overflow:hidden;container-type:inline-size}.cs-hero-blink-image{object-fit:cover;object-position:top;width:100%;height:100%;display:block}.cs-hero-cursor-mask{background:#fff;width:.260417%;height:1.875cqw;animation:2s step-end infinite cs-cursor-blink;position:absolute;top:16.9792cqw;left:52.8125%}@keyframes cs-cursor-blink{0%{opacity:1}50%{opacity:0}}@media (prefers-reduced-motion:reduce){.cs-hero-cursor-mask{opacity:0;animation:none}}.cs-intro{padding-top:var(--space-6);align-items:flex-start;gap:var(--space-6) var(--space-7);flex-wrap:wrap;display:flex}.cs-intro-title{flex:560px;min-width:0}.cs-hero-title{margin-top:var(--space-3);letter-spacing:-.03em;max-width:900px;font-size:60px;line-height:1.1}.cs-lead{margin-top:var(--space-3);max-width:640px;color:var(--text-secondary);font-size:20px;line-height:1.5}.cs-meta{gap:var(--space-4);flex-direction:column;flex:0 0 400px;max-width:100%;display:flex}.cs-meta-item{border-top:1px solid var(--line);padding-top:var(--space-3)}.cs-meta-value{margin-top:var(--space-2);line-height:1.5}.cs-section{margin-top:var(--section-gap);padding-top:var(--space-4);border-top:1px solid var(--line);gap:var(--space-4);flex-direction:column;display:flex}.cs-accordion{display:block}.cs-accordion+.cs-section{margin-top:var(--space-4)}.cs-accordion>summary{justify-content:space-between;align-items:center;gap:var(--space-3);cursor:pointer;list-style:none;display:flex}.cs-accordion>summary::-webkit-details-marker{display:none}.cs-accordion[open]>.cs-section-body{margin-top:var(--space-4)}.cs-chevron{flex:none;transition:transform .2s}.cs-accordion[open] .cs-chevron{transform:rotate(180deg)}@media (prefers-reduced-motion:reduce){.cs-chevron{transition:none}}.cs-section-title{letter-spacing:-.02em;font-size:32px;line-height:1.1}.cs-section-body{min-width:0}.cs-footer-title,.cs-subsection-title{letter-spacing:-.02em;font-size:24px;line-height:1.25}.cs-text{max-width:640px;color:var(--text-secondary)}.cs-strong{color:var(--ink);font-weight:500}.cs-text-ink{color:var(--ink)}.cs-note-wrap{margin-top:var(--space-4)}.cs-note{align-items:flex-start;gap:var(--space-3);max-width:640px;padding:var(--space-3) var(--space-4);border-radius:var(--radius-small);background:var(--card);color:var(--text-secondary);display:flex}.cs-note p{margin:0}.cs-note-icon{color:var(--ink);flex:none;margin-top:2px}.cs-stack{gap:var(--space-4);flex-direction:column;display:flex}.cs-stack-wide .cs-text{max-width:640px}.cs-lead-icon{margin-right:.4em}.cs-lead-icon-image{vertical-align:-.15em;width:1em;height:1em}.cs-subsection{gap:var(--space-3);flex-direction:column;display:flex}.cs-figure-grid{gap:var(--space-4) var(--space-3);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.cs-grid-image{height:320px}.cs-list{padding-left:var(--space-4);margin:0}.cs-list-spaced li+li,.cs-list-spaced .cs-list{margin-top:var(--space-2)}.cs-block{margin-top:var(--section-gap)}.cs-figure-image{border-radius:var(--radius-card);width:100%;height:auto;display:block}.cs-figure-square{border-radius:0}.cs-figure-bordered{border:1px solid var(--line)}.cs-figure{min-width:0;margin:0}.cs-figure-grid-tight .cs-caption{margin-top:var(--space-2)}.cs-caption{margin-top:var(--space-3);color:var(--text-muted)}.cs-decisions{gap:var(--space-7);flex-direction:column;display:flex}.cs-decision{margin-top:var(--space-4);align-items:flex-start;gap:var(--space-4) var(--space-6);flex-wrap:wrap;display:flex}.cs-decision:first-child{margin-top:0}.cs-decision-textonly .cs-decision-text{flex-basis:640px;max-width:640px}.cs-decision-aligned{container-type:inline-size}@container (width>=748px){.cs-decision-aligned .cs-decision-text{padding-top:calc(var(--frame-offset) * .5cqw)}}.cs-decision-reverse{flex-direction:row-reverse}.cs-decision-figures{gap:var(--space-4);flex-direction:column;flex:380px;min-width:0;display:flex}.cs-mid-image,.cs-decision-image{height:420px}.cs-decision-text{gap:var(--space-3);flex-direction:column;flex:320px;min-width:0;display:flex}.cs-decision-text:has(.cs-problem){gap:var(--space-5)}.cs-decision-text:has(.cs-subsection){gap:var(--space-4)}.cs-problem{gap:var(--space-3);flex-direction:column;display:flex}.cs-problem .cs-list{max-width:none}.cs-problem .cs-list li+li{margin-top:var(--space-2)}.cs-decision-text .cs-text{max-width:none}.cs-compare-panel{padding:var(--space-7) var(--space-8) 0;border-radius:var(--radius-card);background:#f1f1f1;overflow:hidden}.cs-compare{aspect-ratio:1110/1145;border-radius:var(--radius-small) var(--radius-small) 0 0;background:var(--surface);cursor:ew-resize;touch-action:pan-y;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden;box-shadow:0 2px 8px #1111111f,0 12px 40px #11111138}.cs-compare-image{object-fit:cover;object-position:top;width:100%;height:calc(100% + 2px);position:absolute;top:0;left:0}.cs-compare-wrap{max-width:820px;margin:0 auto}.cs-compare-labels{margin-bottom:var(--space-3);justify-content:space-between;display:flex}.cs-compare-label{padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill);background:var(--ink);color:var(--on-ink);font-family:var(--mono);font-size:12px}.cs-compare-divider{background:var(--ink);outline:none;width:2px;margin-left:-1px;position:absolute;top:0;bottom:0}.cs-compare-handle{background:var(--ink);width:40px;height:40px;color:var(--on-ink);letter-spacing:2px;border-radius:50%;justify-content:center;align-items:center;font-size:16px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.cs-compare-divider:focus-visible .cs-compare-handle{outline:2px solid var(--link);outline-offset:2px}.cs-next-heading{padding-bottom:var(--space-3);justify-content:space-between;align-items:baseline;display:flex}.cs-next{gap:var(--space-3);grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:356px;display:grid}.cs-next .card{grid-column:auto}.cs-footer{border-top:1px solid var(--line);padding:var(--space-5) 0 var(--space-6);justify-content:space-between;align-items:flex-start;gap:var(--space-4) var(--space-6);flex-wrap:wrap;display:flex}.cs-footer-text{gap:var(--space-3);flex-direction:column;flex:360px;max-width:640px;display:flex}@media (width<=1199px){.cs-mid-image{height:320px}.cs-inner{max-width:768px}.cs-header{min-height:80px}.cs-hero{height:680px}.cs-wide-image{height:380px}.cs-intro{padding-top:var(--space-5);display:block}.cs-hero-title{font-size:44px}.cs-lead{font-size:16px}.cs-meta{max-width:none;margin-top:var(--space-6);gap:var(--space-4) var(--space-5);grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));display:grid}.cs-decision-image{height:360px}.cs-compare-panel{padding:var(--space-6) var(--space-6) 0}.cs-next{grid-auto-rows:336px}}@media (width<=699px){.cs{--radius-card:clamp(14px, 4vw, 28px)}.cs-inner{max-width:688px}.cs-header{min-height:72px}.cs-hero{height:480px}.cs-intro{padding-top:var(--space-4)}.cs-wide-image{height:260px}.cs-next{grid-template-columns:minmax(0,1fr)}.cs-hero-title{font-size:32px}.cs-meta{grid-template-columns:repeat(auto-fit,minmax(min(100%,140px),1fr))}.cs-section-title{font-size:24px}.cs-subsection-title{font-size:20px}.cs-decision-image{height:280px}.cs-compare-panel{padding:var(--space-4) var(--space-4) 0}.cs-figure-grid{grid-template-columns:minmax(0,1fr)}.cs-grid-image,.cs-mid-image{height:240px}}.cs-before-after{gap:var(--space-3);flex-direction:column;display:flex}.cs-before-after-item,.cs-before-after-frame{position:relative}.cs-before-after-item .cs-compare-label{top:var(--space-3);left:var(--space-3);z-index:3;position:absolute}.cs-hotspots{position:absolute;inset:0}.cs-hotspot{outline:0 solid var(--ink);outline-offset:-2px;position:absolute;top:0;bottom:0}.cs-hotspot:first-child{border-radius:var(--radius-card) 0 0 var(--radius-card)}.cs-hotspot:last-child{border-radius:0 var(--radius-card) var(--radius-card) 0}.cs-hotspot{transition:background-color .2s}.cs-hotspot:hover,.cs-hotspot:focus-visible,.cs-hotspot.is-active{outline-width:2px}.cs-hotspot.is-dimmed{background:#00000080}.cs-hotspot-tip{border-radius:var(--radius-small);background:var(--ink);color:var(--on-ink);font-family:var(--mono);white-space:nowrap;pointer-events:none;opacity:0;z-index:2;padding:4px 8px;font-size:12px;line-height:1.2;transition:opacity .15s,transform .15s;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%,4px)}.cs-hotspot:hover .cs-hotspot-tip,.cs-hotspot:focus-visible .cs-hotspot-tip{opacity:1;transform:translate(-50%)}.cs-image-stack{gap:var(--space-3);flex-direction:column;display:flex}@media (width<=699px){.cs-before-after-item .cs-compare-label{margin-bottom:var(--space-2);display:inline-block;position:static}}.tm-frame{border-radius:var(--radius-card);background:#fff;overflow:hidden;container-type:inline-size}.tm-stage{justify-content:center;align-items:flex-start;height:44em;padding:3em 2em 0;font-size:min(16px,1.44928cqw);display:flex}.tm{color:#111;width:65em;line-height:1.4;position:relative;container:tm/inline-size}.tm-running .tm{animation:14s ease-in-out infinite tm-resize}@keyframes tm-resize{0%,18%{width:65em}30%,48%{width:52.5em}60%,78%{width:36.5em}90%,to{width:65em}}@media (prefers-reduced-motion:reduce){.tm-running .tm{animation:none}}.tm-badge{font-family:var(--mono);color:#6b6b6b;font-size:.75em;position:absolute;top:-2em;left:0}.tm-photo{aspect-ratio:1018/560;background:#ddd;border-radius:1.75em;position:relative;overflow:hidden}.tm-photo>img{object-fit:cover;transform-origin:0 0;width:100%;height:100%;display:block;transform:scale(1.07)}.tm-loc{font-size:.875em}.tm-title{white-space:nowrap;margin-top:.3em;font-size:1.375em;font-weight:600;line-height:1.2}.tm-quote{margin:0;font-size:1.125em;line-height:1.45}.tm-author{align-items:center;gap:.9em;display:flex}.tm-portrait{object-fit:cover;border-radius:50%;flex:none;width:4em;height:4em}.tm-name{font-size:1.0625em;font-weight:600}.tm-role{color:#555;margin-top:.15em;font-size:.875em}.tm-dots{align-items:center;gap:.45em;display:inline-flex}.tm-dots i{background:#d3d3d3;border-radius:1em;width:.5em;height:.5em;display:block}.tm-dots i.tm-dot-on{background:#111;width:1.3em}.tm-pill{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#82828280;border-radius:999px;padding:.4em .7em;position:absolute;bottom:1em;left:50%;transform:translate(-50%)}.tm-pill .tm-dots i{background:#fff9}.tm-pill .tm-dots i.tm-dot-on{background:#fff}.tm-nav{justify-content:center;align-items:center;gap:2.4em;margin-top:1.6em;display:flex}.tm-below{margin-top:1em}.tm-overlay{background:#f3f3f3eb;border-radius:1.5em;padding:1em 1.1em;position:absolute;top:1em;left:1em}@container tm (width>=59em){.tm-badge:after{content:"Desktop"}.tm-overlay{width:21.5em}.tm-quote-overlay{margin:1.1em 0 1em}.tm-pill,.tm-below{display:none}}@container tm (width>=44em) and (width<=58.99em){.tm-badge:after{content:"Tablet"}.tm-quote-overlay,.tm-author-overlay,.tm-nav,.tm-head{display:none}.tm-overlay{padding:.9em 1.1em;top:1.2em;left:1.2em}.tm-below{align-items:center;gap:1.6em;display:flex}.tm-below .tm-quote{background:#f3f3f3;border-radius:1.5em;flex:1 1 0;padding:1.1em 1.3em;font-size:1.0625em}.tm-below .tm-author{flex:0 0 36%}}@container tm (width<=43.99em){.tm-badge:after{content:"Mobile"}.tm-overlay,.tm-nav{display:none}.tm-below{background:#f3f3f3;border-radius:1.5em;padding:1.3em}.tm-below .tm-quote{margin:1em 0 1.2em;font-size:1.0625em}}@container tm (width>=44em){.tm-head{display:none}}.flow{border-radius:var(--radius-card);background-color:#f2f2f2;background-image:linear-gradient(#0000000b 1px,#0000 1px),linear-gradient(90deg,#0000000b 1px,#0000 1px);background-size:40px 40px;overflow:hidden}.flow svg{width:100%;height:auto;display:block}.flow-edge{fill:none;stroke:#6b6b6b;stroke-width:3px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1px;opacity:0;transition:stroke-dashoffset .3s,opacity .3s}.flow-icon{transform:translate(525px, calc(var(--y) + var(--rise))) scale(.5);transform-box:fill-box;transform-origin:50%;opacity:0;transition:transform .5s,opacity .3s}.flow-root{opacity:1;transform:translate(var(--x), calc(var(--y) + var(--rise))) scale(1.25)}.flow-node{opacity:0;transform:translate(var(--x), calc(var(--y) + 24px));transition:opacity .3s,transform .3s}.flow-step-1 .flow-icon,.flow-step-2 .flow-icon{opacity:1;transform:translate(var(--x), calc(var(--y) + var(--rise))) scale(1);transition:transform .9s cubic-bezier(.22, .8, .3, 1) var(--d), opacity .5s ease var(--d)}.flow-step-2 .flow-icon{transform:translate(var(--x), var(--y)) scale(1);transition:transform 1s cubic-bezier(.5, 0, .2, 1) var(--d)}.flow-step-2 .flow-edge{stroke-dashoffset:0;opacity:1;transition:stroke-dashoffset .8s cubic-bezier(.5, 0, .2, 1) var(--d), opacity 0s var(--d)}.flow-step-2 .flow-node{opacity:1;transform:translate(var(--x), var(--y));transition:opacity .6s ease var(--d), transform .7s cubic-bezier(.22, .8, .3, 1) var(--d)}@media (prefers-reduced-motion:reduce){.flow-edge,.flow-node,.flow-icon{transition:none!important}}.flow-shadow{filter:drop-shadow(0 5px 9px #0003)}
