/* Kelly Page -- Ham Contacts > contact cards (js/hc-share.js, 2026-10-24). QSL-card look: the callsign is the boldest
 * thing; the QR is always black on white. Nothing animates. */
.hc-sh { display: grid; gap: 12px; min-width: 0; }
.hc-sh-sec { display: grid; gap: 8px; min-width: 0; }
.hc-sh-sec + .hc-sh-sec { border-top: 1px solid var(--line); padding-top: 12px; }
.hc-sh-h { margin: 0; font: 700 12px var(--display, inherit); letter-spacing: .14em; text-transform: uppercase; color: var(--hc-card); }
.hc-sh-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.hc-sh-note { margin: 0; font-size: 12.5px; color: var(--dim); }
.hc-sh-note b { color: var(--hc-call); }
.hc-sh-msg { margin: 0; font: 600 12.5px var(--mono); color: var(--dim); overflow-wrap: anywhere; }
.hc-sh-msg:empty { display: none; }
.hc-sh-msg.ok { color: var(--hc-ok); } .hc-sh-msg.bad { color: var(--hc-bad); }
.hc-sh-who { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; min-width: 0; }
.hc-sh-call { font: 800 17px var(--mono); letter-spacing: .04em; color: var(--hc-call); text-shadow: 0 0 10px rgba(255, 217, 160, .25); }
.hc-sh-name { color: var(--text, #e8f1ff); overflow-wrap: anywhere; }
.hc-sh-key { font: 12px var(--mono); color: var(--cyan); }
.hc-sh-share { display: flex; gap: 12px; flex-wrap: wrap; align-items: flex-start; min-width: 0; }
.hc-sh-qrbox { display: grid; gap: 6px; justify-items: center; flex: 0 0 auto; }
.hc-sh-qr { display: block; width: 240px; height: auto; max-width: 100%; background: #fff; border-radius: 6px; image-rendering: pixelated;
  border: 3px solid var(--hc-card); box-shadow: 0 0 14px rgba(255, 217, 160, .2); }
.hc-sh-linkbox { display: grid; gap: 6px; flex: 1 1 200px; min-width: 0; }
.hc-sh-link, .hc-sh-paste { width: 100%; box-sizing: border-box; font: 12px/1.4 var(--mono); overflow-wrap: anywhere; word-break: break-all; }
.hc-sh-link { color: var(--cyan); resize: none; }
.hc-sh-paste { min-height: 64px; }
.hc-sh-tools .btn[disabled] { opacity: .5; cursor: not-allowed; }
.hc-sh-cam { color: var(--amber); }
.hc-sh-err { padding: 8px 10px; border-radius: 10px; border: 1px solid var(--hc-bad); background: rgba(255, 59, 92, .08); color: var(--hc-bad); font-size: 13px; overflow-wrap: anywhere; }
.hc-sh-prev { display: grid; gap: 8px; padding: 10px 12px; border-radius: 12px; background: var(--raised); border: 1px solid var(--line2);
  border-left: 4px solid var(--hc-card); min-width: 0; }
.hc-sh-dl { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 3px 10px; margin: 0; font-size: 13px; }
.hc-sh-dl dt { color: var(--dim); font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; align-self: center; }
.hc-sh-dl dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.hc-sh-ok { color: var(--hc-ok); } .hc-sh-warn { color: var(--hc-warn); }
.hc-sh-callrow input { width: 120px; text-transform: uppercase; font-family: var(--mono); }
/* key fingerprint (16 hex, read aloud), the whole key on demand, the reader's warnings, other cards in the text */
.hc-sh-fp { font: 700 12.5px var(--mono); letter-spacing: .06em; color: var(--cyan); white-space: nowrap; }
.hc-sh-fp.big { font-size: 16px; }
.hc-sh-hash { font-size: 11.5px; color: var(--dim); }
.hc-sh-full summary { cursor: pointer; font-size: 11.5px; color: var(--dim); }
.hc-sh-full code { font: 11px var(--mono); word-break: break-all; }
.hc-sh-info { color: var(--dim); font-size: 12px; }
.hc-sh-warns, .hc-sh-morelist, .hc-sh-offers, .hc-sh-check { margin: 0; padding-left: 18px; font-size: 12.5px; display: grid; gap: 4px; }
.hc-sh-warns { color: var(--hc-warn); }
.hc-sh-more { display: grid; gap: 4px; border-top: 1px dashed var(--line2); padding-top: 8px; }
.hc-sh-morelist li, .hc-sh-offers li { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; overflow-wrap: anywhere; }
.hc-sh-mwho { flex: 1 1 180px; min-width: 0; }
/* 🤝 swap: the big QR is always black on white (meshqr draws it); nothing animates */
.hc-sh-swap { display: grid; gap: 8px; padding: 10px 12px; border-radius: 12px; background: var(--raised); border: 1px solid var(--line2); border-left: 4px solid var(--hc-ok); min-width: 0; }
.hc-sh-swapqr { display: grid; gap: 6px; justify-items: center; }
.hc-sh-qr.big { width: 300px; }
.hc-sh-steps { margin: 0; padding-left: 20px; display: grid; gap: 6px; font-size: 13px; }
.hc-sh-steps .hc-sh-row { margin-top: 4px; }
.hc-sh-dmtext { flex: 1 1 180px; min-width: 0; font-family: var(--mono); }
.hc-sh-check { list-style: none; padding-left: 0; font-weight: 600; }
.hc-sh-check li.ok { color: var(--hc-ok); }
.hc-sh-opt { display: flex; gap: 6px; align-items: flex-start; font-size: 12.5px; color: var(--dim); }
@media (max-width: 600px) {
  .hc-sh-qr.big { width: min(300px, 100%); }
  .hc-sh-share { flex-direction: column; align-items: stretch; }
  .hc-sh-qr { width: min(240px, 100%); }
  .hc-sh-callrow .fld.inline { flex-wrap: wrap; }
}