:root{--hue:236.8;--bg:oklch(96% .008 var(--hue));--fg:oklch(.142 .007 var(--hue));--fg-2:oklch(39.2% .005 var(--hue));--fg-3:oklch(.142 .007 var(--hue) / .56);--accent:oklch(.6668 .1847 var(--hue));--gutter:clamp(20px, 3.2vw, 44px);--h1:clamp(3.5rem, 15vw, 12.5rem);--lift:3svh;--r-card:40px;--hairline:oklch(.142 .007 var(--hue) / .12);--panel:oklch(.142 .007 var(--hue) / .05);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*,:before,:after{box-sizing:border-box;margin:0}html{background:var(--bg)}html.end-dark{background:#000}body{background:var(--bg);color:var(--fg);letter-spacing:-.011em;-webkit-font-smoothing:antialiased;font-family:Figtree,system-ui,-apple-system,Segoe UI,sans-serif;font-size:clamp(.9875rem,.95rem + .2vw,1.0625rem);line-height:1.5}img,video{object-fit:cover;width:100%;height:100%;display:block}video{will-change:transform}a{color:inherit;text-decoration:none}.nav,.footer{padding:28px var(--gutter);justify-content:space-between;align-items:center;display:flex}.nav{padding:0 calc(var(--gutter) + max(0px, (100% - 2 * var(--gutter) - 1440px) / 2));position:absolute;inset:clamp(20px,3vh,32px) 0 auto}.logo{letter-spacing:-.04em;align-items:center;gap:10px;height:46px;font-size:1.375rem;font-weight:700;line-height:1;display:flex}.logo img{width:auto;height:25px}.dot{color:var(--accent)}.nav-label{white-space:nowrap;color:var(--fg-3);font-size:1.0625rem;font-weight:500}.wrap{max-width:calc(var(--h1) * 6.2 + 2 * var(--gutter));padding:0 var(--gutter);margin:0 auto}.hero+figure{margin-top:calc(50svh + var(--lift) - var(--glass-h,var(--h1)) / 2 + 8px)}.hero{min-height:calc(50svh - var(--lift) + var(--glass-h,var(--h1)) / 2);text-align:center;place-items:end center;display:grid;position:relative}.ctas{top:calc(100% + (50svh + var(--lift) - var(--glass-h,var(--h1)) / 2) * .38);gap:12px;display:flex;position:absolute;left:50%;translate:-50% -50%}.cta{color:#fff;letter-spacing:-.01em;white-space:nowrap;background:#000;border-radius:999px;align-items:center;gap:10px;padding:14px 24px;font-size:.9375rem;font-weight:500;display:inline-flex}.cta-brand{background:var(--accent)}.cta-light{color:#000;background:#fff;margin-top:32px}.cta svg{opacity:.5}h1{margin-bottom:calc((var(--glass-h,var(--h1)) - var(--h1)) / 2);font-size:var(--h1);letter-spacing:-.055em;white-space:nowrap;font-weight:600;line-height:1}figure{aspect-ratio:3/2;border-radius:var(--r-card);overflow:hidden}.wide{aspect-ratio:16/9;position:relative}@font-face{font-family:Figtree;font-style:normal;font-weight:300 900;font-display:swap;src:url(/study/001-liquid-glass/fonts/figtree-latin-wght-normal.woff2)format("woff2");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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Figtree;font-style:normal;font-weight:300 900;font-display:swap;src:url(/study/001-liquid-glass/fonts/figtree-latin-ext-wght-normal.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Momo Signature;src:url(/study/001-liquid-glass/fonts/momo-signature.woff2)format("woff2");font-display:swap}.signature{-webkit-text-stroke:.015em currentColor;color:#fff;pointer-events:none;place-items:center;font-family:Momo Signature,cursive;font-size:clamp(3.5rem,13vw,11rem);font-weight:500;line-height:1;display:grid;position:absolute;inset:0}.pair{aspect-ratio:auto;grid-template-columns:1fr 1fr;gap:clamp(12px,1.6vw,20px);display:grid;overflow:visible}.pair img{aspect-ratio:4/5;border-radius:var(--r-card)}.cell{position:relative}.pair .signature{font-size:clamp(3rem,10vw,9rem)}.signature.to-end{justify-items:end;padding-right:6%}.signature.to-start{justify-items:start;padding-left:6%}.statement{text-align:center;padding:32vh 0}.after-glass{padding-top:calc(32vh + var(--glass-h,var(--h1)) * .75)}.statement h2,.faq h2{letter-spacing:-.03em;text-wrap:balance;font-size:clamp(1.5rem,1rem + 2vw,2.5rem);font-weight:500;line-height:1.2}.statement p{max-width:34rem;color:var(--fg-2);text-wrap:pretty;margin:20px auto 0;font-size:clamp(1.0625rem,1rem + .35vw,1.25rem)}code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em}pre{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--panel);text-align:left;max-width:34rem;color:var(--fg-2);border-radius:24px;margin:32px auto 0;padding:22px 26px;font-size:.875rem;line-height:1.7}pre code{font-size:inherit}pre .k{color:var(--fg)}.faq{max-width:44rem;margin:0 auto}.faq h2{text-align:center;margin-bottom:32px}.faq details{border-top:1px solid var(--hairline)}.faq details:last-child{border-bottom:1px solid var(--hairline)}.faq summary{letter-spacing:-.015em;cursor:pointer;justify-content:space-between;gap:24px;padding:22px 0;font-size:clamp(1.0625rem,1rem + .3vw,1.25rem);font-weight:500;list-style:none;display:flex}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";color:var(--fg-3);font-weight:400}.faq details[open] summary:after{content:"−"}.faq details p{max-width:38rem;color:var(--fg-2);padding-bottom:24px}.faq a,.statement a{text-decoration:underline;-webkit-text-decoration-color:var(--hairline);text-decoration-color:var(--hairline);text-underline-offset:3px}.footer-links{gap:28px;display:flex}.license,.footer-nordify svg{opacity:.55}.footer-nordify{align-items:center;gap:6px;display:inline-flex}.footer a:hover{color:var(--fg)}.footer{color:var(--fg-3);flex-wrap:wrap;gap:8px 24px;padding-top:32vh;font-size:1.0625rem}.dark{--fg:oklch(.97 .004 var(--hue));--fg-2:oklch(.97 .004 var(--hue) / .68);--fg-3:oklch(.97 .004 var(--hue) / .5);--hairline:oklch(.97 .004 var(--hue) / .16);--panel:oklch(.97 .004 var(--hue) / .07);color:var(--fg);background:#000}.glass{inset:0 0 calc(2 * var(--lift));z-index:10;width:var(--glass-w,60px);height:var(--glass-h,60px);pointer-events:none;margin:auto;position:fixed}.glass-tone{will-change:opacity;transition:opacity .45s}.glass-text{inset:0 0 calc(2 * var(--lift));z-index:10;width:var(--glass-w,60px);height:var(--glass-h,60px);pointer-events:none;border-radius:9999px;margin:auto;position:fixed;overflow:hidden}.glass-copy{padding:0 calc(var(--glass-h,60px) * .42);text-align:center;color:var(--fg);will-change:opacity, transform;place-items:center;display:grid;position:absolute;inset:0}.glass-copy h2{font-size:calc(clamp(1.25rem, .9rem + 1.6vw, 2.5rem) * var(--fit,1));letter-spacing:-.03em;text-wrap:balance;font-weight:500;line-height:1.15}.scroll-copy .glass-copy{will-change:opacity, translate;animation:linear none both;animation-timeline:scroll(root)}.glass-copy.on-dark{--fg:oklch(.97 .004 var(--hue))}.parked .glass,.parked .glass-text{inset:var(--park-top) 0 auto;margin:0 auto;position:absolute}.in-glass>h2{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.notice{z-index:20;width:min(34rem, 100vw - 2 * var(--gutter));background:oklch(.142 .007 var(--hue));color:oklch(.97 .004 var(--hue) / .72);border-radius:20px;align-items:flex-start;gap:12px;padding:14px 14px 14px 20px;font-size:.9375rem;line-height:1.45;display:flex;position:fixed;top:calc(clamp(20px,3vh,32px) + 12px);left:50%;translate:-50%}@media (width<=1100px){.notice{top:calc(clamp(20px,3vh,32px) + 58px)}}.notice strong{color:#fff;font-weight:600}.notice button{color:#fff;width:28px;height:28px;font:inherit;cursor:pointer;background:oklch(100% 0 0/.1);border:0;border-radius:50%;flex:none;font-size:1.125rem;line-height:1}@media (width<=720px){.ctas{gap:8px}.cta{gap:8px;padding:12px 17px;font-size:.875rem}.pair{grid-template-columns:1fr}.signature.to-end,.signature.to-start{justify-items:center;padding:0}}@media (width<=370px){.nav-label{font-size:.875rem}.ctas{flex-direction:column}.cta{justify-content:center}}:where(.lg-host,.lg-cover){--lg-r:30px;--lg-dark:0;--lg-spec:calc(.13 + .25 * var(--lg-dark));--lg-glint-exp:calc(1.35 + .1 * var(--lg-dark));--lg-glint-sat:calc(3.1 - 1.1 * var(--lg-dark));--lg-rim-exp:calc(.84 + .41 * var(--lg-dark));--lg-rim-sat:calc(2.2 - .9 * var(--lg-dark));--lg-underlay:calc(.14 - .11 * var(--lg-dark));--lg-shadow-o:calc(.35 * (1 - var(--lg-dark)));--lg-caustic-o:calc(.7 * (1 - var(--lg-dark)))}:where(.lg-host){position:relative}.lg-cover{pointer-events:none}.lg-host[data-lg-dark]+.lg-cover{--lg-dark:1}.lg-host:before{content:"";border-radius:inherit;box-sizing:border-box;pointer-events:none;border:calc(7px * var(--lg-s,1)) solid var(--lg-shadow,oklch(24% .05 236.8));transform:translateY(calc(26px * var(--lg-s,1))) scaleX(.93);filter:blur(calc(17px * var(--lg-s,1)));opacity:var(--lg-shadow-o,.35);position:absolute;inset:0}.lg-host>:where(:not(.lg-layer,.lg-defs)){z-index:2;position:relative}.lg-layer{border-radius:inherit;pointer-events:none;position:absolute;inset:0}.lg-tick{pointer-events:none;background:#80808001}.lg-tick[data-tick]{background:#80808002}.lg-defs{pointer-events:none;width:0;height:0;position:absolute;overflow:hidden}.lg-reflect{z-index:1;border-radius:0}.lg-caustic{transform:translateY(calc(12px * var(--lg-s,1))) scale(.86);filter:blur(calc(10px * var(--lg-s,1)))}.lg-caustic-ring{border-radius:inherit;box-sizing:border-box;border:calc(9px * var(--lg-s,1)) solid var(--lg-caustic,#fff);opacity:var(--lg-caustic-o,.7);position:absolute;inset:0;-webkit-mask-image:radial-gradient(70% 120% at 78% 0,#00000094 0%,#0000006b 35%,#0000002e 62%,#0000 85%),radial-gradient(70% 120% at 22% 100%,#00000094 0%,#0000006b 35%,#0000002e 62%,#0000 85%),linear-gradient(#0006 0 0);mask-image:radial-gradient(70% 120% at 78% 0,#00000094 0%,#0000006b 35%,#0000002e 62%,#0000 85%),radial-gradient(70% 120% at 22% 100%,#00000094 0%,#0000006b 35%,#0000002e 62%,#0000 85%),linear-gradient(#0006 0 0);-webkit-mask-composite:source-over,source-over;mask-composite:add,add}.lg-pane{background-image:linear-gradient(var(--lg-tint,transparent), var(--lg-tint,transparent));transform:translateZ(0)}.lg-edge{z-index:1;--w:calc(var(--lg-rim-w,.7px) * var(--lg-s,1));--d:calc(var(--lg-rim-fade,2px) * var(--lg-s,1));--r:var(--lg-r);-webkit-mask-image:var(--lg-arc), linear-gradient(to bottom, #000 var(--w), transparent var(--d)), linear-gradient(to top, #000 var(--w), transparent var(--d)), linear-gradient(to right, #000 var(--w), transparent var(--d)), linear-gradient(to left, #000 var(--w), transparent var(--d)), radial-gradient(circle var(--r) at 100% 100%, transparent calc(var(--r) - var(--d)), #000 calc(var(--r) - var(--w))), radial-gradient(circle var(--r) at 0 100%, transparent calc(var(--r) - var(--d)), #000 calc(var(--r) - var(--w))), radial-gradient(circle var(--r) at 100% 0, transparent calc(var(--r) - var(--d)), #000 calc(var(--r) - var(--w))), radial-gradient(circle var(--r) at 0 0, transparent calc(var(--r) - var(--d)), #000 calc(var(--r) - var(--w)));mask-image:var(--lg-arc), linear-gradient(to bottom, #000 var(--w), transparent var(--d)), linear-gradient(to top, #000 var(--w), transparent var(--d)), linear-gradient(to right, #000 var(--w), transparent var(--d)), linear-gradient(to left, #000 var(--w), transparent var(--d)), radial-gradient(circle var(--r) at 100% 100%, transparent calc(var(--r) - var(--d)), #000 calc(var(--r) - var(--w))), radial-gradient(circle var(--r) at 0 100%, transparent calc(var(--r) - var(--d)), #000 calc(var(--r) - var(--w))), radial-gradient(circle var(--r) at 100% 0, transparent calc(var(--r) - var(--d)), #000 calc(var(--r) - var(--w))), radial-gradient(circle var(--r) at 0 0, transparent calc(var(--r) - var(--d)), #000 calc(var(--r) - var(--w)));-webkit-mask-size:auto, calc(100% - 2 * var(--r)) 100%, calc(100% - 2 * var(--r)) 100%, 100% calc(100% - 2 * var(--r)), 100% calc(100% - 2 * var(--r)), var(--r) var(--r), var(--r) var(--r), var(--r) var(--r), var(--r) var(--r);mask-size:auto, calc(100% - 2 * var(--r)) 100%, calc(100% - 2 * var(--r)) 100%, 100% calc(100% - 2 * var(--r)), 100% calc(100% - 2 * var(--r)), var(--r) var(--r), var(--r) var(--r), var(--r) var(--r), var(--r) var(--r);-webkit-mask-position:0 0, var(--r) 0, var(--r) 100%, 0 var(--r), 100% var(--r), 0 0, 100% 0, 0 100%, 100% 100%;mask-position:0 0, var(--r) 0, var(--r) 100%, 0 var(--r), 100% var(--r), 0 0, 100% 0, 0 100%, 100% 100%;transform:translateZ(0);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-composite:source-in,source-over,source-over,source-over,source-over,source-over,source-over,source-over,source-over;mask-composite:intersect,add,add,add,add,add,add,add,add}.lg-fold{--lg-arc:linear-gradient(#000 0 0);--w:0px;--d:calc(var(--lg-r) * var(--lg-fold-k,.39))}.lg-glint{--lg-arc:var(--lg-arc-glint)}.lg-rim{--lg-arc:var(--lg-arc-rim)}.lg-spec{background:rgb(255 255 255/var(--lg-spec,.13));--lg-arc:var(--lg-arc-glint)}.lg-underlay{z-index:1;background-color:rgb(255 255 255/var(--lg-underlay,.14))}.lg-host[data-lg-dark]{--lg-dark:1}