/* Membership: join form, member area, ID card, verification page. Uses the site's colour tokens so every theme applies. */
.member-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;flex-wrap:wrap;margin-bottom:12px}
.member-area .tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:2px solid var(--line);margin:16px 0 20px}
.member-area .tab{background:none;border:0;border-bottom:3px solid transparent;margin-bottom:-2px;padding:10px 14px;font:inherit;font-weight:600;color:var(--muted);cursor:pointer;border-radius:6px 6px 0 0}
.member-area .tab:hover{color:var(--forest-d)}
.member-area .tab[aria-selected=true]{color:var(--forest-d);border-bottom-color:var(--gold)}
.member-area .tab:focus-visible{outline:3px solid var(--gold);outline-offset:1px}
.count-dot{display:inline-block;min-width:1.4em;padding:0 .4em;border-radius:99px;background:var(--terra,var(--terra));color:#fff;font-size:.72rem;text-align:center}
.mstatus{display:inline-flex;gap:5px;align-items:center;font-size:.8rem;font-weight:700;padding:2px 10px;border-radius:99px;background:var(--line);color:var(--ink,var(--ink))}
.mstatus-active,.mstatus-approved{background:#e3efdc;color:#2f5a2b}
.mstatus-pending,.mstatus-pending_review,.mstatus-draft{background:#fdf0cf;color:#6d4d00}
.mstatus-rejected,.mstatus-suspended,.mstatus-unpublished,.mstatus-deactivated{background:#f8dcd5;color:#7a2a17}
.mstatus-changes_requested{background:var(--sand);color:var(--forest)}
.subcard{border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin:10px 0;background:var(--surface,#fff)}
.subcard header{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.subcard .reply{background:var(--gold-l);padding:8px 12px;border-radius:8px}
.sub-group{margin:22px 0}
.avatar{width:140px;height:140px;border-radius:50%;object-fit:cover;border:3px solid var(--gold);display:block;margin:8px 0}
.avatar-empty{display:grid;place-items:center;background:var(--forest-l);color:var(--muted);font-size:.85rem}
.notes{list-style:none;padding:0;margin:0}.notes li{border:1px solid var(--line);border-radius:10px;padding:10px 14px;margin:8px 0}.notes li.unread{border-left:4px solid var(--gold);background:var(--gold-l)}
.chip{display:inline-flex;gap:6px;align-items:center;border:1px solid var(--line);border-radius:99px;padding:2px 10px;font-size:.82rem;margin:2px}
.progress{height:12px;background:var(--line);border-radius:99px;overflow:hidden;margin:10px 0}.progress-bar{height:100%}.progress-bar i{display:block;height:100%;width:0;background:var(--forest);transition:width .2s}
.verify{border:2px solid var(--line);border-radius:16px;padding:24px;text-align:center}
.verify-ok{border-color:var(--ok);background:#f4f8ee}.verify-bad{border-color:#b5442c;background:#fdf3f0}
.verify .facts{text-align:left;max-width:420px;margin:16px auto}
.member-callout{margin-bottom:18px}
.steps{padding-left:1.2em}.steps li{margin:6px 0}
.hint{color:var(--muted);font-size:.85rem}
.actions-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:10px 0}

/* ---- ID card: credit-card proportion, scales down on phones */
.card-wrap{max-width:560px;margin:10px 0 16px}
.id-card{aspect-ratio:1.586/1;container-type:inline-size;border:2px solid var(--gold);border-radius:18px;overflow:hidden;background:linear-gradient(135deg,var(--paper),var(--sand));color:var(--ink);display:flex;flex-direction:column;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.id-top{display:flex;align-items:center;gap:3.5cqw;background:var(--forest-d);color:#fff;padding:2.5cqw 4cqw;border-bottom:4px solid var(--gold)}
.id-logo{width:11cqw;height:11cqw;border-radius:50%;background:#fff;border:2px solid var(--gold);object-fit:contain}
.id-title{margin:0;font:700 4.6cqw Georgia,serif;letter-spacing:.04em}.id-sub{margin:0;font-weight:700;font-size:3cqw;color:var(--gold-l);letter-spacing:.1em}
.id-body{flex:1;display:grid;grid-template-columns:24cqw 1fr 22cqw;gap:3cqw;padding:3cqw 4cqw;align-items:start;min-height:0}
.id-photo{width:24cqw;height:30cqw;background:var(--forest-l);border:2px solid var(--gold);display:grid;place-items:center;font-size:2.4cqw;color:var(--muted);overflow:hidden}
.id-photo img{width:100%;height:100%;object-fit:cover}
.id-info p{margin:0 0 .8cqw;font-size:2.7cqw;line-height:1.3;overflow-wrap:anywhere}
.id-info .id-name{font:700 4.2cqw Georgia,serif;color:var(--forest-d)}.id-info .id-no{font:700 3.6cqw ui-monospace,monospace;color:var(--terra);letter-spacing:.05em;margin-bottom:1.6cqw}
.id-qr{text-align:center}.id-qr svg{width:100%;height:auto;background:#fff;display:block}.id-qr small{font-size:2.1cqw;color:var(--muted)}
.id-foot{margin:0;background:var(--forest-d);color:#f3ebdd;font-size:2.1cqw;padding:1.4cqw 4cqw;text-align:center}

@media print{
  body.print-card > *:not(main):not(#app){display:none!important}
  body.print-card header,body.print-card footer,body.print-card .skip-link,body.print-card .tabs,body.print-card .member-head,body.print-card #mBanner,body.print-card .card-actions,body.print-card .hint,body.print-card h2,body.print-card .muted{display:none!important}
  body.print-card .card-wrap{max-width:none;width:90mm;margin:10mm auto;box-shadow:none}
  body.print-card .id-card{box-shadow:none;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  body.print-card .id-top,body.print-card .id-foot{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
@media (max-width:560px){.member-area .tab{padding:8px 10px;font-size:.88rem}.avatar{width:110px;height:110px}}
