*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root { --t1:#176061;--t2:#197c7e;--t3:#239193;--border:rgba(35,145,147,0.22); }
    body { background: linear-gradient(165deg, #071c1d 0%, #0b2d2e 55%, #071c1d 100%); background-attachment: fixed; min-height: 100dvh; display: flex; flex-direction: column; align-items: center; justify-content: center; font-family: 'Lato', sans-serif; -webkit-font-smoothing: antialiased; padding: 24px 16px; }
    .orb { position: fixed; border-radius: 50%; filter: blur(80px); pointer-events: none; z-index: 0; animation: orb-float 22s ease-in-out infinite; }
    .orb-1 { width: 260px; height: 260px; background: #176061; opacity: 0.13; top: -80px; right: -70px; }
    .orb-2 { width: 200px; height: 200px; background: #239193; opacity: 0.08; bottom: 15%; left: -60px; animation-delay: -11s; }
    @keyframes orb-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(22px); } }
    .card { background: rgba(10,38,40,0.95); border: 1px solid var(--border); border-radius: 24px; padding: 40px 32px 36px; text-align: center; width: 100%; max-width: 360px; position: relative; box-shadow: 0 4px 6px rgba(0,0,0,0.25), 0 16px 48px rgba(0,0,0,0.45); animation: fadeIn 0.4s ease both; backdrop-filter: blur(12px); z-index: 1; }
    .card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; border-radius: 24px 24px 0 0; background: linear-gradient(90deg, var(--t1) 0%, var(--t2) 50%, var(--t3) 100%); }
    .card-content { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; }
    .logo { max-width: 160px; height: auto; margin: 0 auto 22px; display: block; filter: brightness(0) invert(1); opacity: 0.82; }
    .sep { width: 28px; height: 1.5px; background: linear-gradient(90deg, var(--t1), var(--t3)); border-radius: 1px; margin: 0 auto 20px; }
    .card-avatar { width: 88px; height: 88px; border-radius: 50%; overflow: hidden; border: 2px solid rgba(35,145,147,0.45); margin-bottom: 16px; background: var(--t1); }
    .card-avatar img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
    .person-name { font-family: 'Inter', sans-serif; font-size: 26px; font-weight: 200; color: #ffffff; letter-spacing: -0.3px; margin-bottom: 6px; line-height: 1.2; }
    .person-title { font-family: 'Lato', sans-serif; font-size: 11px; font-weight: 300; color: #45c2c4; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 24px; }
    .qr-frame { display: inline-block; padding: 12px; background: #071c1d; border: 1px solid rgba(35,145,147,0.3); border-radius: 14px; box-shadow: 0 2px 12px rgba(0,0,0,0.4); margin-bottom: 20px; }
    #qrcode canvas, #qrcode img { display: block; border-radius: 4px; }
    .scan-text { font-family: 'Lato', sans-serif; font-size: 13px; font-weight: 300; color: rgba(255,255,255,0.5); letter-spacing: 0.2px; }
    .footer-url-row { margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(35,145,147,0.18); width: 100%; display: flex; align-items: center; justify-content: center; gap: 8px; }
    .footer-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--t3); opacity: 0.55; flex-shrink: 0; }
    .footer-url { font-family: 'Inter', sans-serif; font-size: 10px; font-weight: 300; color: rgba(255,255,255,0.35); letter-spacing: 0.5px; }
    .cta-group { width: 100%; max-width: 360px; padding: 16px 0 0; display: flex; flex-direction: column; gap: 10px; position: relative; z-index: 1; }
    .cta-btn { display: flex; align-items: center; justify-content: center; gap: 9px; padding: 15px 20px; border-radius: 12px; font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 500; letter-spacing: 0.3px; cursor: pointer; text-decoration: none; border: none; transition: filter 0.15s, transform 0.1s; -webkit-tap-highlight-color: transparent; width: 100%; }
    .cta-btn:active { transform: scale(0.98); filter: brightness(0.9); }
    .cta-btn:disabled { opacity: 0.6; cursor: default; transform: none; filter: none; }
    .cta-btn svg { width: 17px; height: 17px; flex-shrink: 0; }
    .cta-view { background: rgba(35,145,147,0.15); color: #45c2c4; border: 1px solid var(--border); backdrop-filter: blur(6px); }
    .cta-wa { background: #25d366; color: #ffffff; box-shadow: 0 2px 8px rgba(37,211,102,0.25); }
    .cta-pdf { background: linear-gradient(135deg, #176061, #239193); color: #ffffff; box-shadow: 0 2px 12px rgba(23,96,97,0.4); }
    .site-footer { width: 100%; max-width: 360px; text-align: center; padding: 20px 24px 12px; display: flex; flex-direction: column; align-items: center; gap: 5px; position: relative; z-index: 1; }
    .footer-logo { max-width: 100px; height: auto; opacity: 0.35; margin-bottom: 4px; filter: brightness(0) invert(1); }
    .footer-copy, .footer-dev { font-family: 'Lato', sans-serif; font-size: 10px; color: rgba(255,255,255,0.3); line-height: 1.4; }
    .footer-version { font-family: 'Inter', sans-serif; font-size: 9px; color: rgba(255,255,255,0.14); letter-spacing: 0.5px; margin-top: 2px; }
    @media print { body { background: white; padding: 0; justify-content: flex-start; } .card { box-shadow: none; border-radius: 0; max-width: 100%; } .cta-group, .site-footer { display: none; } }
    @keyframes fadeIn { from { opacity: 0; transform: translateY(10px) scale(0.99); } to { opacity: 1; transform: none; } }