.card-page{--paper:#faf9f6;--ink:#1f2328;--mute:#5b6168;--faint:#8a8f96;--rule:#e6e3dd;--coral:#ff3a34;--orange:#ff884a;--accent:linear-gradient(135deg, var(--coral), var(--orange));--ease:cubic-bezier(.75, 0, .25, 1);background:var(--paper);min-height:100svh;color:var(--ink);padding:calc(4rem + 1.5rem) 1rem calc(2rem + env(safe-area-inset-bottom,0px));padding-left:max(1rem, env(safe-area-inset-left,0px));padding-right:max(1rem, env(safe-area-inset-right,0px))}@media (min-width:640px){.card-page{place-items:start center;padding-top:7rem;padding-bottom:4rem;display:grid}}.card{border:1px solid var(--rule);background:#fff;border-radius:1.25rem;width:100%;max-width:30rem;margin:0 auto;position:relative;overflow:hidden;box-shadow:0 30px 60px -40px #1f232873,0 1px #1f232808}.card:before{content:"";background:var(--accent);height:4px;display:block}.card-portrait{aspect-ratio:16/9;background:#efece6;overflow:hidden}.card-portrait-img{object-fit:cover;object-position:50% 32%;width:100%;height:100%;display:block}.card-identity{align-items:center;gap:1rem;padding:1.25rem 1.5rem 0;display:flex}.card-mark{border-radius:.75rem;flex:none;width:3.5rem;height:3.5rem}.card-name{letter-spacing:-.03em;margin:0;font-size:1.625rem;font-weight:600;line-height:1.1}.card-title{color:var(--mute);margin:.35rem 0 0;font-size:.875rem;line-height:1.4}.card-intro{color:var(--ink);margin:1rem 1.5rem 0;font-size:.9375rem;line-height:1.55}.card-actions{padding:1.25rem 1.5rem 0}.card-primary{background:var(--accent);color:#fff;letter-spacing:.01em;min-height:3rem;transition:transform .25s var(--ease), box-shadow .25s var(--ease);border-radius:.875rem;justify-content:center;align-items:center;font-size:.9375rem;font-weight:600;text-decoration:none;display:flex;box-shadow:0 10px 24px -14px #ff5a3cb3}.card-primary:hover{box-shadow:0 14px 28px -14px #ff5a3ccc}.card-primary:active{transform:translateY(1px)}.card-channels{grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;margin:.75rem 0 0;padding:0;list-style:none;display:grid}.card-channel{border:1px solid var(--rule);min-height:4rem;color:var(--ink);transition:border-color .2s var(--ease), background-color .2s var(--ease);background:#fff;border-radius:.875rem;flex-direction:column;justify-content:center;align-items:center;gap:.4rem;text-decoration:none;display:flex}.card-channel:hover{border-color:var(--ink)}.card-channel-icon{color:var(--ink);display:inline-flex}.card-channel-label{font-family:var(--font-geist-mono), ui-monospace, monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);font-size:.625rem}.card-secondary{border:1px solid var(--rule);width:100%;min-height:2.75rem;color:var(--ink);font:inherit;cursor:pointer;transition:border-color .2s var(--ease);background:#fff;border-radius:.875rem;justify-content:center;align-items:center;gap:.5rem;font-size:.8125rem;font-weight:500;text-decoration:none;display:inline-flex}.card-secondary:hover{border-color:var(--ink)}.card-actions>.grid,.card-actions>:where(div){margin-top:.75rem}.card-foot{border-top:1px solid var(--rule);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-top:1.25rem;padding:1rem 1.5rem 1.5rem;display:flex}.card-portfolio{min-height:2.5rem;color:var(--ink);align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;text-decoration:none;display:inline-flex}.card-portfolio:hover{text-underline-offset:.3em;text-decoration:underline;-webkit-text-decoration-color:var(--rule);text-decoration-color:var(--rule)}.card-names{font-family:var(--font-geist-mono), ui-monospace, monospace;letter-spacing:.3em;text-transform:uppercase;color:var(--faint);margin:0;font-size:.625rem}.card-dialog{border:1px solid var(--rule);width:min(100vw - 40px,420px);max-height:calc(100dvh - 40px);color:var(--ink);overscroll-behavior:contain;background:#fff;border-radius:1.25rem;margin:auto;padding:0;position:fixed;inset:0;overflow:auto;box-shadow:0 40px 80px -40px #1f232880}.card-dialog:not([open]){display:none}.card-dialog::backdrop{-webkit-backdrop-filter:blur(6px);background:#1f232873}.card-dialog[open]{animation:card-dialog-in .2s var(--ease) both}@keyframes card-dialog-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.card-dialog-body{text-align:center;flex-direction:column;align-items:center;gap:.5rem;padding:1.5rem 1.25rem 1.25rem;display:flex;position:relative}.card-dialog-close{width:2.5rem;height:2.5rem;color:var(--mute);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:999px;justify-content:center;align-items:center;font-size:1.5rem;line-height:1;display:inline-flex;position:absolute;top:.5rem;right:.5rem}.card-dialog-close:hover{background:var(--paper);color:var(--ink)}.card-dialog-mark{border-radius:.625rem;width:3rem;height:3rem}.card-dialog-name{letter-spacing:-.02em;margin:.25rem 0 0;font-size:1.25rem;font-weight:600;line-height:1.1}.card-dialog-titles{color:var(--mute);flex-direction:column;margin:0;font-size:.8125rem;line-height:1.4;display:flex}.card-dialog-heading{font-family:var(--font-geist-mono), ui-monospace, monospace;letter-spacing:.24em;text-transform:uppercase;color:var(--ink);margin:.75rem 0 0;font-size:.6875rem}.card-qr{aspect-ratio:1;background:#fff;width:min(100vw - 120px,232px);margin-top:.25rem}.card-qr svg{width:100%;height:100%;display:block}.card-dialog-url{font-family:var(--font-geist-mono), ui-monospace, monospace;letter-spacing:.14em;color:var(--mute);margin:0;font-size:.6875rem}.card-dialog-actions{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;width:100%;margin-top:.5rem;display:grid}.card-dialog-note{min-height:1rem;font-family:var(--font-geist-mono), ui-monospace, monospace;letter-spacing:.12em;color:var(--mute);margin:0;font-size:.6875rem}@media (max-height:560px){.card-qr{width:min(100vw - 120px,176px)}.card-dialog-body{gap:.35rem;padding:1.25rem 1rem 1rem}}.card a:focus-visible,.card button:focus-visible,.card-dialog a:focus-visible,.card-dialog button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}@media (prefers-reduced-motion:reduce){.card-primary,.card-channel,.card-secondary{transition:none}.card-dialog[open]{animation:none}}
