.nmca-id-card{ position:relative; max-width:720px; margin:16px auto; padding:22px 24px; color:#fff; font-family: 'Quantico', ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, 'Noto Sans', 'Liberation Sans', sans-serif; box-shadow: 0 26px 48px rgba(0,0,0,.48), 0 0 36px rgba(255,32,96,.18); border:1px solid rgba(255,32,96,.68); overflow:hidden; background: linear-gradient(150deg, rgba(82,0,20,0.95) 0%, rgba(24,0,12,0.94) 40%, rgba(8,10,16,0.98) 100%); clip-path: polygon(20px 0, calc(100% - 20px) 0, 100% 18px, 100% 100%, 0 100%, 0 18px); border-radius:18px; transition: transform .25s ease, box-shadow .25s ease; }
.nmca-id-card.has-rounded{ border-radius:16px }
.nmca-id-card.has-chamfer{ -webkit-clip-path: polygon(16px 0, calc(100% - 16px) 0, 100% 16px, 100% calc(100% - 16px), calc(100% - 16px) 100%, 16px 100%, 0 calc(100% - 16px), 0 16px); clip-path: polygon(16px 0, calc(100% - 16px) 0, 100% 16px, 100% calc(100% - 16px), calc(100% - 16px) 100%, 16px 100%, 0 calc(100% - 16px), 0 16px); }
.nmca-id-card:hover{ transform: translateY(-4px); box-shadow: 0 34px 54px rgba(0,0,0,.56), 0 0 48px rgba(255,40,108,.28); }
/* Hologrid background */
.nmca-id-card.has-hologrid::before{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.18; background-image:
  repeating-linear-gradient( to right, rgba(255,60,80,.2) 0, rgba(255,60,80,.2) 1px, transparent 1px, transparent 20px ),
  repeating-linear-gradient( to bottom, rgba(255,60,80,.16) 0, rgba(255,60,80,.16) 1px, transparent 1px, transparent 20px );
  background-size: 100% 100%; filter: drop-shadow(0 0 6px rgba(255,60,80,.25)); animation: nmcaGridShift 28s linear infinite;}
@keyframes nmcaGridShift { 0% { background-position: 0 0, 0 0; } 50% { background-position: 20px 10px, 10px 20px; } 100% { background-position: 40px 20px, 20px 40px; } }
/* High-tech glowing edge lines */
.nmca-id-card::after{ content:""; position:absolute; inset:0; pointer-events:none; border:1px solid rgba(255,80,90,.45); box-shadow: 0 0 16px rgba(255,70,80,.25), inset 0 0 24px rgba(255,0,60,.12); border-radius:12px; opacity:.55; mix-blend-mode: screen; }
.nmca-layer.gloss{ content:""; position:absolute; inset:0; background: linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.0) 28%, rgba(255,255,255,0.06) 100%); mix-blend-mode: screen; pointer-events:none }
.nmca-layer.border{ content:""; position:absolute; inset:-2px; border-radius:18px; background:
  radial-gradient(600px 120px at -5% -10%, rgba(255,0,70,.18), transparent 60%),
  radial-gradient(600px 120px at 105% 110%, rgba(255,0,70,.18), transparent 60%),
  linear-gradient(90deg, rgba(255,60,80,.25), rgba(255,0,60,.12), rgba(255,60,80,.25));
  filter: blur(12px); opacity:.35; z-index:-1 }
