.kp .strip{border:1px solid var(--line);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:linear-gradient(#ffffffbf,#fdf8f199);border-radius:24px;flex-wrap:wrap;gap:8px;padding:9px 9px 13px;display:flex;box-shadow:inset 0 1px #fff,0 2px 8px #3d2c180f,0 14px 30px -18px #3d2c1847}.kp .k{--k-bg:#f6efe4;--k-lip:#e2d5c2;--k-ink:#5c4329;white-space:nowrap;min-height:48px;color:var(--k-ink);cursor:var(--glove,pointer);font:700 14px/1 "Bricolage Grotesque",var(--f-body);letter-spacing:-.015em;background:radial-gradient(120% 90% at 30% 0%,#ffffffb3,#fff0 60%),var(--k-bg);box-shadow:inset 0 1px 0 #fffffff2,inset 0 -2px 3px #5c43290d,0 4px 0 var(--k-lip),0 10px 14px -9px #3d2c1857;transition:transform .11s var(--ease-out),box-shadow .11s var(--ease-out),filter .2s;border:0;border-radius:15px;flex:auto;justify-content:center;align-items:center;gap:7px;padding:0 14px;display:inline-flex;position:relative}.kp .k:after{content:"";border:1.4px dashed color-mix(in srgb,var(--k-ink) 24%,transparent);pointer-events:none;border-radius:11px;transition:border-color .2s;position:absolute;inset:4px}.kp .k:hover{filter:brightness(1.03)saturate(1.05)}.kp .k:active,.kp .k[aria-pressed=true]{box-shadow:inset 0 1px 0 #fffc,inset 0 2px 6px #5c432914,0 1px 0 var(--k-lip),0 4px 8px -6px #3d2c184d;transform:translateY(3px)}.kp .k[aria-pressed=true]{filter:saturate(1.12)}.kp .k[aria-pressed=true]:after{border-style:solid;border-color:color-mix(in srgb,var(--k-ink) 34%,transparent)}.kp .k .doodle{filter:drop-shadow(0 1px #ffffffb3);flex:none;width:21px;height:21px;overflow:visible}.kp .k-label{position:relative;top:.5px}.kp .k kbd{font:700 8px/1 var(--f-mono);letter-spacing:.02em;color:color-mix(in srgb,var(--k-ink) 58%,transparent);box-shadow:none;pointer-events:none;background:0 0;border:0;border-radius:0;padding:0;position:absolute;top:8px;left:9px}.kp .k[data-tone=latte]{--k-bg:#ebdccb;--k-lip:#d6c0a8;--k-ink:#5c4329}.kp .k[data-tone=cream]{--k-bg:#f7f0e5;--k-lip:#e3d6c3;--k-ink:#5c4329}.kp .k[data-tone=sky]{--k-bg:#dfeaf6;--k-lip:#c3d5ea;--k-ink:#405c7c}.kp .k[data-tone=rosegold]{--k-bg:#f3dccf;--k-lip:#dfbfac;--k-ink:#5c3b2a}.kp .k[data-tone=blush]{--k-bg:#f8d6cf;--k-lip:#e8b6ac;--k-ink:#8a4a4a}.kp .k[data-tone=beige-pink]{--k-bg:#f0c7b0;--k-lip:#dba68c;--k-ink:#6b3a28}@media (prefers-reduced-motion:no-preference){.kp .k:hover .doodle,.kp .k[aria-pressed=true] .doodle{animation:.5s steps(4,jump-none) both kp-wiggle}}@keyframes kp-wiggle{0%{rotate:0deg}25%{rotate:-9deg}50%{rotate:7deg}75%{rotate:-4deg}to{rotate:0deg}}@media (min-width:861px){.kp .strip{gap:6px}.kp .k{gap:6px;padding:0 12px}}@media (min-width:861px) and (max-width:1240px){.kp .strip{gap:5px;padding:8px 8px 12px}.kp .k{gap:4px;min-height:44px;padding:0 8px;font-size:13px}.kp .k .doodle{width:18px;height:18px}.kp .k kbd{top:6px;left:7px}}@media (max-width:520px){.kp .k{padding:0 13px;font-size:13px}}
.kp{--cream-50:#fdfbf7;--cream-100:#faf5ed;--beige-300:#ecddc9;--beige-400:#e0cdb3;--taupe-600:#a88e6e;--cocoa-900:#3d2c18;--cocoa-800:#5c4329;--blush-100:#fbeee8;--rose-500:#dd8c92;--rose-600:#c9707c;--bg:var(--cream-100);--ink:var(--cocoa-900);--body:var(--cocoa-800);--muted:var(--taupe-600);--line:var(--beige-300);--accent:var(--rose-500);--accent-ink:var(--rose-600);--card:#fff;--glass:#fdfbf79e;--f-body:"Hanken Grotesk","Avenir Next",system-ui,sans-serif;--f-mono:"Space Mono",ui-monospace,"SF Mono",Menlo,monospace;--f-script:"Shantell Sans","Bricolage Grotesque",system-ui,sans-serif;--f-sf:-apple-system,BlinkMacSystemFont,"SF Pro Display","Host Grotesk","Helvetica Neue",sans-serif;--ease-out:cubic-bezier(.22,1,.36,1);--ease-spring:cubic-bezier(.34,1.56,.64,1);--shadow-sm:0 2px 8px #3d2c1812;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;background:var(--bg);color:var(--body);font:16px/1.55 var(--f-body);-webkit-font-smoothing:antialiased;padding-inline:max(16px, env(safe-area-inset-left,0px));overflow-x:clip}.kp .shell{max-width:1200px;margin:0 auto}.kp .sr{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.kp .eyebrow{font:700 11px/1.2 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.kp .hero{--ws:120px;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);align-items:center;gap:clamp(20px,4vw,56px);padding-block:clamp(112px,10vw,132px) clamp(36px,5vw,64px);display:grid}.kp .copy{min-width:0;position:relative}.kp .lets{font:600 max(13px,calc(var(--ws)*.13))/1 ui-monospace,"SF Mono","Space Mono",Menlo,monospace;letter-spacing:.02em;color:var(--accent-ink);background:var(--blush-100);margin:0 0 calc(var(--ws)*.1);border:1px solid #dd8c9259;border-radius:999px;align-items:center;gap:.35em;width:max-content;padding:.42em .8em;display:inline-flex}.kp .lets:before{content:"";background:var(--accent);border-radius:2px;flex:none;width:.42em;height:.42em}.kp .lets:after{content:"";opacity:.75;background:currentColor;border-radius:1px;width:.5em;height:1.05em;margin-left:-.15em}.kp .word,.kp .measure{font-family:var(--f-sf);letter-spacing:-.055em;text-transform:none;font-weight:700}.kp .word{font-size:var(--ws);color:var(--ink);white-space:nowrap;margin:0;padding-bottom:.04em;line-height:.95}.kp [data-word]{transform-origin:0 85%;display:inline-block}.kp .dot{color:var(--accent)}.kp .measure-box{width:0;height:0;position:absolute;overflow:hidden}.kp .measure{white-space:nowrap;font-size:200px;position:absolute;top:0;left:0}.kp .hint{letter-spacing:-.01em;color:var(--body);text-wrap:pretty;max-width:34ch;min-height:3em;margin:18px 0 0;font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Host Grotesk,Helvetica Neue,sans-serif;font-size:clamp(17px,1.45vw,20px);line-height:1.5}.kp .actions{flex-wrap:nowrap;gap:10px;max-width:100%;margin-top:22px;display:flex}.kp a:focus-visible,.kp button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.kp .btn{letter-spacing:-.01em;cursor:var(--glove,pointer);box-shadow:inset 0 1px 0 #ffffffb3,inset 0 -2px 0 #5c43290f,0 4px 0 var(--lip),0 10px 16px -8px #3d2c1852;border:0;border-radius:14px;align-items:center;gap:8px;padding:13px 18px 14px;font:600 15px/1 -apple-system,BlinkMacSystemFont,SF Pro Text,Host Grotesk,sans-serif;text-decoration:none;transition:transform 90ms ease-out,box-shadow 90ms ease-out,background-color .2s;display:inline-flex}.kp .btn:active,.kp .btn[aria-pressed=true]{box-shadow:inset 0 1px 0 #fff9,0 1px 0 var(--lip),0 4px 8px -6px #3d2c184d;transform:translateY(3px)}.kp .btn svg{flex:none;width:16px;height:16px}.kp .btn{white-space:nowrap}.kp .primary{--lip:#dba68c;color:#6b3a28;width:var(--cta-w,auto);background:#f0c7b0;flex:0 auto;justify-content:center;min-width:0}.kp .primary>span{text-overflow:ellipsis;min-width:0;overflow:hidden}.kp .ghost{flex:none}.kp .primary:hover{background:#f4d3c0}.kp .ghost{--lip:#dcd4c6;color:var(--ink);background:#f3f1ec}.kp .ghost:hover{background:#f7f5f1}.kp .ghost[aria-pressed=true]{background:#fbe6ea}.kp .chip{--lip:#dcd4c6;font:700 10px/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--body);cursor:var(--glove,pointer);box-shadow:inset 0 1px 0 #ffffffb3,0 3px 0 var(--lip),0 6px 10px -6px #3d2c184d;background:#f3f1ec;border:0;border-radius:10px;padding:8px 11px;transition:transform 90ms,box-shadow 90ms}.kp .chip:active{box-shadow:0 1px 0 var(--lip);transform:translateY(2px)}.kp .chip[aria-pressed=false]{color:var(--muted);background:#ece7df}.kp .wordrow{position:relative}.kp .wordrow .word{z-index:2;position:relative}.kp .ava{width:calc(var(--ws)*1.45);height:calc(var(--ws)*.95);z-index:1;pointer-events:none;--px:calc(var(--ws)*.03);position:absolute;bottom:0;right:0}.kp .ava-glow{height:calc(var(--ws)*1.75);z-index:0;background:radial-gradient(closest-side,#efc9bc9e,#fbeee859 55%,#0000);position:absolute;bottom:-6%;left:-18%;right:-18%}.kp .ava img{left:50%;bottom:calc(var(--ws)*-.03);height:calc(var(--ws)*1.78);z-index:1;width:auto;max-width:none;filter:drop-shadow(0 calc(var(--ws)*.04) calc(var(--ws)*.07) #70503029);position:absolute;translate:-50%;-webkit-mask-image:linear-gradient(#000 70%,#0000 98%);mask-image:linear-gradient(#000 70%,#0000 98%)}.kp .px{z-index:2;line-height:0;display:block;position:absolute}.kp .px svg{width:calc(var(--px)*var(--w));height:calc(var(--px)*var(--h));shape-rendering:crispedges;display:block;overflow:visible}.kp .px.s1{top:-78%;left:2%}.kp .px.s2{top:-86%;right:-4%}.kp .px.s3{top:-22%;right:-10%}.kp .pad{grid-template-columns:minmax(0,1fr);gap:12px;min-width:0;display:grid}.kp .stage{aspect-ratio:1.32;width:100%;max-width:100%;position:relative}.kp .stage canvas{touch-action:pan-y;z-index:1;opacity:0;width:100%;height:100%;transition:opacity 1s var(--ease-out);display:block;position:absolute;inset:0}.kp .stage.ready canvas{opacity:1}.kp .collage{filter:drop-shadow(0 12px 22px #3d2c1821);pointer-events:none;position:absolute;inset:6% 3% 3% 2%;transform:rotate(-1.6deg)}.kp .paper-edge,.kp .paper{position:absolute;inset:0}.kp .paper-edge{background:#fff}.kp .paper{background-color:#fbf6ee;background-image:linear-gradient(#a88e6e24 1px,#0000 1px),linear-gradient(90deg,#a88e6e24 1px,#0000 1px);background-position:-1px -1px;background-size:22px 22px}.kp .tape{clip-path:polygon(0 8%,6% 0,12% 10%,18% 2%,100% 0,96% 22%,100% 40%,95% 60%,100% 80%,96% 100%,0 100%,4% 80%,0 60%,5% 42%,0 24%);background:#efc9bcc7;width:17%;height:8%;position:absolute}.kp .tape-a{top:2%;left:-4%;transform:rotate(-30deg)}.kp .tape-b{background:#e0cdb3d9;bottom:4%;right:-3%;transform:rotate(-24deg)}.kp .overlay{z-index:2;pointer-events:none;position:absolute;inset:0}.kp .scribble{font:600 clamp(14px,1.6vw,21px)/1.05 var(--f-script);color:var(--accent-ink);margin:0;position:absolute;top:-1%;left:1%;transform:rotate(-8deg)}.kp .scribble-arrow{width:8%;height:auto;position:absolute;top:12%;left:2.5%;overflow:visible;transform:rotate(18deg)}.kp .stage .note{text-align:center;font:12px/1.4 var(--f-mono);color:var(--muted);margin:0;position:absolute;bottom:44%;left:0;right:0}.kp .stage:not(.no-gl) .note{display:none}.kp .strip-cap{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding-inline:4px;display:flex}.kp .strip-cap .tip{font:13px/1.3 var(--f-body);color:var(--accent-ink);align-items:center;gap:12px;display:flex}@media (max-width:860px){.kp .hero{grid-template-columns:minmax(0,1fr)}.kp .ava{width:calc(var(--ws)*1.2);height:calc(var(--ws)*.9)}.kp .ava img{height:calc(var(--ws)*1.4)}.kp .px.s1{top:-52%;left:0}.kp .px.s2{top:-58%;right:-2%}.kp .px.s3{top:-6%;right:-6%}}@media (max-width:520px){.kp .actions{gap:8px}.kp .btn{gap:6px;padding:12px 13px 13px;font-size:13px}.kp .btn svg{width:14px;height:14px}}@media (prefers-reduced-motion:no-preference){.kp .lets:after{animation:1.1s step-end infinite kp-caret}.kp .copy>.lets,.kp .copy>.wordrow,.kp .copy>.hint,.kp .copy>.actions{animation:kp-in-up .8s var(--ease-out) both}.kp .copy>.wordrow{animation-delay:70ms}.kp .copy>.hint{animation-delay:.16s}.kp .copy>.actions{animation-delay:.24s}.kp .collage{animation:kp-in-paper 1s var(--ease-out) .1s both}.kp .scribble,.kp .scribble-arrow{animation:kp-in-fade .7s var(--ease-out) 1.4s both}.kp .folder{animation:kp-in-fade .7s var(--ease-out) 1.5s both}.kp .f2{animation-delay:1.58s}.kp .strip-cap,.kp .strip{animation:kp-in-fade .7s var(--ease-out) .5s both}.kp .px.s1{animation:1.6s steps(2,jump-none) infinite kp-px-bob}.kp .px.s2{animation:1.2s steps(2,jump-none) .3s infinite kp-px-twinkle}.kp .px.s3{animation:1.9s steps(2,jump-none) .6s infinite kp-px-bob}.kp .px.pop svg{animation:.36s steps(3,jump-none) both kp-px-pop}.kp .ava{animation:kp-in-fade .8s var(--ease-out) .3s both}}@keyframes kp-caret{50%{opacity:0}}@keyframes kp-in-up{0%{opacity:0;translate:0 10px}to{opacity:1;translate:0}}@keyframes kp-in-fade{0%{opacity:0;translate:0 6px}to{opacity:1;translate:0}}@keyframes kp-in-paper{0%{opacity:0;translate:0 8px;scale:.985}to{opacity:1;translate:0;scale:1}}@keyframes kp-px-bob{0%,to{translate:0}50%{translate:0 calc(var(--px)*-2)}}@keyframes kp-px-twinkle{0%,to{opacity:1;scale:1}50%{opacity:.75;scale:.7}}@keyframes kp-px-pop{0%{scale:.2}to{scale:1}}
.kp .folder{width:clamp(30px,6.4%,40px);color:var(--ink);pointer-events:auto;cursor:var(--glove,pointer);font:500 clamp(9px,.8vw,11px)/1.2 var(--f-body);text-decoration:none;display:block;position:absolute;container-type:inline-size}.kp .fd-label{white-space:nowrap;background:#fdfbf7d9;border-radius:4px;margin-top:3px;padding:1px 4px;position:absolute;top:100%;left:50%;transform:translate(-50%)}.kp .fd{aspect-ratio:20/16;perspective:800px;filter:drop-shadow(0 2px 4px #506e961f);width:100%;display:block;position:relative}.kp .fd-back,.kp .fd-cover{position:absolute;inset:0}.kp .fd-back svg,.kp .fd-cover svg{width:100%;height:100%;display:block}.kp .fd-back svg{fill:#bfd6ee}.kp .fd-cover svg{fill:#dae8f6}.kp .fd-paper{background:#fff;border-radius:8px;height:75%;position:absolute;bottom:2.5%;left:2.5%;right:2.5%}.kp .fd-cover{transform-origin:50% 100%;transform-style:preserve-3d;transition:transform .4s cubic-bezier(.16,1,.3,1)}.kp .fd-cover .fd-deco{color:#5a7da580;width:44%;height:auto;position:absolute;top:60%;left:50%;transform:translate(-50%,-50%)}.kp .folder:hover .fd-cover,.kp .folder:focus-visible .fd-cover{transform:rotateX(-30deg)}.kp .fd-items{width:0;height:0;position:absolute;top:50%;left:50%}.kp .fd-items.top{z-index:3}.kp .fd-card,.kp .fd-chip{background:var(--blush-100);color:var(--accent-ink);place-items:center;display:grid;position:absolute;top:0;left:0;overflow:hidden}.kp .fd-card img,.kp .fd-chip img{object-fit:contain;width:100%;height:100%;padding:8%}.kp .fd-card svg,.kp .fd-chip svg{width:44%;height:44%}.kp .v-ravi .fd-cover{transition-delay:.3s}.kp .v-ravi:hover .fd-cover,.kp .v-ravi:focus-visible .fd-cover{transition-delay:0s}.kp .fd-card{opacity:0;border-radius:5px;width:78cqw;height:68cqw;margin:-34cqw 0 0 -39cqw;transition:opacity .3s ease-in-out,transform .3s ease-in-out;transform:translate(0)rotate(0)scale(.5);box-shadow:0 8px 16px #3d2c1833}.kp .v-ravi:hover .fd-card,.kp .v-ravi:focus-visible .fd-card{opacity:1;transform:translate(var(--x),-73cqw) rotate(var(--r)) scale(1);transition:opacity .4s cubic-bezier(.1,1,.3,1),transform .4s cubic-bezier(.1,1,.3,1)}.kp .fd-ring{opacity:0;pointer-events:none;background:#fff;border-radius:50%;width:58cqw;height:58cqw;margin:-29cqw 0 0 -29cqw;position:absolute;top:50%;left:50%}.kp .v-ravi.left .fd-ring{animation:.8s cubic-bezier(.1,1,.3,1) .35s kp-fd-ring}@keyframes kp-fd-ring{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(5)}}.kp .fd-chip{opacity:0;border:2px solid #ffffffeb;border-radius:50%;width:50cqw;height:50cqw;margin:-25cqw 0 0 -25cqw;transition:opacity .25s,transform .35s ease-in;transform:translate(0)scale(0);box-shadow:0 4px 10px #3d2c1833}.kp .v-rudras:hover .fd-chip,.kp .v-rudras:focus-visible .fd-chip{opacity:1;transform:translate(var(--x),var(--y)) scale(1);transition:opacity .25s var(--d),transform .8s cubic-bezier(.34,1.56,.64,1) var(--d)}@media (prefers-reduced-motion:reduce){.kp .fd-cover,.kp .fd-card,.kp .fd-chip{transition-duration:10ms!important}.kp .fd-ring{display:none}}.kp .f1{bottom:8.5%;left:4%}.kp .f2{bottom:6%;left:calc(4% + 62px)}
