.mascot{display:inline-block;line-height:0;vertical-align:middle}.mascot svg{display:block}.mascot .px-o{fill:var(--px-ink)}.mascot .px-c{fill:var(--px-coat)}.mascot .px-d{fill:var(--px-coat-dark)}.mascot .px-l{fill:var(--px-light)}.mascot .px-p{fill:var(--px-pink)}.mascot .px-g{fill:var(--px-lens)}.mascot .px-h{fill:var(--px-shine)}.mascot .px-w{fill:var(--px-white)}.mascot .px-u{fill:var(--px-blue)}.mascot .px-y{fill:var(--px-gold)}.mascot .f{opacity:0}.mascot .f1{opacity:1}.mascot.go .f{animation-duration:calc(var(--beat) * var(--n));animation-iteration-count:var(--rounds);animation-timing-function:steps(1,end)}.mascot[data-frames="2"].go .f1{animation-name:m2-1}.mascot[data-frames="2"].go .f2{animation-name:m2-2}.mascot[data-frames="4"].go .f1{animation-name:m4-1}.mascot[data-frames="4"].go .f2{animation-name:m4-2}.mascot[data-frames="4"].go .f3{animation-name:m4-3}.mascot[data-frames="4"].go .f4{animation-name:m4-4}@keyframes m2-1{0%{opacity:1}50%{opacity:0}to{opacity:0}}@keyframes m2-2{0%{opacity:0}50%{opacity:1}to{opacity:0}}@keyframes m4-1{0%{opacity:1}25%{opacity:0}to{opacity:0}}@keyframes m4-2{0%{opacity:0}25%{opacity:1}50%{opacity:0}to{opacity:0}}@keyframes m4-3{0%{opacity:0}50%{opacity:1}75%{opacity:0}to{opacity:0}}@keyframes m4-4{0%{opacity:0}75%{opacity:1}to{opacity:0}}@media(prefers-reduced-motion:reduce){.mascot .f{animation:none!important}}:root{--paper: #f3f3f1;--paper-deep: #e7e7e3;--surface: #ffffff;--ink: #111111;--ink-soft: #5c5c61;--line: #1111111a;--action: #0b6fd6;--action-hover: #0a5fb8;--build: #0b6fd6;--brand: #ef3b2d;--learn: #ffc81a;--on-action: #ffffff;--on-build: #ffffff;--on-brand: #111111;--on-learn: #111111;--px-ink: #111111;--px-coat: #c68f63;--px-coat-dark: #a8734a;--px-light: #f6e3c8;--px-pink: #f2a0ae;--px-lens: #1d1d20;--px-shine: #cfd8e6;--px-white: #ffffff;--px-blue: #1890ff;--px-gold: #ffc81a;--font-display: "Bricolage Grotesque Variable", system-ui, sans-serif;--font-body: "Bricolage Grotesque Variable", system-ui, sans-serif;--font-data: "Geist Mono Variable", ui-monospace, monospace;--text-hero: clamp(2.25rem, 4.6vw, 4.25rem);--text-section: clamp(2.25rem, 4.4vw, 4rem);--text-title: clamp(1.5rem, 2.4vw, 2.25rem);--text-brand: 1.5rem;--text-body-lg: 1.0625rem;--text-body: 1rem;--text-small: .8125rem;--radius-frame: 28px;--radius-card: 20px;--radius-inner: 12px;--radius-pill: 999px;--stroke: 2px;--gutter: 48px;--section: clamp(64px, 10vw, 120px);--target: 44px;--nav-height: 62px;--shell-pad: 44px;--shell: 1456px;--side: 264px;--rail: 232px;--ease-soft: cubic-bezier(.22, 1, .36, 1);--ease-big: cubic-bezier(.5, 0, .1, 1);--dur-fast: .25s;--dur-reveal: .5s}@media(max-width:1023px){:root{--shell-pad: 18px}}@media(max-width:900px){:root{--gutter: 20px}}@media(max-width:600px){:root{--radius-frame: 20px}}@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/_astro/bricolage-grotesque-vietnamese-wght-normal.BUzh504Q.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/_astro/bricolage-grotesque-latin-ext-wght-normal.CcLUaPy7.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,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:Bricolage Grotesque Variable;font-style:normal;font-display:swap;font-weight:200 800;src:url(/_astro/bricolage-grotesque-latin-wght-normal.DLoelf7F.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Geist Mono Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/_astro/geist-mono-cyrillic-ext-wght-normal.X_5orZeX.woff2) format("woff2-variations");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Geist Mono Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/_astro/geist-mono-cyrillic-wght-normal.DiZS0aHC.woff2) format("woff2-variations");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}@font-face{font-family:Geist Mono Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/_astro/geist-mono-symbols2-wght-normal.CO5SzqOn.woff2) format("woff2-variations");unicode-range:U+2000-2001,U+2004-2008,U+200A,U+23B8-23BD,U+2500-259F}@font-face{font-family:Geist Mono Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/_astro/geist-mono-vietnamese-wght-normal.DadHysG0.woff2) format("woff2-variations");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Geist Mono Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/_astro/geist-mono-latin-ext-wght-normal.Bwz-egvJ.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,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:Geist Mono Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/_astro/geist-mono-latin-wght-normal.XN7g48iV.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*{box-sizing:border-box;margin:0;padding:0}html{background:var(--paper);scroll-padding-top:24px;scrollbar-gutter:stable;scrollbar-color:var(--ink-soft) var(--paper)}@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}body{background:var(--paper);color:var(--ink);font:400 var(--text-body)/1.5 var(--font-body);overflow-x:hidden;min-height:100svh;display:flex;flex-direction:column}main{flex:1}body.grain:before{content:"";position:fixed;inset:-10%;z-index:50;pointer-events:none;opacity:.1;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain .8s steps(6) infinite}@keyframes grain{0%{transform:translate(0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-1%,-2%)}80%{transform:translate(3%,1%)}to{transform:translate(0)}}::selection{background:var(--action);color:var(--on-action)}ul{list-style:none}a{color:inherit;text-decoration:none}h1,h2,h3{font-family:var(--font-display);font-weight:700;text-wrap:balance}p{text-wrap:pretty}.mask{display:block;overflow:hidden}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.icon{display:block;flex:none}:focus-visible{outline:3px solid var(--ink);outline-offset:2px;box-shadow:0 0 0 2px var(--surface)}h1:focus-visible,main:focus-visible{outline:none;box-shadow:none}.skip{position:fixed;top:8px;left:8px;z-index:110;display:inline-flex;align-items:center;min-height:var(--target);padding:0 20px;border-radius:var(--radius-pill);background:var(--surface);border:var(--stroke) solid var(--ink);font-weight:600;transform:translateY(-200%)}.skip:focus{transform:none}.loader{display:none}html.intro{overflow:hidden}html.intro .loader{display:block;position:fixed;inset:0;z-index:100;background:var(--paper)}.loader-avatar{position:absolute;top:50%;left:50%;width:clamp(120px,16vw,200px);height:auto;translate:-50% 0;opacity:0}html.intro-mascot .loader-avatar{animation:pop .7s cubic-bezier(.34,1.56,.64,1) .35s both}.deck{position:fixed;perspective:1600px;pointer-events:none}.deck-card{position:absolute;top:50%;left:50%;width:270px;height:480px;margin:-240px 0 0 -135px;will-change:transform}.deck-card .face{pointer-events:none}@keyframes pop{0%{scale:.5;opacity:0}to{scale:1;opacity:1}}.loader-brand{position:absolute;top:60%;left:0;right:0;display:flex;justify-content:center;font:700 clamp(30px,4vw,56px)/1 var(--font-display);letter-spacing:-.03em}.loader-brand .mask{display:inline-block;padding-bottom:.16em;margin-bottom:-.16em}.loader-brand .mask>span{display:inline-block;transform:translateY(120%)}html.intro-mascot .loader-brand .mask>span{animation:letter .8s var(--ease-soft) both;animation-delay:calc(.5s + var(--i) * 28ms)}@keyframes letter{0%{transform:translateY(120%) rotate(8deg)}to{transform:none}}.loader-count{position:absolute;left:var(--gutter);bottom:28px;font:var(--text-small) var(--font-data);color:var(--ink-soft);font-variant-numeric:tabular-nums}.loader button{position:absolute;right:calc(var(--gutter) - 8px);bottom:20px;min-height:var(--target);padding:0 8px;font:500 var(--text-small) var(--font-body);color:var(--ink-soft);background:none;border:0;cursor:pointer}.loader button:hover{color:var(--ink)}html.intro .frame,html.intro .card{opacity:0}html.intro .rise{transform:translateY(105%)}html.intro .reveal,html.intro .mark span,html.intro .top nav{opacity:0}html.intro #avatar{visibility:hidden}.cut{display:none;position:fixed;inset:0;z-index:200;overflow:hidden}.cut.on,html.cut-in .cut{display:block}html.cut-in{overflow:hidden}.cut-layer{position:absolute;inset:0;clip-path:polygon(0% 0%,122% 0%,122% 100%,-22% 100%)}.cut-edge{background:var(--px-ink)}.cut-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;background:var(--cut-bg, var(--action));color:var(--cut-fg, var(--on-action));text-align:center}.cut-title{max-width:min(900px,86vw);text-wrap:balance}.cut-title:before{content:var(--cut-title, "");font:700 clamp(2rem,5vw,4.5rem)/1 var(--font-display);letter-spacing:-.035em}.top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px var(--gutter) 0}.mark{display:flex;align-items:center;gap:10px;font:700 var(--text-brand)/1 var(--font-display);letter-spacing:-.03em}.mark img{width:40px;height:40px;display:block}.top nav{display:flex;font:600 var(--text-body-lg)/1 var(--font-display)}.top nav i{font-style:normal;color:var(--ink-soft);margin:0 .4em;align-self:center}.top nav a{display:inline-block;padding:8px 0;color:var(--ink-soft);background:linear-gradient(var(--world),var(--world)) 0 calc(100% - 3px) / 0 3px no-repeat;transition:color var(--dur-fast),background-size var(--dur-reveal) var(--ease-soft)}.top nav a:hover,.top nav a[aria-current]{color:var(--ink);background-size:100% 3px}.stage{min-height:max(calc(100svh - 54px),620px);display:flex;flex-direction:column}.frame{position:relative;flex:1 0 340px;margin:14px 16px 0;background:var(--paper-deep);overflow:hidden;clip-path:inset(0 round var(--radius-frame));isolation:isolate}.sky{position:absolute;inset:-4%;background:url(/scene/sky.jpg) 50% 60% / cover}.sky:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#ffe9c433,transparent 40%,#11111122)}.petals{position:absolute;inset:0;pointer-events:none;z-index:1}.petals b{position:absolute;width:12px;height:12px;border-radius:80% 0;background:#ffd9a8;opacity:0;top:calc(var(--i) * 7%);left:calc(var(--i) * -3%);animation:petal 28s linear infinite;animation-delay:calc(var(--i) * -2.8s)}@keyframes petal{0%{opacity:0;transform:translate(-6vw,-12vh) rotate(0)}8%{opacity:.85}50%{transform:translate(40vw,18vh) rotate(260deg)}92%{opacity:.85}to{opacity:0;transform:translate(95vw,46vh) rotate(540deg)}}.still.grain:before,.still .petals b{animation-play-state:paused}.motion{position:absolute;right:16px;bottom:16px;z-index:3;display:inline-flex;align-items:center;min-height:var(--target);padding:0 16px;border-radius:var(--radius-pill);border:var(--stroke) solid var(--ink);background:var(--surface);font:600 var(--text-small) var(--font-body);color:var(--ink);cursor:pointer;transition:background var(--dur-fast)}.motion:hover{background:var(--paper-deep)}.wall{position:absolute;inset:0;z-index:2;cursor:grab;user-select:none;touch-action:pan-y;perspective:1600px}.wall:active{cursor:grabbing}.ring{position:absolute;top:50%;left:50%;width:0;height:0;transform-style:preserve-3d}.card{position:absolute;width:270px;height:480px;top:-240px;left:-135px;transform-style:preserve-3d;will-change:transform;pointer-events:none}.face{position:absolute;inset:0;border-radius:var(--radius-card);overflow:hidden;box-shadow:0 18px 36px -24px #0008;backface-visibility:hidden;background:var(--ink);pointer-events:auto;cursor:pointer}.face img{width:100%;height:100%;object-fit:cover;display:block}.card:before{content:"";position:absolute;inset:-9px;border:3px solid var(--world);border-radius:var(--radius-frame);pointer-events:none;backface-visibility:hidden;clip-path:inset(0 100% 0 0 round var(--radius-frame));transition:clip-path .55s var(--ease-soft);box-shadow:0 40px 80px -30px var(--world)}.card:hover:before,.card:focus-visible:before{clip-path:inset(0 0 0 0 round var(--radius-frame))}.card:focus-visible{outline:none;box-shadow:none}.card:focus-visible .face{outline:4px solid var(--ink);outline-offset:-4px}.pill{position:absolute;left:14px;bottom:14px;font:500 var(--text-small)/1 var(--font-body);color:var(--surface);background:#000000b3;border-radius:var(--radius-pill);padding:6px 10px;transition:opacity var(--dur-fast)}.label{position:absolute;left:12px;right:12px;bottom:12px;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:var(--radius-inner);background:var(--world);color:var(--on);clip-path:inset(0 100% 0 0 round var(--radius-inner));transition:clip-path var(--dur-reveal) var(--ease-soft) 50ms}.label span{flex:1;font:700 1.25rem/1.1 var(--font-display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.card:hover .label,.card:focus-visible .label{clip-path:inset(0 0 0 0 round var(--radius-inner))}.card:hover .pill,.card:focus-visible .pill{opacity:0}.hero{flex:none;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:48px;align-items:end;padding:clamp(16px,2.6svh,28px) var(--gutter) clamp(18px,3svh,32px)}h1{font-size:var(--text-hero);line-height:1;letter-spacing:-.035em}h1 .mask{padding-bottom:.14em;margin-bottom:-.14em}h1 .rise{display:block}.hero-side p{font-size:var(--text-body);max-width:46ch}.cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.btn{display:inline-flex;align-items:center;gap:8px;min-height:var(--target);padding:0 22px;border-radius:var(--radius-pill);border:var(--stroke) solid var(--ink);font:600 .9375rem/1.2 var(--font-body);transition:background var(--dur-fast),transform var(--dur-fast) var(--ease-soft)}.btn:hover{background:var(--paper-deep);transform:translateY(-1px)}.btn.primary{background:var(--action);color:var(--on-action)}.btn.primary:hover{background:var(--action-hover)}.start{padding:var(--section) var(--gutter) 40px}.section-head{max-width:680px;margin-bottom:48px}h2{font-size:var(--text-section);line-height:1.02;letter-spacing:-.03em}.section-head p,.about p{margin-top:14px;font-size:var(--text-body-lg);max-width:60ch}.path{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:48px;padding:32px 0;border-top:1px solid var(--line);scroll-margin-top:24px}.tag{display:inline-block;font:600 var(--text-small)/1 var(--font-body);background:var(--world);color:var(--on);padding:6px 12px;border:var(--stroke) solid var(--ink);border-radius:var(--radius-pill)}h3{font-size:var(--text-title);line-height:1.08;letter-spacing:-.025em;margin:12px 0}.path li+li{border-top:1px solid var(--line)}.row{display:grid;grid-template-columns:88px minmax(0,1fr) auto;align-items:center;gap:12px;padding:14px 8px}.kind{font-size:var(--text-small);font-weight:500;color:var(--ink-soft)}.soon{font-size:var(--text-small);color:var(--ink-soft)}.row[href]{transition:background var(--dur-fast)}.row[href]:hover{background:var(--paper-deep)}.about{display:flex;align-items:center;gap:clamp(24px,5vw,64px);margin-top:40px;padding:clamp(48px,8vw,96px) var(--gutter);border-top:1px solid var(--line)}.about img{width:clamp(100px,14vw,160px);height:auto;flex:none}.about .btn{margin-top:22px}.foot-brand{display:inline-flex;align-items:center;gap:10px}footer{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:22px var(--gutter);border-top:1px solid var(--line);font-size:var(--text-small);color:var(--ink-soft)}@media(max-width:900px){.mark{font-size:1.25rem}.mark img{width:34px;height:34px}.hero{grid-template-columns:1fr;row-gap:12px;padding-top:18px;padding-bottom:24px}.path{grid-template-columns:1fr;row-gap:18px}.about{flex-direction:column;align-items:flex-start}}@media(max-width:600px){.frame{margin:10px 10px 0}body.grain:before{animation:none;opacity:.07}.mark span{display:none}}.page{max-width:680px;margin-inline:auto;padding:var(--section) var(--gutter)}.page h1{font-size:var(--text-section);line-height:1.02;letter-spacing:-.03em;margin-bottom:14px}.page p{font-size:var(--text-body-lg)}.notfound{text-align:center}.notfound .mascot{margin-bottom:20px}.notfound .cta{justify-content:center;margin-top:24px}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.motion{display:none}}