/* Optional cityscape layer; uses inline CSS variable --nmca-city */
.nmca-layer.city{ position:absolute; inset:0; background: var(--nmca-city, none) center/cover no-repeat; opacity:.25; filter: saturate(120%) contrast(1.05); pointer-events:none }
/* Tech corner accents */
.nmca-id-card .corner{ position:absolute; width:20px; height:20px; border:2px solid rgba(255,90,100,.6); box-shadow: 0 0 10px rgba(255,80,90,.35); display:none }
.nmca-id-card.has-chamfer .corner{ display:block }
.nmca-id-card .corner.tl{ top:2px; left:2px; border-right:none; border-bottom:none }
.nmca-id-card .corner.tr{ top:2px; right:2px; border-left:none; border-bottom:none }
.nmca-id-card .corner.bl{ bottom:2px; left:2px; border-right:none; border-top:none }
.nmca-id-card .corner.br{ bottom:2px; right:2px; border-left:none; border-top:none }
.nmca-header{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:10px }
.nmca-title{ font-weight:800; letter-spacing:.08em; color:#fff; opacity:.9 }
.nmca-issuer{ display:flex; align-items:center; gap:8px; font-weight:700; letter-spacing:.04em; color:#ffd6d6; opacity:.9; text-align:right }
.nmca-issuer .issuer-logo{ height:18px; width:auto; display:block; filter: drop-shadow(0 0 6px rgba(255,80,80,.35)); border-radius:3px }
.nmca-body{ background: rgba(255,255,255,0.02); border:1px solid rgba(255,60,80,.25); border-radius:12px; padding:14px 16px; backdrop-filter: blur(6px) saturate(120%); }
.nmca-grid{ display:grid; grid-template-columns: 120px 1fr; gap:12px 16px; align-items:start }
.nmca-photo{ width:120px; height:120px; border-radius:12px; overflow:hidden; background:#0a0a0f; border:1px solid rgba(255,60,80,.35); box-shadow: inset 0 0 16px rgba(0,0,0,.5) }
.nmca-photo img{ width:100%; height:100%; object-fit:cover; display:block }
.nmca-photo .placeholder{ width:100%; height:100%; display:block; background: radial-gradient(circle at 30% 20%, #271317, #0b0d12) }
.nmca-details{ display:flex; flex-direction:column; gap:6px; }
.nmca-name{ font-size: clamp(18px, 2.6vw, 24px); font-weight: 800; letter-spacing:.04em; color:#fff; text-shadow: 0 0 10px rgba(255,90,90,.35); margin-bottom: 2px; border-bottom:1px dashed rgba(255,60,80,.18); padding-bottom:6px }
.nmca-row{ display:flex; justify-content:space-between; gap:12px; padding:8px 0; border-bottom:1px dashed rgba(255,60,80,.18) }
.nmca-row:last-child{ border-bottom:0 }
.nmca-row .lbl{ font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:#ffc8c8; opacity:.9 }
.nmca-row .val{ font-weight:600; letter-spacing:.02em; color:#fff; opacity:.95 }
.nmca-badges{ display:flex; gap:10px; flex-wrap:wrap; margin-top:14px }
.nmca-badges .badge{ display:inline-flex; align-items:center; justify-content:center; height:30px; min-width:30px; border-radius:8px; background: rgba(255,255,255,0.06); border:1px solid rgba(255,60,80,.25); padding:4px 8px }
.nmca-badges .badge.fa i{ font-size:18px; color:#ffd6d6; text-shadow:0 0 8px rgba(255,70,70,.4) }
.nmca-badges .badge.img img{ height:18px; width:auto; display:block; filter: brightness(1.1) contrast(1.1) }
@media (max-width: 520px){ .nmca-id-card{ padding:16px 14px; border-radius:14px } .nmca-body{ padding:12px } .nmca-row{ padding:6px 0 } }

/* Footer serial and barcode */
.nmca-footer{ margin-top:10px }
.nmca-serial{ display:flex; align-items:center; justify-content:space-between; gap:12px; background: rgba(255,255,255,0.03); border:1px solid rgba(255,60,80,.25); border-radius:10px; padding:8px 10px }
.nmca-serial .code{ font-weight:800; letter-spacing:.1em; color:#ffe1e1 }
.nmca-serial .barcode{ display:inline-flex; align-items:flex-end; gap:1px }
.nmca-serial .barcode .bar{ width:2px; height:18px; background: rgba(255,255,255,.85); opacity:.9 }
.nmca-serial .barcode .bar.off{ background: transparent; width:2px; height:18px }