:root{--teal:#3ca199;--magenta:#964890;--ink:#1a1a1c;--paper:#fefefe;--muted:#626364}
*{box-sizing:border-box}html,body{height:100%}
body{margin:0;min-height:100svh;overflow:hidden;display:grid;place-items:center;padding:16px;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:#162b2b}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 12% 18%,rgb(60 161 153/.95) 0 3px,transparent 4px) 0 0/24px 24px,linear-gradient(125deg,#183a39 0 44%,#3ca199 44% 57%,#7d3b79 57% 70%,#1a1a1c 70%);opacity:.94}
body::after{content:"";position:fixed;inset:-20%;pointer-events:none;background:radial-gradient(circle at 25% 40%,rgb(255 255 255/.18),transparent 24%),radial-gradient(circle at 78% 72%,rgb(255 255 255/.12),transparent 20%);transform:rotate(-8deg)}
.card{position:relative;z-index:1;width:min(100%,480px);max-height:calc(100svh - 32px);padding:20px 22px 14px;overflow:hidden;text-align:center;background:rgb(254 254 254/.95);border:1px solid rgb(255 255 255/.8);border-radius:28px;box-shadow:0 26px 80px rgb(0 0 0/.32);backdrop-filter:blur(12px);animation:card-in 420ms cubic-bezier(.2,.8,.2,1) both}
.eyebrow{margin:0 0 5px;color:var(--teal);font-size:11px;font-weight:850;letter-spacing:.16em;text-transform:uppercase}
h1{margin:0;font-size:clamp(27px,7vw,34px);line-height:1.04;letter-spacing:-.045em}.role{margin:7px 0 16px;color:#515254;font-size:13px}.qr{display:block;width:218px;height:auto;aspect-ratio:1/1;object-fit:contain;margin:0 auto 20px;padding:12px;border:1px solid rgb(26 26 28/.12);border-radius:22px;background:#fff;box-shadow:0 5px 0 rgb(26 26 28/.08)}
.links{display:grid;gap:7px}.link{position:relative;min-height:45px;display:flex;align-items:center;padding:9px 44px 9px 13px;border:1px solid rgb(26 26 28/.12);border-radius:13px;color:var(--ink);background:#fff;box-shadow:0 3px 0 rgb(26 26 28/.09);font-size:13px;font-weight:760;text-align:left;text-decoration:none;transition:transform 120ms ease,box-shadow 120ms ease,border-color 120ms ease;animation:link-in 280ms ease-out both}.link:nth-child(1){animation-delay:90ms}.link:nth-child(2){animation-delay:120ms}.link:nth-child(3){animation-delay:150ms}.link:nth-child(4){animation-delay:180ms}.link:nth-child(5){animation-delay:210ms}.link:nth-child(6){animation-delay:240ms}.link:nth-child(7){animation-delay:270ms}.link:hover{transform:translateY(-2px);border-color:var(--teal);box-shadow:0 6px 0 rgb(60 161 153/.15)}.link:active{transform:translateY(1px);box-shadow:none}.link:focus-visible{outline:3px solid rgb(60 161 153/.35);outline-offset:2px}.link--primary{color:#fff;background:var(--teal);border-color:var(--teal);box-shadow:0 4px 0 #286f6a}.link--primary:hover{border-color:#286f6a;box-shadow:0 6px 0 #286f6a}.icon{width:25px;height:25px;display:grid;place-items:center;flex:0 0 25px;margin-right:10px;border-radius:8px;color:var(--teal);background:rgb(60 161 153/.1)}.link--primary .icon{color:#fff;background:rgb(255 255 255/.18)}.icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.arrow{position:absolute;right:15px;color:#98999a;font-size:17px}.link--primary .arrow{color:#fff}.footer{display:flex;flex-direction:column;align-items:center;margin-top:12px;color:#626364;font-size:11px;line-height:1}.brand-mark{display:block;margin-top:6px;font-size:18px;line-height:1}
@media(max-width:600px){body{padding:12px}.card{width:min(100%,480px);height:auto;max-height:calc(100svh - 24px);display:block;padding:17px 17px 12px;border:1px solid rgb(255 255 255/.8);border-radius:24px;background:rgb(254 254 254/.95);box-shadow:0 20px 60px rgb(0 0 0/.32);backdrop-filter:blur(12px)}.qr{display:block;width:250px;height:auto;margin-bottom:18px;padding:10px;border-radius:20px}.role{margin:6px 0 18px}.links{gap:8px}.link{min-height:44px}.footer{margin-top:18px;padding-top:10px;border-top:1px solid rgb(26 26 28/.08)}.brand-mark{margin-top:6px}}
@media(max-height:700px){body{padding:8px}.card{padding:9px 14px 7px;max-height:calc(100svh - 16px)}.eyebrow{margin-bottom:2px}h1{font-size:24px}.role{margin:3px 0 5px}.qr{width:96px;height:auto;margin-bottom:6px;padding:4px}.links{gap:4px}.link{min-height:39px;padding-block:5px}.footer{margin-top:4px}.brand-mark{margin-top:3px}}
@keyframes card-in{from{opacity:0;transform:translateY(8px) scale(.992)}to{opacity:1;transform:none}}
@keyframes link-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
