@font-face{font-family:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/_astro/fraunces-vietnamese-wght-normal.CnvboYUG.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/_astro/fraunces-latin-ext-wght-normal.Ca2vKHc0.woff2)format("woff2-variations");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:Fraunces Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/_astro/fraunces-latin-wght-normal.ukD16Tqj.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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--ink:#1b1d22;--muted:#5d6270;--paper:#f6f6f4;--card:#fff;--line:#e2e2de;--accent:#ffc500;--serif:"Fraunces Variable", Georgia, serif;--sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--paper);color:var(--ink);font:400 1.0625rem/1.6 var(--sans);margin:0}a{color:inherit;text-decoration-color:var(--accent);text-underline-offset:3px;text-decoration-thickness:2px}a:hover{text-decoration-color:var(--ink)}:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:2px}img{max-width:100%;height:auto}h1,h2,h3{overflow-wrap:break-word;hyphens:auto}.wrap{max-width:68rem;padding:0 max(1.25rem, env(safe-area-inset-right)) 0 max(1.25rem, env(safe-area-inset-left));flex-direction:column;min-height:100vh;margin:0 auto;display:flex}main{flex:1}.nav{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem 1.5rem;padding:1.25rem 0;display:flex}.brand{font:700 1.25rem var(--serif);white-space:nowrap;text-decoration:none}.nav ul{gap:1.5rem;margin:0;padding:0;font-size:.9375rem;list-style:none;display:flex}.nav ul a{white-space:nowrap;text-decoration:none}.nav ul a:hover,.nav ul a[aria-current]{text-decoration:underline 2px var(--accent);text-underline-offset:3px}h1{font:600 clamp(2.25rem, 5vw, 3.5rem)/1.1 var(--serif);letter-spacing:-.01em;margin:0 0 1.25rem}.name{text-decoration:underline var(--accent);text-underline-offset:.18em;text-decoration-thickness:.09em}.lead{color:var(--muted);font-size:1.2rem}.cover{grid-template-columns:300px 1fr;align-items:center;gap:3rem;padding:2.5rem 0;display:grid}.portrait{background:#e9e9e7;border-radius:1.25rem;width:100%;display:block}.cover h1{margin-bottom:1.5rem}.intro{max-width:36rem;margin:0 0 1.5rem;font-size:1.25rem}.contact{flex-wrap:wrap;gap:.5rem 1.5rem;margin:0;padding:0;font-size:.9375rem;list-style:none;display:flex}.contact svg{vertical-align:-1px;width:14px;height:14px;margin-right:.35rem}.awards{background:var(--line);border:1px solid var(--line);border-radius:1rem;grid-template-columns:repeat(6,1fr);gap:1px;margin:0 0 4rem;padding:0;list-style:none;display:grid;overflow:hidden}.award{background:var(--card);grid-template-rows:72px 1fr;gap:.75rem;padding:1.1rem 1rem;display:grid}.award-logo{justify-content:center;align-items:center;display:flex}.award-logo img{object-fit:contain;width:auto;max-width:100%;max-height:72px}.award-text{text-align:center;align-self:end}.award-text b{font:600 .95rem/1.25 var(--serif);display:block}.award-text span{color:var(--muted);margin-top:.2rem;font-size:.8125rem;line-height:1.35;display:block}.awards.large{grid-template-columns:repeat(3,1fr);margin:1rem 0 2rem}.awards.large .award{grid-template-rows:88px 1fr;padding:1.25rem}.awards.large .award-logo img{max-height:88px}section{padding:0 0 4.5rem}.section-head{border-bottom:2px solid var(--ink);justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1.75rem;padding-bottom:.5rem;display:flex}h2{font:600 1.9rem/1.2 var(--serif);margin:0}.section-head a{font-size:.9375rem}.groups{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.5rem;display:grid}.group{background:var(--card);border:1px solid var(--line);border-radius:1rem;padding:1.5rem}.group h3{font:600 1.25rem var(--serif);margin:0}.group>p{color:var(--muted);margin:.25rem 0 1rem;font-size:.9375rem}.product{border-top:1px solid var(--line);grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:.1rem .9rem;padding:.75rem 0;text-decoration:none;display:grid}.product .logo{border:1px solid var(--line);background:#fff;border-radius:10px;grid-row:1/span 3;align-self:start;place-items:center;width:44px;height:44px;display:grid;overflow:hidden}.product .logo img{object-fit:contain;width:30px;height:30px}.product .logo i{font:600 1.2rem var(--serif);font-style:normal}.product b{grid-column:2;font-weight:600}.product .desc{color:var(--muted);grid-column:2;font-size:.9375rem;line-height:1.4}.product .site{overflow-wrap:anywhere;color:var(--muted);grid-column:2;align-items:center;gap:.35rem;font-size:.8125rem;display:inline-flex}.product .site img{object-fit:contain;width:14px;height:14px}.product em{border:1px solid var(--line);color:var(--muted);white-space:nowrap;border-radius:99px;grid-area:1/3/span 3;padding:.1rem .55rem;font-size:.75rem;font-style:normal}.product em.since{background:var(--accent);border-color:var(--accent);color:var(--ink)}a.product:hover b{text-decoration:underline 2px var(--accent);text-underline-offset:3px}.blog-page h1,.products-page h1{margin-top:1.5rem}.blog-page .lead,.products-page .lead{max-width:42rem;margin-bottom:2rem}.featured{background:var(--card);border:1px solid var(--line);border-radius:1rem;grid-template-columns:1.3fr 1fr;align-items:center;gap:2rem;margin-bottom:2rem;text-decoration:none;display:grid;overflow:hidden}.featured .body{padding:1.5rem 2rem 1.5rem 0}.featured h3{font:600 1.75rem/1.2 var(--serif);margin:.5rem 0}.posts{grid-template-columns:repeat(3,1fr);gap:1.5rem;display:grid}.post{background:var(--card);border:1px solid var(--line);border-radius:1rem;flex-direction:column;text-decoration:none;display:flex;overflow:hidden}.thumb{aspect-ratio:16/9;background:#e9e9e7;position:relative}.thumb img{object-fit:cover;width:100%;height:100%;display:block}.thumb.empty{background:var(--ink);place-items:center;display:grid}.thumb.empty>span:first-child{font:600 1.5rem var(--serif);color:var(--accent)}.thumb .play{color:#fff;background:#1b1d22d9;border-radius:99px;padding:.15rem .6rem;font-size:.75rem;position:absolute;bottom:.75rem;left:.75rem}.post .body{padding:1rem 1.1rem 1.25rem}.post h3{font:600 1.15rem/1.3 var(--serif);margin:.35rem 0 .5rem}.post p,.featured p{color:var(--muted);margin:0;font-size:.9375rem}.post .source,.featured .source{color:var(--ink);margin-top:.5rem;font-weight:600}.meta{color:var(--muted);font-size:.8125rem}.meta .tag{color:var(--ink);font-weight:600}a.post:hover h3,a.featured:hover h3{text-decoration:underline 2px var(--accent);text-underline-offset:4px}p.more{text-align:center;margin:2.5rem 0 0}.button{background:var(--ink);color:#fff;border-radius:99px;padding:.8rem 1.5rem;font-weight:600;text-decoration:none;display:inline-block}.button:hover{box-shadow:0 0 0 3px var(--accent);background:#000}.article{max-width:42rem;margin:0 auto;padding:1.5rem 0 4rem}.article h1{font-size:clamp(2rem,4vw,2.75rem)}.article video,.article .cover-img{background:#000;border-radius:1rem;width:100%;height:auto;margin:1.5rem 0;display:block}.article ul{padding-left:1.2rem}.article ul.awards{padding:0}.article h2{margin:2.5rem 0 .75rem;font-size:1.5rem}.byline{border-top:1px solid var(--line);align-items:center;gap:.75rem;margin-top:2.5rem;padding-top:1.25rem;font-size:.9375rem;display:flex}.byline img{object-fit:cover;object-position:top;border-radius:50%;width:48px;height:48px}.facts{grid-template-columns:repeat(3,1fr);gap:1rem;margin:2rem 0;display:grid}.facts div{background:var(--card);border:1px solid var(--line);border-radius:1rem;padding:1rem}.facts b{font:600 1.6rem/1.2 var(--serif);margin-bottom:.3rem;display:block}.facts span{color:var(--muted);font-size:.875rem;line-height:1.3;display:block}.photos{grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0 2rem;display:grid}.photos figure{margin:0}.photos img{aspect-ratio:4/3;object-fit:cover;border-radius:.75rem;width:100%;display:block}.photos .live-demo img{object-position:top}.photos figcaption{color:var(--muted);margin-top:.35rem;font-size:.8125rem}.prose{width:100%;max-width:42rem;margin:0 auto}article.prose{padding:1.5rem 0 4rem}article.prose h1{font-size:2.25rem}article.prose h2{font:600 1.25rem/1.3 var(--serif);margin:2rem 0 .5rem}.prose p,.prose ul{margin:0 0 1rem}.prose address{margin:0 0 1rem;font-style:normal}footer{border-top:1px solid var(--line);color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:.5rem 1.5rem;padding:1.5rem 0 2.5rem;font-size:.875rem;display:flex}footer nav{flex-wrap:wrap;gap:.5rem 1.25rem;display:flex}footer a{text-decoration:none}footer a:hover{text-decoration:underline 2px var(--accent)}.version{margin:0}.tabbar,.install{display:none}.tabbar svg,.share-icon{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round}.share-icon{vertical-align:-.2em;stroke-width:2px;width:1.15em;height:1.15em}dialog.sheet{width:100%;max-width:none;padding:1.5rem 1.25rem calc(1.5rem + env(safe-area-inset-bottom));background:var(--paper);color:inherit;border:0;border-radius:1.25rem 1.25rem 0 0;margin:auto 0 0}dialog.sheet::backdrop{background:#0006}.sheet h2{margin-bottom:1rem;font-size:1.35rem}.sheet-app{background:var(--card);border:1px solid var(--line);border-radius:.9rem;align-items:center;gap:.75rem;margin:0;padding:.75rem;display:flex}.sheet-app img{border-radius:13px}.sheet-app span{color:var(--muted);font-size:.875rem}.sheet-app b{color:var(--ink);font-size:1rem;display:block}.sheet ol{margin:1rem 0 1.25rem;padding-left:1.25rem}.sheet li{margin:.4rem 0}.sheet .button{width:100%;font:inherit;cursor:pointer;border:0;font-weight:600;display:block}@media (width<=800px){.cover,.featured{grid-template-columns:1fr}.groups{grid-template-columns:minmax(0,1fr)}.cover{gap:1.5rem;padding-top:1rem}.portrait{max-width:220px}.awards,.awards.large{grid-template-columns:repeat(2,1fr)}.posts,.facts,.photos{grid-template-columns:1fr}.featured .body{padding:0 1.25rem 1.5rem}.nav ul{gap:1rem}body{padding-bottom:calc(4.25rem + env(safe-area-inset-bottom))}.nav{z-index:10;padding:calc(.75rem + env(safe-area-inset-top)) 1.25rem .75rem;backdrop-filter:blur(16px);background:#f6f6f4e0;flex-wrap:nowrap;margin:0 -1.25rem;position:sticky;top:0}.nav-page{display:none}.nav ul a{border:1px solid var(--line);background:var(--card);border-radius:99px;padding:.15rem .65rem;font-size:.75rem;font-weight:600;display:inline-block}.tabbar{z-index:20;padding:.4rem .25rem calc(.4rem + env(safe-area-inset-bottom));backdrop-filter:blur(20px);border-top:1px solid var(--line);background:#ffffffe6;grid-template-columns:repeat(4,1fr);display:grid;position:fixed;inset:auto 0 0}.tabbar:after{content:"";background:inherit;height:300px;position:absolute;top:100%;left:0;right:0}.tabbar a{color:#80858f;-webkit-tap-highlight-color:transparent;flex-direction:column;align-items:center;gap:.1rem;font-size:.6875rem;font-weight:500;text-decoration:none;display:flex}.tab-icon{border-radius:99px;place-items:center;width:3.4rem;height:1.9rem;display:grid}.tabbar svg{width:24px;height:24px}.tabbar a[aria-current]{color:var(--ink)}.tabbar a[aria-current] .tab-icon{background:var(--accent)}.cover{grid-template-columns:92px 1fr;gap:1rem;padding:.5rem 0 1.25rem}.cover>div{display:contents}.portrait{border-radius:18px;width:92px}.cover h1{align-self:center;margin:0;font-size:1.75rem}.intro,.contact{grid-column:1/-1}.intro{margin:0;font-size:1rem}.contact{grid-template-columns:1fr 1fr;gap:.5rem;display:grid}.contact a{background:var(--card);border:1px solid var(--line);text-align:center;overflow-wrap:anywhere;border-radius:.9rem;justify-content:center;align-items:center;gap:.35rem;min-height:44px;padding:.5rem;font-size:.875rem;font-weight:600;text-decoration:none;display:flex}.contact svg{margin:0}footer{text-align:center;flex-direction:column;align-items:center}footer nav{justify-content:center}.contact li:nth-child(n+3){grid-column:1/-1}.lead{font-size:1rem}.article .facts{grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.article .facts div{padding:.75rem}.article .facts b{font-size:1.35rem}.article .facts span{hyphens:auto;overflow-wrap:break-word;font-size:.75rem}.install:not([hidden]){background:var(--ink);color:#fff;border-radius:1.1rem;align-items:center;gap:.75rem;margin:0 0 2rem;padding:.85rem;display:flex}.install img{border-radius:12px;flex:none}.install div{flex:1;min-width:0}.install b{font-size:.9375rem;display:block}.install span{color:#c7c9cf;font-size:.8125rem;line-height:1.35;display:block}.install button{cursor:pointer;font:700 .8125rem var(--sans);border:0;flex:none}.install-go{background:var(--accent);color:var(--ink);border-radius:99px;padding:.5rem .85rem}.install .install-hide{color:#c7c9cf;background:0 0;padding:0 .2rem;font-size:1.25rem}section{padding-bottom:2.5rem}.section-head{border-bottom:0;margin-bottom:.75rem;padding-bottom:0}h2{font-size:1.4rem}.awards:not(.large),#blog .posts{scroll-snap-type:x mandatory;scrollbar-width:none;background:0 0;border:0;border-radius:0;gap:.75rem;margin:0 -1.25rem;padding:0 1.25rem .25rem;scroll-padding-inline:1.25rem;display:flex;overflow-x:auto}.awards:not(.large){margin-bottom:2.5rem}.awards:not(.large)::-webkit-scrollbar,#blog .posts::-webkit-scrollbar{display:none}.awards:not(.large) .award{border:1px solid var(--line);scroll-snap-align:start;border-radius:1rem;flex:0 0 8.5rem;grid-template-rows:52px 1fr}.awards:not(.large) .award-logo img{max-height:52px}#blog .featured{margin-bottom:1rem}#blog .post{scroll-snap-align:start;flex:0 0 15.5rem}#blog .post .body>p:not(.source){display:none}.blog-page .posts{background:var(--card);border:1px solid var(--line);border-radius:1rem;gap:0;overflow:hidden}.blog-page .post{border:0;border-top:1px solid var(--line);border-radius:0;flex-direction:row;align-items:center;gap:.75rem;padding:.75rem}.blog-page .post:first-child{border-top:0}.blog-page .post .thumb{aspect-ratio:4/3;border-radius:.6rem;flex:0 0 5.5rem;overflow:hidden}.blog-page .post .thumb.empty>span:first-child{font-size:.75rem}.blog-page .post .play{display:none}.blog-page .post .body{padding:0}.blog-page .post h3{margin:.15rem 0 0;font-size:1rem}.blog-page .post .body>p:not(.source){display:none}}
