/* v4 group key "badge" (/badge and /badge/{id}): page-only rules. Shared components come from v4.css and v4-components.css. */
.bd-head{background:var(--pale);border-bottom:1px solid var(--line);padding:48px 0 32px}
.bd-head h1{font-size:clamp(32px,4.4vw,50px);font-weight:620;margin-bottom:12px;max-width:none}
.bd-head .sub{font-size:20px;line-height:1.5;color:var(--ink);max-width:46em;margin:0 0 16px}
.bd-intro{max-width:52em;font-size:18px;line-height:1.6;color:var(--ink);margin-bottom:20px}
.bd-intro a,.bd-note a,.bd-out a,.bd-qs a{text-decoration:underline;text-underline-offset:3px}
.bd-form{max-width:640px}
.bd-count{margin:14px 0 0;color:var(--muted);font-size:17px}
.bd-section{padding-top:48px;padding-bottom:48px}
.bd-alt{background:var(--sand)}
.bd-section .section-head{margin-bottom:20px}
.bd-results{list-style:none;margin:0;padding:0;max-width:760px;display:grid;gap:10px}
.bd-results a{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;min-height:44px;padding:12px 16px;background:#fff;border:1px solid var(--line);border-radius:12px;text-decoration:none;color:var(--navy)}
.bd-results a:hover,.bd-results a:focus-visible{border-color:var(--navy)}
.bd-results b{display:block;font-weight:650;font-size:18px}
.bd-results small{display:block;font-size:16px;color:var(--muted)}
.bd-go{font-weight:650;text-decoration:underline;text-underline-offset:3px}
.bd-note{max-width:52em;margin-top:16px;font-size:16px;color:var(--muted)}
.bd-get{margin:0;padding-left:22px;max-width:52em;font-size:18px;line-height:1.6;color:var(--ink)}
.bd-get li{margin-bottom:8px}
.bd-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:36px;align-items:start}
.bdg-controls h2,.bd-out h2{font-size:26px;margin-bottom:14px}
.bd-out h3{font-size:20px;margin:22px 0 8px}
.bd-out p{font-size:17px;line-height:1.55;color:var(--ink)}
.bdg-controls fieldset{border:0;margin:0 0 16px;padding:0}
.bdg-controls legend{font-weight:650;font-size:17px;margin-bottom:8px;padding:0;color:var(--navy)}
.bdg-opts{display:flex;flex-wrap:wrap;gap:8px}
.bdg-opts label{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:10px;cursor:pointer;font-size:16px;background:#fff;color:var(--ink)}
.bdg-opts input{position:absolute;opacity:0;inset:0;width:100%;height:100%;margin:0;cursor:pointer}
.bdg-opts label:has(input:checked){border-color:var(--navy);background:var(--pale);font-weight:650}
.bdg-opts label:has(input:focus-visible){outline:2px solid var(--navy);outline-offset:2px}
.bdg-sw{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.bdg-sw button{width:44px;height:44px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 0 1px var(--line);cursor:pointer;padding:0}
.bdg-sw button[aria-pressed="true"]{box-shadow:0 0 0 3px var(--navy)}
.bdg-sw button[data-c="1565C0"]{background:#1565C0}
.bdg-sw button[data-c="0F766E"]{background:#0F766E}
.bdg-sw button[data-c="15803D"]{background:#15803D}
.bdg-sw button[data-c="B45309"]{background:#B45309}
.bdg-sw button[data-c="B91C1C"]{background:#B91C1C}
.bdg-sw button[data-c="7C3AED"]{background:#7C3AED}
.bdg-sw button[data-c="1A202C"]{background:#1A202C}
.bdg-sw button[data-c="F59E0B"]{background:#F59E0B}
.bdg-sw input[type=color]{width:52px;height:44px;padding:0;border:1px solid var(--line);border-radius:8px;background:#fff}
.bdg-stage{border:1px solid var(--line);border-radius:12px;min-height:150px;display:flex;align-items:center;justify-content:center;padding:20px;overflow:auto;background:#fff}
.bdg-stage[data-bg="dark"]{background:#1F2937}
.bdg-stage[data-bg="gray"]{background:#E2E8F0}
.bdg-stage img{max-width:100%;height:auto}
.bdg-bgs{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 18px;align-items:center;font-size:16px;color:var(--ink)}
.bdg-bgs button{min-height:44px;padding:0 16px;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer;color:var(--ink);font-size:16px}
.bdg-bgs button[aria-pressed="true"]{border-color:var(--navy);background:var(--pale);font-weight:650}
.bd-label{display:block;font-weight:650;font-size:16px;color:var(--navy);margin:10px 0 6px}
.bd-code{display:block;width:100%;box-sizing:border-box;padding:12px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);font:15px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;resize:vertical}
.bd-out .button{margin-top:8px;min-height:44px;padding:8px 20px;font-size:16px}
.bd-qs p{max-width:52em;font-size:18px;line-height:1.6;color:var(--ink)}
@media (max-width:900px){.bd-grid{grid-template-columns:1fr;gap:28px}}
@media (max-width:700px){
 .bd-head{padding:32px 0 24px}
 .bd-head .sub{font-size:18px}
 .bd-section{padding-top:36px;padding-bottom:36px}
}
/* printable sign (/badge/{id}/sign): on screen a card under the header, on paper only the card */
.bs-actions{display:flex;flex-wrap:wrap;gap:12px;margin:0}
.bs-section{background:#fff}
.bs-card{max-width:640px;margin:0 auto;border:6px solid var(--navy);border-radius:16px;padding:32px 24px;text-align:center;background:#fff;color:var(--ink)}
.bs-card h2{font-size:clamp(28px,5vw,40px);line-height:1.15;margin:0 0 8px}
.bs-sub{font-size:19px;line-height:1.5;margin:0 0 18px}
.bs-qr svg{width:300px;height:300px;max-width:100%}
.bs-cta{font-size:24px;font-weight:700;margin:14px 0 4px}
.bs-url{font-size:17px;color:var(--muted);margin:0;overflow-wrap:anywhere}
@media print{
  .header,.footer,.cy-crumb,.sticky-cta,.helper,.bd-head,.v4-adminbar,dialog,#toast,.related-reading{display:none!important}
  body{background:#fff}
  .section.bs-section{padding:0}
  .bs-card{border-width:8px;max-width:none;break-inside:avoid}
  .bs-qr svg{width:420px;height:420px}
}
@media (max-width:620px){.bs-actions .button{width:100%}.bs-card{padding:22px 14px}}