.h2d{--m:min(1.9svh, 3.6vw);--h2d-chalk:#fbf8f1;--h2d-tree:color-mix(in oklab, var(--color-grass) 82%, var(--h2d-sky-h) 18%);--h2d-house:color-mix(in oklab, #efe6d4 calc(100% - var(--h2d-night,0) * 55%), #1b2430);--h2d-roof:color-mix(in oklab, var(--color-clay-strong) calc(100% - var(--h2d-night,0) * 50%), #10151c);--h2d-window:color-mix(in oklab, #ffd89a calc(var(--h2d-night,0) * 100%), #6d7f8f);background:var(--h2d-sky-h,#cfe2f0);contain:strict;position:absolute;inset:0;overflow:hidden}.h2d-sky{background:radial-gradient(120% 70% at var(--h2d-sun-x,70%) var(--h2d-sun-y,18%), color-mix(in oklab, var(--h2d-sun,#fff) 38%, transparent), transparent 55%), linear-gradient(to bottom, var(--h2d-sky-top,#4c88cf), var(--h2d-sky-h,#cfe2f0) 72%);position:absolute;inset:0}.h2d-sun{left:var(--h2d-sun-x,70%);top:var(--h2d-sun-y,18%);background:radial-gradient(circle, #fffdf3 0 40%, color-mix(in oklab, var(--h2d-sun,#fff) 60%, transparent) 60%, transparent 72%);width:9vmin;height:9vmin;opacity:var(--h2d-day,1);border-radius:50%;margin:-4.5vmin 0 0 -4.5vmin;position:absolute}.h2d-stars{opacity:var(--h2d-night,0);background-image:radial-gradient(1px 1px at 12% 18%,#fff 50%,#0000 51%),radial-gradient(1px 1px at 28% 8%,#fff 50%,#0000 51%),radial-gradient(1.5px 1.5px at 44% 22%,#fff 50%,#0000 51%),radial-gradient(1px 1px at 61% 12%,#fff 50%,#0000 51%),radial-gradient(1px 1px at 73% 28%,#fff 50%,#0000 51%),radial-gradient(1.5px 1.5px at 86% 9%,#fff 50%,#0000 51%),radial-gradient(1px 1px at 93% 33%,#fff 50%,#0000 51%),radial-gradient(1px 1px at 6% 36%,#fff 50%,#0000 51%),radial-gradient(1px 1px at 52% 4%,#fff 50%,#0000 51%);position:absolute;inset:0 0 35%}.h2d-viewport{perspective:calc(var(--m) * 62);perspective-origin:50% 38%;transform-style:preserve-3d;position:absolute;inset:0}.h2d-stage{width:0;height:0;transform-style:preserve-3d;transform:translate3d(0, calc(var(--h2d-shift,0) * 100svh), 0) scale(var(--h2d-scale,.78)) rotateX(calc(var(--h2d-tilt,18) * 1deg)) rotateZ(calc(var(--h2d-spin,-24) * 1deg));will-change:transform;position:absolute;top:50%;left:50%}.h2d-stage>*{transform-style:preserve-3d;position:absolute;top:0;left:0}.h2d-lawn{height:260svh;transform:translate3d(0, max(-130svh, var(--h2d-hz,-40svh)), 0);background:linear-gradient(to bottom, color-mix(in oklab, var(--color-grass) 84%, var(--h2d-sky-h,#cfe2f0)) 0, color-mix(in oklab, var(--color-grass-mid) calc(100% - var(--h2d-night,0) * 60%), #06110c) 30svh, color-mix(in oklab, var(--color-grass) calc(100% - var(--h2d-night,0) * 50%), #040a07) 120svh);will-change:transform;position:absolute;top:0;left:0;right:0}.h2d-horizon{height:9svh;transform:translate3d(0, calc(var(--h2d-hz,-40svh) - 100% + 2px), 0);opacity:var(--h2d-sky-vis,0);position:absolute;top:0;left:-5%;right:-5%}.h2d-treeline{width:100%;height:100%;display:block}.h2d-court{width:calc(var(--m) * 18.29);height:calc(var(--m) * 36.57);margin:calc(var(--m) * -18.285) 0 0 calc(var(--m) * -9.145);background:radial-gradient(60% 40% at 50% 50%, #ffd2aa1f, transparent 70%), linear-gradient(90deg, #00000014, transparent 18%, transparent 82%, #00000014), var(--color-clay);box-shadow:0 0 0 calc(var(--m) * .25) color-mix(in oklab, var(--color-grass) 80%, #000), 0 calc(var(--m) * 2) calc(var(--m) * 4) #00000040;border-radius:2px}.h2d-court:after{content:"";pointer-events:none;background:radial-gradient(70% 48% at 50% 50%, rgb(255 236 200/calc(var(--h2d-night,0) * .14)), rgb(8 4 2/calc(var(--h2d-night,0) * .32)) 85%);position:absolute;inset:0}.h2d-court-side{transform:translate3d(calc(var(--cx) * var(--m)), 0, 0);opacity:.92;background:linear-gradient(var(--h2d-chalk), var(--h2d-chalk)) 50% 17.5% / 60% 1.5px no-repeat, linear-gradient(var(--h2d-chalk), var(--h2d-chalk)) 50% 82.5% / 60% 1.5px no-repeat, linear-gradient(90deg, var(--h2d-chalk), var(--h2d-chalk)) 20% 50% / 1.5px 65% no-repeat, linear-gradient(90deg, var(--h2d-chalk), var(--h2d-chalk)) 80% 50% / 1.5px 65% no-repeat, linear-gradient(var(--h2d-chalk), var(--h2d-chalk)) 50% 50% / 60% 2px no-repeat, var(--color-clay)}.h2d-court-side[data-surface=resine]{background:linear-gradient(var(--h2d-chalk), var(--h2d-chalk)) 50% 17.5% / 60% 1.5px no-repeat, linear-gradient(var(--h2d-chalk), var(--h2d-chalk)) 50% 82.5% / 60% 1.5px no-repeat, linear-gradient(90deg, var(--h2d-chalk), var(--h2d-chalk)) 20% 50% / 1.5px 65% no-repeat, linear-gradient(90deg, var(--h2d-chalk), var(--h2d-chalk)) 80% 50% / 1.5px 65% no-repeat, linear-gradient(var(--h2d-chalk), var(--h2d-chalk)) 50% 50% / 60% 2px no-repeat, linear-gradient(#2f5f8f, #2f5f8f) 50% 50% / 60% 65% no-repeat, #2c6a52}.h2d-lines{width:100%;height:100%;position:absolute;inset:0}.h2d-mark{left:calc(50% + var(--m) * -1.25);top:calc(50% + var(--m) * -5.85);width:calc(var(--m) * .5);height:calc(var(--m) * .9);margin:calc(var(--m) * -.45) 0 0 calc(var(--m) * -.25);opacity:0;background:radial-gradient(closest-side,#4616068c,#0000);border-radius:50%;position:absolute}.h2d-net{width:calc(var(--m) * 12.8);height:calc(var(--m) * 1.07);margin:calc(var(--m) * -1.07) 0 0 calc(var(--m) * -6.4);transform-origin:50% 100%;background:repeating-linear-gradient(90deg, #0a140fbf 0 1px, transparent 1px calc(var(--m) * .18)), repeating-linear-gradient(0deg, #0a140fbf 0 1px, transparent 1px calc(var(--m) * .18));clip-path:polygon(0 0,50% 14.6%,100% 0,100% 100%,0 100%);transform:rotateX(-90deg)}.h2d-net-tape{height:calc(var(--m) * .16 + 2px);background:var(--h2d-chalk);clip-path:polygon(0 0,50% 98%,100% 0,100% 40%,50% 100%,0 40%);position:absolute;inset:0 0 auto;transform:translateY(-1px)}.h2d-screen-far{width:calc(var(--m) * 18.29);height:calc(var(--m) * 2.4);margin:calc(var(--m) * -2.4) 0 0 calc(var(--m) * -9.145);transform-origin:50% 100%;transform:translateY(calc(var(--m) * -18.285)) rotateX(-90deg);background:linear-gradient(var(--color-grass), color-mix(in oklab, var(--color-grass) 70%, #000));border-top:2px solid color-mix(in oklab, var(--color-ball) 60%, transparent)}.h2d-pole{width:calc(var(--m) * .18);height:calc(var(--m) * 10);margin:calc(var(--m) * -10) 0 0 calc(var(--m) * -.09);transform-origin:50% 100%;transform:translate3d(calc(var(--x) * var(--m)), calc(var(--z) * var(--m)), 0) rotateX(-90deg);background:linear-gradient(90deg,#1f2a25,#3a4741 50%,#1f2a25)}.h2d-lamp{width:calc(var(--m) * 7);height:calc(var(--m) * 7);margin:calc(var(--m) * -3.5) 0 0 calc(var(--m) * -3.5);opacity:var(--h2d-night,0);background:radial-gradient(circle,#fffef6 0 6%,#fff2d2bf 12%,#ffecbe38 34%,#0000 66%);border-radius:50%}.h2d-ball,.h2d-trail,.h2d-dust{will-change:transform, opacity;border-radius:50%}.h2d-ball{width:calc(var(--m) * .62);height:calc(var(--m) * .62);margin:calc(var(--m) * -.31) 0 0 calc(var(--m) * -.31);opacity:0;background:radial-gradient(circle at 34% 30%, #fbffd6 0 9%, transparent 44%), radial-gradient(circle, var(--color-ball) 0 58%, var(--color-ball-strong));box-shadow:0 0 calc(var(--m) * .9) calc(var(--m) * .15) color-mix(in oklab, var(--color-ball) 70%, transparent)}.h2d-ball svg{width:100%;height:100%;display:block}.h2d-trail{width:calc(var(--m) * .5);height:calc(var(--m) * .5);margin:calc(var(--m) * -.25) 0 0 calc(var(--m) * -.25);opacity:0;background:radial-gradient(circle, #fffff0f2, color-mix(in oklab, var(--color-ball) 70%, transparent) 45%, transparent 70%)}.h2d-dust{width:calc(var(--m) * .22 * var(--s,1));height:calc(var(--m) * .22 * var(--s,1));margin:calc(var(--m) * -.11 * var(--s,1)) 0 0 calc(var(--m) * -.11 * var(--s,1));opacity:0;background:radial-gradient(circle, color-mix(in oklab, var(--color-clay) 85%, #fff) 0 40%, transparent 72%)}.h2d-shadow{width:calc(var(--m) * .7);height:calc(var(--m) * .7);margin:calc(var(--m) * -.35) 0 0 calc(var(--m) * -.35);opacity:0;background:radial-gradient(closest-side,#1e0a0299,#0000);border-radius:50%}.h2d-floodglow{pointer-events:none;opacity:calc(var(--h2d-night,0) * .9);background:radial-gradient(40% 30% at 18% 22%,#fff0cd29,#0000 70%),radial-gradient(40% 30% at 82% 22%,#fff0cd29,#0000 70%);position:absolute;inset:0}.hero-x{background:var(--color-grass);color:#fbf8f1;position:relative}.hero-x-stage{isolation:isolate;height:100svh;position:sticky;top:0;overflow:hidden}.hero-x-scrim{pointer-events:none;background:linear-gradient(to bottom, #05100b8c, transparent 28%, transparent 58%, #05100bc7), linear-gradient(to right, rgb(5 16 11/calc(.5 * var(--hx-intro,1))), transparent 62%);position:absolute;inset:0}.hero-x-vignette{pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 18vmin #00000061}.hero-x-grain{pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>");position:absolute;inset:0}.hero-x-intro{opacity:var(--hx-intro,1);transform:translate3d(0, calc((1 - var(--hx-intro,1)) * -48px), 0);padding:0 max(16px,5vw) max(88px,13svh);position:absolute;inset:auto 0 0}@media (min-width:1024px){.hero-x-intro{max-width:52rem;padding:calc(var(--header-h) + 2rem) 0 4rem max(24px, 6vw);flex-direction:column;justify-content:center;display:flex;inset:0 auto 0 0}}.hero-x-title{font-family:var(--font-display);font-variation-settings:"opsz" 144, "SOFT" 30;letter-spacing:-.04em;font-weight:600;font-size:var(--text-display-3xl);text-shadow:0 2px 30px #00000040;line-height:.86}.hero-x-title .accent{color:var(--color-ball);font-style:italic}.hero-x-reveal{isolation:isolate;text-align:center;pointer-events:none;place-content:center;justify-items:center;gap:1.6rem;padding:0 16px;display:grid;position:absolute;inset:0}.hero-x-reveal[data-on=true]{pointer-events:auto}.hero-x-reveal>p:first-child{position:relative}.hero-x-reveal>p:first-child:before{content:"";z-index:-1;opacity:var(--l0,0);pointer-events:none;background:linear-gradient(#0000,#05100bbd 28% 72%,#0000);position:absolute;inset:-42% calc(50% - 50vw)}.hero-x-reveal-line{overflow-clip-margin:.12em;font-family:var(--font-display);letter-spacing:-.045em;font-weight:600;font-size:var(--text-display-3xl);line-height:.88;display:block;overflow:clip}.hero-x-reveal-line>span{transform:translate3d(0, calc((1 - var(--l,0)) * 135%), 0) rotate(calc((1 - var(--l,0)) * 4deg));opacity:min(1, calc(var(--l,0) * 4));display:inline-block}.hero-x-reveal-line:nth-child(2)>span{color:var(--color-ball);font-style:italic}.hero-x-reveal-sub{max-width:34rem;font-size:var(--text-lead);opacity:var(--hx-reveal-sub,0);transform:translate3d(0, calc((1 - var(--hx-reveal-sub,0)) * 16px), 0);line-height:1.5}.hero-x-hud{pointer-events:none;justify-content:space-between;align-items:center;gap:1rem;display:flex;position:absolute;inset:auto max(16px,4vw) 22px}.hero-x-rail{flex:1;gap:6px;max-width:280px;display:flex}.hero-x-rail>span{background:#fbf8f138;border-radius:2px;flex:1;height:3px;position:relative;overflow:hidden}.hero-x-rail>span:after{content:"";background:var(--color-ball);transform-origin:0;transform:scaleX(var(--f,0));position:absolute;inset:0}.hero-x-chip{-webkit-backdrop-filter:blur(8px);font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase;white-space:nowrap;background:#05100b73;border-radius:999px;align-items:center;gap:.5rem;padding:.45rem .8rem;font-size:.72rem;display:inline-flex;box-shadow:inset 0 0 0 1px #fbf8f124}.hero-x-chip i{background:var(--color-ball);width:7px;height:7px;box-shadow:0 0 10px var(--color-ball);border-radius:50%}.hero-x-hint{font-family:var(--font-mono);letter-spacing:.16em;text-transform:uppercase;opacity:calc(var(--hx-intro,1) * .85);pointer-events:none;justify-items:center;gap:.5rem;font-size:.7rem;display:grid;position:absolute;bottom:70px;left:50%;translate:-50%}.hero-x-hint i{background:var(--color-ball);width:10px;height:10px;animation:var(--animate-ball-bounce);border-radius:50%;display:block}@media (min-width:1024px){.hero-x-hint{left:auto;right:4vw;translate:none}}