@font-face{font-family:"Inter Display";font-weight:400;font-display:swap;src:url(/fonts/inter-display-400.woff2) format("woff2")}
@font-face{font-family:"Inter Display";font-weight:500;font-display:swap;src:url(/fonts/inter-display-500.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-weight:500;font-display:swap;src:url(/fonts/plexmono-500.woff2) format("woff2")}
:root{--ink:#111;--mute:#6b6b6b;--line:#e6e6e6;--r:7px;--sans:"Inter Display","Inter",system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace}
*{box-sizing:border-box;margin:0;padding:0}
html{background:#fff;-webkit-text-size-adjust:100%}
body{background:#fff;color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;min-height:100vh;min-height:100dvh}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.k{max-width:460px;margin:0 auto;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding:max(22px,env(safe-area-inset-top)) 20px max(26px,env(safe-area-inset-bottom))}
.lab{font-family:var(--mono);font-weight:500;font-size:12px;line-height:16px;letter-spacing:.35px;text-transform:uppercase;color:var(--mute)}
.top{display:flex;justify-content:space-between;align-items:center;min-height:44px}
.share{border:0;background:none;padding:0 0 0 16px;height:44px;cursor:pointer;color:var(--ink)}
.share:hover{color:var(--mute)}
.name{margin-top:14px;width:100%;aspect-ratio:2048/344;overflow:hidden}
.name img{width:100%;height:100%;object-fit:fill;clip-path:inset(0 100% 0 0);animation:wipe 1.1s cubic-bezier(.6,0,.2,1) .1s forwards}
@keyframes wipe{to{clip-path:inset(0 0 0 0)}}
@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.hero{display:flex;flex-direction:column;align-items:center;margin-top:30px;opacity:0;animation:up .7s ease .5s forwards}
.pw{width:128px;height:128px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1px var(--line);background:#e8e8e8}
.pw img{width:100%;height:100%;object-fit:cover;object-position:50% 22%;transform:scale(1.1)}
.hero p{margin-top:16px;font-size:21px;line-height:28px;letter-spacing:-.21px;color:var(--mute);text-align:center}
.hero p b{font-weight:400;color:var(--ink);display:block}
.cta{position:relative;overflow:hidden;margin-top:28px;display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:64px;padding:0 20px;border-radius:var(--r);background:var(--ink);color:#fff;font-size:18px;letter-spacing:-.18px;opacity:0;animation:up .7s ease .7s forwards;transition:transform .3s cubic-bezier(.6,0,.2,1)}
.cta:hover{transform:scale(.985)}
.cta .lab{color:rgba(255,255,255,.7);white-space:nowrap}
.cta::after{content:"";position:absolute;top:0;bottom:0;width:60px;left:-80px;background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.16),rgba(255,255,255,0));transform:skewX(-18deg);animation:sheen 5s ease-in-out 2.2s infinite}
@keyframes sheen{0%,60%{left:-80px}100%{left:110%}}
.list{margin-top:8px}
.row{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:60px;padding:0 20px;border-bottom:1px solid var(--line);font-size:21px;letter-spacing:-.21px;opacity:0;animation:up .6s ease forwards}
.row .t{transition:transform .35s cubic-bezier(.6,0,.2,1);display:inline-block}
.row .lab{transition:transform .35s cubic-bezier(.6,0,.2,1);text-align:right;overflow-wrap:anywhere}
.row:hover .t,.row:hover .lab{transform:translateX(4px)}
.row:hover .lab{color:var(--ink)}
.ico{display:flex;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:auto;padding-top:36px;margin-bottom:48px;opacity:0;animation:up .7s ease 1.2s forwards}
.ib{width:48px;height:48px;border-radius:50%;border:1px solid #d9d9d9;display:flex;align-items:center;justify-content:center;color:var(--ink);transition:background .3s,color .3s,transform .3s cubic-bezier(.6,0,.2,1)}
.ib:hover{background:var(--ink);color:#fff;transform:translateY(-2px)}
.ib svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.toast{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translate(-50%,20px);background:var(--ink);color:#fff;border-radius:var(--r);padding:12px 16px;font-size:14px;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
.toast.on{opacity:1;transform:translate(-50%,0)}
a:focus-visible,button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.name img{animation:none;clip-path:none}.hero,.cta,.row,.ico{animation:none;opacity:1}.cta::after{animation:none}}
