@font-face{font-family:Outfit;src:url(/Outfit.ttf) format("truetype");font-weight:100 900;font-display:swap}@font-face{font-family:Roboto;src:url(/fonts/Roboto-Regular.ttf) format("truetype");font-weight:400;font-display:swap}@font-face{font-family:Roboto;src:url(/fonts/Roboto-Semibold.ttf) format("truetype");font-weight:600;font-display:swap}@font-face{font-family:Roboto Mono;src:url(/fonts/RobotoMono.ttf) format("truetype");font-weight:100 700;font-display:swap}:root{--pink: #e91e63;--pink-deep: #c2185b;--pink-light: #f06695;--violet: #8b5cf6;--lilac: #b79cf9;--sky: #38bdf8;--orange: #f2a65a;--ground: #0d0b16;--surface: #15151d;--surface-raised: #1c1b27;--line: rgba(255, 255, 255, .09);--ink: #fff;--ink-soft: rgba(255, 255, 255, .74);--ink-faint: rgba(255, 255, 255, .5);--display: "Outfit", system-ui, sans-serif;--body: "Roboto", system-ui, sans-serif;--mono: "Roboto Mono", ui-monospace, monospace;--ease: cubic-bezier(.215, .61, .355, 1);--spring: cubic-bezier(.34, 1.56, .64, 1);--gutter: clamp(16px, 3.2vw, 44px);--topbar: 76px;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html{background:var(--ground);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{margin:0;overflow-x:clip}img,svg{display:block}a{color:inherit}button{font:inherit;color:inherit}:focus-visible{outline:2px solid var(--pink-light);outline-offset:3px}.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}.skip-link{position:fixed;z-index:100;top:12px;left:12px;padding:10px 16px;border-radius:999px;background:var(--pink);color:#fff;font:600 14px var(--body);text-decoration:none;transform:translateY(-160%);transition:transform .3s var(--spring)}.skip-link:focus{transform:none}.accent{color:var(--pink)}.stage{position:fixed;inset:0;z-index:0;opacity:0}.stage canvas{display:block;width:100%;height:100%;cursor:grab}.stage canvas:active{cursor:grabbing}.no-stage .stage{display:none}.topbar{position:fixed;z-index:20;inset:0 0 auto;height:var(--topbar);display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:0 var(--gutter);pointer-events:none}.topbar>*{pointer-events:auto}.topbar:before{content:"";position:absolute;z-index:-1;inset:0 0 -24px;background:linear-gradient(to bottom,#0d0b16e6,#0d0b1600);opacity:var(--backing, 0)}.brand{justify-self:start;transition:transform .4s var(--spring)}.brand:hover{transform:rotate(-4deg) scale(1.06)}.github{justify-self:end;display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:999px;background:var(--pink);color:#fff;font:600 15px/1 var(--display);text-decoration:none;box-shadow:0 8px 22px #e91e6359;transition:transform .4s var(--spring),box-shadow .3s var(--ease),background .3s var(--ease)}.github:hover{transform:translateY(-2px) rotate(-2deg);background:var(--pink-light);box-shadow:0 14px 30px #e91e6373}.github svg{transition:transform .5s var(--spring)}.github:hover svg{transform:rotate(-16deg) scale(1.12)}.hero{position:relative;z-index:1;height:100vh;height:100svh;min-height:600px;pointer-events:none}.hero-copy,.ring-nav,.hero-foot>*,.shelf-plain{pointer-events:auto}.hero-copy{position:absolute;top:calc(var(--topbar) + clamp(8px,3vh,36px));left:var(--gutter);max-width:min(560px,70vw)}.hero-copy h1{margin:0;font:700 clamp(46px,5.4vw,92px) / .88 var(--display);letter-spacing:-.035em;text-shadow:0 6px 30px rgba(6,4,12,.5)}.lede{max-width:29ch;margin:clamp(12px,2vh,20px) 0 0;color:var(--ink-soft);font-size:clamp(16px,1.25vw,19px);line-height:1.5;text-shadow:0 2px 16px rgba(6,4,12,.7)}.ring-nav{position:absolute;top:50%;right:var(--gutter);display:grid;gap:12px;transform:translateY(-50%)}.round-button{display:grid;place-items:center;width:54px;height:54px;padding:0;border:1px solid rgba(255,255,255,.14);border-radius:50%;background:#14121e8c;cursor:pointer;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:transform .45s var(--spring),background .25s var(--ease),border-color .25s var(--ease)}.round-button svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .45s var(--spring)}.round-button:hover{background:var(--pink);border-color:var(--pink);transform:scale(1.1)}.round-button[data-go="-1"]:hover svg{transform:translate(-2px)}.round-button[data-go="1"]:hover svg{transform:translate(2px)}.round-button:active{transform:scale(.88,.94)}.hero-foot{position:absolute;right:var(--gutter);bottom:clamp(20px,4.5vh,44px);left:var(--gutter);pointer-events:none}.tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px;padding:0;list-style:none}.tags li{padding:7px 12px 6px;border:1px solid rgba(255,255,255,.16);border-radius:999px;background:#0c0b1280;color:var(--ink-soft);font:600 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px}.actions-center{justify-content:center}.cta{--c: var(--pink);--c-deep: var(--pink-deep);--text: #fff;--text-hover: #fff;position:relative;isolation:isolate;display:inline-flex;align-items:center;gap:10px;height:54px;padding:0 28px;border-radius:999px;background:var(--c);color:var(--text);font:600 14px/1 var(--body);letter-spacing:.08em;text-decoration:none;text-transform:uppercase;white-space:nowrap;transition:transform .4s var(--spring),color .25s var(--ease)}.cta:before{content:"";position:absolute;z-index:-1;inset:0;border-radius:inherit;background:var(--c-deep);clip-path:inset(0 100% 0 0 round 999px);transition:clip-path .35s var(--ease)}.cta:after{content:"";position:absolute;z-index:-2;inset:0;border:2px solid transparent;border-right-color:var(--c);border-bottom-color:var(--c);border-radius:inherit;transform:translate(6px,6px);transition:transform .4s var(--spring)}.cta-arrow{transition:transform .4s var(--spring)}.cta:hover{color:var(--text-hover);transform:translate(2px,2px)}.cta:hover:before{clip-path:inset(0 0 0 0 round 999px)}.cta:hover:after{transform:translate(3px,3px)}.cta:hover .cta-arrow{transform:translate(3px,-3px) scale(1.1)}.cta:active{transform:translate(5px,5px) scale(.98)}.cta:active:after{transform:translate(0)}.cta-outline{--c-deep: var(--c);--text: var(--c);background:#0c0b1259;box-shadow:inset 0 0 0 2px var(--c);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.cta-outline:after{transform:translate(8px,8px)}.cta-white{--c: #fff;--text-hover: var(--pink)}.hint{position:absolute;bottom:10px;left:50%;display:flex;align-items:center;gap:8px;margin:0;color:var(--ink-faint);font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;transform:translate(-50%)}.hint-hand svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.cursor{position:fixed;z-index:30;top:0;left:0;pointer-events:none}.cursor-label{display:block;margin:20px 0 0 18px;padding:8px 12px 7px;border-radius:999px;background:#14121ec7;color:#fff;font:700 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;box-shadow:3px 3px #ffffff2e;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transform:scale(0);transform-origin:0 0;transition:background .25s var(--ease),box-shadow .25s var(--ease)}.cursor[data-target=front] .cursor-label{background:var(--pink);box-shadow:3px 3px #fff}.cursor[data-target=side] .cursor-label{background:var(--violet);box-shadow:3px 3px #fff}.cursor[data-target=drag] .cursor-label{background:#fff;color:var(--pink);box-shadow:3px 3px 0 var(--pink)}.cursor[data-target=shape] .cursor-label{background:var(--sky);color:#07060b;box-shadow:3px 3px #fff}@media(hover:none){.cursor{display:none}}.shelf-plain{display:none}.no-stage .hero{height:auto;min-height:0;padding:calc(var(--topbar) + 40px) var(--gutter) 64px}.no-stage .hero-copy{position:relative;top:0;left:0}.no-stage .ring-nav,.no-stage .hero-foot,.no-stage .hint{display:none}.no-stage .shelf-plain{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:28px;margin:56px 0 0;padding:0;list-style:none}.shelf-card a{display:grid;gap:10px;padding:12px 12px 22px;border:1px solid var(--line);border-radius:26px;background:var(--surface);text-decoration:none;transition:transform .45s var(--spring),box-shadow .35s var(--ease)}.shelf-card a:hover{transform:translate(-4px,-4px);box-shadow:8px 8px 0 var(--accent)}.shelf-card img{width:100%;height:auto;border-radius:16px;aspect-ratio:16 / 9;object-fit:cover}.shelf-chip{justify-self:start;margin:8px 8px 0;padding:6px 11px 5px;border-radius:999px;background:var(--accent);font:700 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}.shelf-card strong{margin:0 8px;font:700 28px/1.05 var(--display)}.shelf-copy{margin:0 8px;color:var(--ink-soft);line-height:1.5}.about,.closing{position:relative;z-index:1}.about{padding:clamp(120px,24vh,240px) var(--gutter) clamp(140px,22vh,240px);text-align:center;pointer-events:none}.about .container>*{pointer-events:auto}.container{max-width:1180px;margin:0 auto}.eyebrow{display:inline-flex;align-items:center;gap:10px;margin:0 0 24px;padding:9px 15px 8px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:#ffffff0d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--ink-soft);font:600 12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}.eyebrow:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--pink);box-shadow:0 0 12px var(--pink)}.section-title{max-width:13ch;margin:0 auto;font:700 clamp(44px,6vw,92px) / 1 var(--display);letter-spacing:-.035em;text-shadow:0 4px 30px rgba(6,4,12,.6);text-wrap:balance}.section-title .accent{position:relative;display:inline-block;color:var(--pink)}.squiggle{position:absolute;bottom:-.24em;left:-2%;width:104%;height:.3em;overflow:visible;fill:none;stroke:var(--pink);stroke-width:5;stroke-linecap:round}.section-lede{max-width:50ch;margin:30px auto 0;color:var(--ink-soft);font-size:clamp(17px,1.4vw,20px);line-height:1.6;text-shadow:0 1px 10px rgba(6,4,12,.7);text-wrap:pretty}.shape{position:absolute;width:var(--size);height:auto;filter:drop-shadow(0 18px 22px rgba(4,2,12,.55));pointer-events:none}.shape-capsule{--size: clamp(104px, 12vw, 168px);top:-72px;left:3%}.shape-torus{--size: clamp(84px, 9vw, 132px);top:-54px;right:6%}.shape-tetra{--size: clamp(84px, 9vw, 128px);right:3%;bottom:-56px}.shape-cube{--size: clamp(72px, 8vw, 112px);bottom:-44px;left:8%}.closing{padding:clamp(160px,26vh,280px) var(--gutter) clamp(80px,14vh,160px);background:linear-gradient(to bottom,rgba(13,11,22,0),var(--ground) clamp(120px,22vh,240px))}.closing-card{position:relative;max-width:1040px;margin:0 auto;padding:clamp(56px,9vh,96px) clamp(24px,5vw,72px);border:1px solid rgba(255,255,255,.1);border-radius:44px;background:radial-gradient(90% 120% at 50% 0%,rgba(233,30,99,.24),transparent 60%),linear-gradient(180deg,#2a214680,#0e0b1acc);box-shadow:inset 0 1px #ffffff1f,0 40px 80px -30px #04020ce6;-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);text-align:center}.closing-title{margin:0;font:700 clamp(56px,9vw,136px) / .95 var(--display);letter-spacing:-.04em}.closing-title .accent{display:inline-block;text-shadow:1px 1px 0 #c2185b,2px 2px 0 #c2185b,3px 3px 0 #b0164f,4px 4px 0 #b0164f,5px 5px 0 #9d1347,6px 6px 0 #9d1347,7px 7px 0 #8a103e,8px 8px 0 #8a103e,12px 16px 24px rgba(0,0,0,.45);transition:transform .5s var(--spring),text-shadow .5s var(--ease)}.closing-title:hover .accent{transform:translate(-3px,-3px) rotate(-3deg)}.closing-card p{max-width:44ch;margin:26px auto 38px;color:var(--ink-soft);font-size:clamp(17px,1.4vw,20px);line-height:1.6}.footer{position:relative;z-index:1;display:grid;justify-items:center;gap:14px;padding:56px var(--gutter) 64px;border-top:1px solid var(--line);background:var(--ground);color:var(--ink-faint);font-size:14px;text-align:center}.footer p{margin:0}.footer a{color:#fff}.socials{display:flex;gap:10px}.socials a{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--surface);transition:transform .4s var(--spring),background .25s var(--ease)}.socials a:hover{background:var(--pink);transform:translateY(-3px) rotate(-8deg)}.credit{font-size:12px}.curtain{position:fixed;z-index:50;inset:0;background:var(--ground);opacity:0;visibility:hidden;pointer-events:none}.intro-pending :is(.hero-copy h1,.lede,.ring-nav,.details,.hint){visibility:hidden}@media(max-width:860px){.ring-nav{top:auto;bottom:calc(clamp(20px,4.5vh,44px) + 6px);grid-auto-flow:column;gap:8px;transform:none}.round-button{width:42px;height:42px}.hint{display:none}}@media(max-width:520px){:root{--topbar: 64px}.github span{display:none}.github{padding:11px}.cta{height:50px;padding:0 22px;font-size:13px}.cta-outline{display:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.01ms!important;transition-delay:0s!important}}
