/* Membership card, front and back (private/association/app/card-design.php). Sized in container units so it is
   the same card at every width; printed at the real size, 85.6 x 54 mm, one face per page. */
@font-face{font-family:Manrope;src:url('/assets/manrope-regular.ttf') format('truetype');font-weight:400 600;font-display:swap}
@font-face{font-family:Manrope;src:url('/assets/manrope-semibold.ttf') format('truetype');font-weight:650 900;font-display:swap}
@font-face{font-family:Editorial;src:url('/assets/editorial-regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:RHZak;src:url('/assets/fonts/rh-zak/rh-zak.ttf') format('truetype');font-display:swap}

.cd-stage{display:grid;gap:22px;justify-items:center}
.cd{--bg1:#1f5a48;--bg2:#062a21;--ink:#f4ecd5;--muted:rgba(244,236,213,.66);--gold:#dcc07f;--line:rgba(220,192,127,.32);
  container-type:inline-size;position:relative;width:100%;max-width:640px;aspect-ratio:85.6/54;border-radius:4.4%/7%;overflow:hidden;isolation:isolate;
  color:var(--ink);font-family:Manrope,Arial,sans-serif;background:radial-gradient(ellipse 80% 90% at 100% 0,color-mix(in srgb,var(--gold) 18%,transparent),transparent 60%),linear-gradient(140deg,var(--bg1),var(--bg2));
  box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 30px 60px -20px rgba(4,28,22,.55),0 10px 24px -12px rgba(0,0,0,.35);-webkit-print-color-adjust:exact;print-color-adjust:exact}
.cd::after{content:"";position:absolute;inset:2.4%/3.8%;inset:2.4cqw;border:1px solid var(--line);border-radius:3.2cqw;pointer-events:none;z-index:3}
.cd-t-emerald{--bg1:#1f5a48;--bg2:#062a21;--ink:#f4ecd5;--muted:rgba(244,236,213,.66);--gold:#dcc07f;--line:rgba(220,192,127,.34)}
.cd-t-administrator{--bg1:#24406a;--bg2:#0a1630;--ink:#f6e7bd;--muted:rgba(246,231,189,.68);--gold:#e5c67d;--line:rgba(229,198,125,.36)}
.cd-t-navy{--bg1:#22446f;--bg2:#0c1e3a;--ink:#e8eef6;--muted:rgba(232,238,246,.68);--gold:#bccbe0;--line:rgba(188,203,224,.34)}
.cd-t-burgundy{--bg1:#6e2846;--bg2:#2d0d1c;--ink:#f8e2d5;--muted:rgba(248,226,213,.68);--gold:#e6b9a2;--line:rgba(230,185,162,.36)}
.cd-t-silver{--bg1:#f1f4f5;--bg2:#9cafb5;--ink:#163a3f;--muted:rgba(22,58,63,.66);--gold:#5d7378;--line:rgba(22,58,63,.28)}
.cd-t-vip{--bg1:#2d3034;--bg2:#050607;--ink:#f3dda2;--muted:rgba(243,221,162,.66);--gold:#e4c47e;--line:rgba(228,196,126,.38)}

.cd-guilloche{position:absolute;inset:0;z-index:0;opacity:.75;pointer-events:none;
  background:repeating-radial-gradient(ellipse 140% 120% at 108% -12%,transparent 0 .9cqw,color-mix(in srgb,var(--gold) 16%,transparent) .9cqw calc(.9cqw + 1px)),
    repeating-radial-gradient(ellipse 120% 140% at -10% 115%,transparent 0 1.2cqw,color-mix(in srgb,var(--gold) 9%,transparent) 1.2cqw calc(1.2cqw + 1px));
  -webkit-mask-image:linear-gradient(115deg,#000 0,transparent 42%,transparent 58%,#000 100%);mask-image:linear-gradient(115deg,#000 0,transparent 42%,transparent 58%,#000 100%)}
.cd-orbit{position:absolute;inset:0;z-index:0;pointer-events:none}
.cd-orbit i{position:absolute;border:1px solid color-mix(in srgb,var(--gold) 34%,transparent);border-radius:50%}
.cd-orbit i:first-child{width:92cqw;height:52cqw;left:30cqw;top:-24cqw;transform:rotate(-14deg)}
.cd-orbit i:last-child{width:70cqw;height:36cqw;left:-26cqw;top:36cqw;transform:rotate(18deg);opacity:.6}
.cd-orbit i:first-child::after{content:"";position:absolute;width:1.3cqw;height:1.3cqw;border-radius:50%;background:var(--gold);box-shadow:0 0 1.6cqw var(--gold);left:18%;top:86%}
.cd-sheen{position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(112deg,transparent 30%,rgba(255,255,255,.09) 44%,rgba(255,255,255,.02) 52%,transparent 62%)}

.cd-head{position:absolute;z-index:2;left:6.2cqw;right:6.2cqw;top:6.4cqw;display:flex;align-items:center;gap:2.4cqw}
.cd-logo{width:10.5cqw;height:10.5cqw;border-radius:50%;object-fit:contain;filter:drop-shadow(0 .4cqw .8cqw rgba(0,0,0,.35))}
.cd-org{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.cd-org b{font-size:2.55cqw;font-weight:700;letter-spacing:.16em}
.cd-org small{font-size:1.55cqw;letter-spacing:.3em;color:var(--muted);font-weight:600}
.cd-org .cd-ar{font-family:RHZak,Arial,sans-serif;letter-spacing:0;font-size:2.15cqw;color:var(--gold);margin-top:.3cqw;text-align:start}
.cd-role{margin-inline-start:auto;align-self:flex-start;font-size:1.55cqw;font-weight:700;letter-spacing:.18em;color:var(--gold);border:1px solid var(--line);border-radius:999px;padding:.7cqw 1.8cqw;white-space:nowrap;max-width:32cqw;overflow:hidden;text-overflow:ellipsis}

.cd-body{position:absolute;z-index:2;left:6.2cqw;right:6.2cqw;top:22cqw;display:grid;grid-template-columns:minmax(0,1fr) 22cqw;gap:3cqw;align-items:start}
.cd-main{min-width:0}
.cd-chip{display:block;width:8.6cqw;height:6.4cqw;border-radius:1.2cqw;background:linear-gradient(135deg,#f3e6b4,#b89c5c 45%,#efe0a6 70%,#a8894a);box-shadow:inset 0 0 0 1px rgba(90,70,30,.45),0 .3cqw .6cqw rgba(0,0,0,.25);position:relative;margin-bottom:2.4cqw}
.cd-chip i{position:absolute;inset:22% 30%;border:1px solid rgba(90,70,30,.45);border-radius:.6cqw}
.cd-chip::before,.cd-chip::after{content:"";position:absolute;background:rgba(90,70,30,.45)}
.cd-chip::before{left:0;right:0;top:50%;height:1px}.cd-chip::after{top:0;bottom:0;left:50%;width:1px}
.cd-number{font-size:3.6cqw;font-weight:650;letter-spacing:.2em;white-space:nowrap;text-shadow:0 .15cqw 0 rgba(0,0,0,.35),0 -.08cqw 0 rgba(255,255,255,.18)}
.cd .cd-name{margin:1.2cqw 0 0;font:600 3.5cqw/1.15 Manrope,Arial,sans-serif;letter-spacing:.07em;text-shadow:0 .15cqw 0 rgba(0,0,0,.35),0 -.08cqw 0 rgba(255,255,255,.18);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cd-meta{display:flex;gap:4cqw;margin:2.4cqw 0 0}
.cd-meta div{min-width:0}
.cd-meta dt{font-size:1.35cqw;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);font-weight:700}
.cd-meta dd{margin:.5cqw 0 0;font-size:2.05cqw;font-weight:650;letter-spacing:.06em;white-space:nowrap}
.cd-photo{position:relative;margin:0;width:22cqw;aspect-ratio:3/4;border-radius:2cqw;overflow:hidden;background:color-mix(in srgb,var(--ink) 14%,transparent);box-shadow:0 0 0 .35cqw color-mix(in srgb,var(--gold) 70%,transparent),0 1.2cqw 2.4cqw rgba(0,0,0,.35)}
.cd-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;display:block}
.cd-photo span{display:grid;place-items:center;height:100%;font:9cqw Editorial,Georgia,serif;color:var(--muted)}
.cd-holo{position:absolute;right:1.4cqw;bottom:1.4cqw;width:6.4cqw;height:6.4cqw;border-radius:50%;opacity:.72;mix-blend-mode:screen;
  background:conic-gradient(from 30deg,#ffd6e8,#c8f7ff,#e6ffcf,#fff3c4,#e2d1ff,#ffd6e8);box-shadow:inset 0 0 0 1px rgba(255,255,255,.6)}
.cd-holo::after{content:"DEF";position:absolute;inset:0;display:grid;place-items:center;font:700 1.3cqw Manrope,Arial,sans-serif;letter-spacing:.12em;color:rgba(20,40,40,.55)}

.cd-foot{position:absolute;z-index:2;left:6.2cqw;right:6.2cqw;bottom:5.4cqw;display:flex;align-items:flex-end;justify-content:space-between;gap:3cqw}
.cd-sponsor{display:flex;flex-direction:column;gap:.6cqw;min-width:0}
.cd-sponsor small{font-size:1.25cqw;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-weight:700}
.cd-sponsor img{height:4.4cqw;max-width:30cqw;object-fit:contain;object-position:left center}
[dir=rtl] .cd-sponsor img{object-position:right center}
.cd-sponsor b{font-size:2.2cqw}
.cd-site{font-size:1.45cqw;letter-spacing:.2em;color:var(--muted);font-weight:700;white-space:nowrap}

.cd-stripe{position:absolute;z-index:2;left:0;right:0;top:9cqw;height:10cqw;background:linear-gradient(180deg,#0b0f10,#1d2326 55%,#0b0f10)}
.cd-t-silver .cd-stripe{background:linear-gradient(180deg,#2b3436,#4a5659 55%,#2b3436)}
.cd-back-body{position:absolute;z-index:2;left:6.2cqw;right:6.2cqw;top:23cqw;display:grid;grid-template-columns:24cqw minmax(0,1fr);gap:4cqw;align-items:center}
.cd-qr{width:24cqw;aspect-ratio:1;background:#fff;border-radius:2cqw;padding:1.4cqw;display:grid;place-items:center;box-shadow:0 1cqw 2cqw rgba(0,0,0,.3)}
.cd-qr svg{width:100%!important;height:100%!important;display:block}
.cd-back .cd-orbit i::after{display:none}
.cd-qr span{font-size:1.8cqw;color:#3b4a46;text-align:center}
.cd-back-text{display:flex;flex-direction:column;gap:1cqw;min-width:0}
.cd-back-text b{font:3cqw/1.15 Editorial,Georgia,serif;letter-spacing:.01em}
.cd-back-text small{font-family:RHZak,Arial,sans-serif;font-size:2.2cqw;color:var(--gold);text-align:start}
.cd-back-text p{margin:.4cqw 0 0;font-size:1.75cqw;line-height:1.5;color:var(--muted)}
.cd-ref{font-size:1.6cqw;letter-spacing:.22em;font-weight:700;color:var(--gold)}
.cd-back .cd-site{font-size:1.25cqw;letter-spacing:.14em}

/* Administration page around the card */
.cd-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,1fr);gap:26px;align-items:start}
.cd-show{position:sticky;top:20px}
.cd-show .a2-note{text-align:center}
.cd-swatches{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 4px}
.cd-swatch{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;width:52px}
.cd-swatch input{position:absolute;opacity:0;pointer-events:none}
.cd-swatch i{width:40px;height:40px;border-radius:50%;box-shadow:0 0 0 1px var(--a2-line,rgba(11,52,43,.18)),0 4px 10px rgba(0,0,0,.18);transition:transform .2s cubic-bezier(.2,.8,.2,1.2)}
.cd-swatch span{font-size:11.5px;color:var(--a2-muted,#5d6c62);text-align:center;white-space:nowrap}
.cd-swatch input:checked+i{box-shadow:0 0 0 2px var(--a2-card,#fbfaf5),0 0 0 4px var(--a2-gold,#9a7535);transform:scale(1.06)}
.cd-swatch input:checked~span{color:var(--a2-ink,#0b342b);font-weight:650}
.cd-swatch input:focus-visible+i{outline:2px solid var(--a2-gold2,#dfc080);outline-offset:4px}
.cd-swatch:active i{transform:scale(.94)}
[data-cd-swatch=default]{background:conic-gradient(#1f5a48 0 50%,#24406a 50% 100%)}
[data-cd-swatch=emerald]{background:linear-gradient(135deg,#1f5a48,#062a21)}
[data-cd-swatch=administrator]{background:linear-gradient(135deg,#24406a,#0a1630)}
[data-cd-swatch=navy]{background:linear-gradient(135deg,#22446f,#0c1e3a)}
[data-cd-swatch=burgundy]{background:linear-gradient(135deg,#6e2846,#2d0d1c)}
[data-cd-swatch=silver]{background:linear-gradient(135deg,#f1f4f5,#9cafb5)}
[data-cd-swatch=vip]{background:radial-gradient(circle at 70% 25%,#e4c47e 0 18%,transparent 19%),linear-gradient(135deg,#2d3034,#050607)}
.cd-sp-row{display:flex;align-items:center;gap:14px;padding:10px 12px;border-radius:12px;background:#0b2a23;margin:4px 0 8px}
.cd-sp-row img{height:28px;max-width:160px;object-fit:contain}
.cd-sp-row b{color:#eee9da;font-weight:600}
@media (max-width:900px){.cd-layout{grid-template-columns:1fr}.cd-show{position:static}}
@media (prefers-reduced-motion:reduce){.cd-swatch i{transition:none}}

@page{size:85.6mm 54mm;margin:0}
@media print{
  html,body{background:none!important}
  .a2-band,.a2-tabbar,.a2-mega,.a2-scrim,.a2-msg,.cd-side,.cd-show>.a2-note,[data-cd-status],.cd-print-hide{display:none!important}
  .a2-page,.cd-layout,.cd-show{display:block;padding:0!important;margin:0!important;max-width:none!important}
  .cd-stage{display:block}
  .cd{width:85.6mm;max-width:none;height:54mm;border-radius:3.2mm;box-shadow:none;break-after:page;page-break-after:always;margin:0}
}
/* The member's own card page (card-view.php) */
.cd-member-page .cd-stage{margin:18px auto 8px;max-width:640px}
.cd-member-controls{max-width:640px;margin:18px auto 0}
.cd-member-page [data-cd-status]{text-align:center;color:#5d6c62;font-size:13px}
/* Card waiting for approval (member page): photo and name only, with a veil. */
.cd.cd-is-pending .cd-number,.cd.cd-is-pending .cd-chip{opacity:.35}
.cd-pending-veil{position:absolute;inset:0;z-index:6;display:grid;place-items:center;border-radius:inherit;background:linear-gradient(135deg,rgba(6,32,26,.22),rgba(6,32,26,.08))}
.cd-pending-veil span{display:grid;gap:.25em;justify-items:center;padding:.9em 1.6em;border:1px solid rgba(223,192,128,.75);border-radius:999px;background:rgba(6,32,26,.72);color:#f4ecd5;text-align:center;transform:rotate(-6deg);box-shadow:0 10px 30px rgba(0,0,0,.25)}
.cd-pending-veil b{font:700 clamp(10px,3.4cqi,17px)/1.2 var(--cd-sans,Arial,sans-serif);letter-spacing:.16em;color:#dfc080}
.cd-pending-veil small{font-size:clamp(8px,2.2cqi,12px);letter-spacing:.08em;opacity:.85}