/* HPAY's existing paper/ink/red tokens; the campaign's ten places form its own ledger. */
.cq-nav { max-width: 1328px; margin: auto; padding: 24px var(--pad); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--hp-line); gap: 16px; }
.cq-nav > a { font-size: 12px; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; gap: 12px; }
.cq-nav .cq-wordmark { font: 600 28px/1 var(--display); letter-spacing: -.06em; }
.cq-wordmark img { object-fit: contain; }
.cq-wordmark span { border-left: 1px solid var(--hp-line); padding-left: 16px; font: 400 10px/1.5 var(--mono); letter-spacing: .06em; margin-left: 4px; }
.cq-page { max-width: 1328px; margin: auto; padding: 48px var(--pad) 32px; }
.cq-hero { padding-bottom: 40px; }
.hpay-workspace .cq-hero h1 { font-size: clamp(68px, 8.6vw, 124px); line-height: .98; margin: 24px 0 28px; max-width: 1100px; letter-spacing: -.075em; }
.cq-hero h1 span { color: var(--hp-red); }
.cq-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; max-width: 970px; align-items: start; }
.cq-intro > p:first-child { font: 500 25px/1.2 var(--display); letter-spacing: -.035em; }
.cq-intro > p:last-child { font-size: 14px; line-height: 1.75; color: var(--hp-quiet); max-width: 440px; }
.cq-workspace { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,.85fr); gap: 64px; border-top: 2px solid var(--hp-ink); padding-top: 32px; align-items: start; }
.cq-workspace > * { min-width: 0; }
.cq-section-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.hpay-workspace .cq-section-heading h2 { font-size: 25px; margin: 0; }
.hpay-workspace .cq-section-heading .btn { border: 0; padding-inline: 0; text-decoration: underline; }
.cq-count { font: 400 12px/1.6 var(--mono); margin-top: 20px; color: var(--hp-quiet); }
.cq-slots { list-style: none; padding: 0; margin: 16px 0; display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 8px; min-height: 120px; }
.cq-slots li { border: 1px solid var(--hp-line); aspect-ratio: 1.3; display: flex; align-items: flex-end; padding: 10px; font: 400 11px/1 var(--mono); background: var(--hp-sheet); }
.cq-slots li[data-state="requested"] { background: var(--hp-red); color: white; border-color: var(--hp-red); }
.cq-key { color: var(--hp-quiet); font: 400 10px/1.5 var(--mono); }
.cq-key > span:first-child { color: var(--hp-red); }.cq-open-key { margin-left: 20px; }
.cq-steps { list-style: none; margin: 32px 0 0; padding: 0; }
.cq-steps li { padding: 18px 0; border-top: 1px solid var(--hp-line); display: grid; grid-template-columns: 36px 1fr; gap: 12px; color: var(--hp-quiet); font-size: 13px; line-height: 1.65; }
.cq-steps li > span { font: 400 11px/1.8 var(--mono); color: var(--hp-red); }
.cq-steps strong { display: block; color: var(--hp-ink); font-weight: 600; }
.cq-request { background: var(--hp-sheet); border-top: 4px solid var(--hp-red); padding: 28px; position: relative; }
.cq-request::after { content: ''; position: absolute; bottom: -8px; left: 0; right: 0; height: 8px; background: linear-gradient(135deg,var(--hp-sheet) 4px,transparent 0) 0 0/8px 8px,linear-gradient(225deg,var(--hp-sheet) 4px,transparent 0) 0 0/8px 8px; }
.cq-slip-label { font: 400 9px/1.6 var(--mono); letter-spacing: .08em; color: var(--hp-quiet); }
.hpay-workspace .cq-request h2 { margin: 14px 0 24px; font-size: 36px; }
.cq-fixed-amount { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 16px 0; margin-bottom: 24px; border-block: 1px solid var(--hp-line); }
.cq-fixed-amount > span { font-size: 12px; color: var(--hp-quiet); }.cq-fixed-amount strong { font: 500 44px/1 var(--display); letter-spacing: -.06em; }.cq-fixed-amount small { font: 400 11px/1 var(--mono); letter-spacing: 0; }
.cq-request .pl-input { width: 100%; margin-top: 8px; }
.cq-help,.cq-status,.cq-safety,.cq-wallet { font-size: 12px; line-height: 1.7; color: var(--hp-quiet); overflow-wrap: anywhere; }
.cq-help { margin: 10px 0 20px; }.cq-connect,.cq-sign { width: 100%; }.cq-wallet { font-family: var(--mono); font-size: 10px; margin-block: 8px; }.cq-sign { margin-top: 8px; }.cq-status { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--hp-line); min-height: 64px; }.cq-safety { font-size: 11px; color: var(--hp-ink); margin-top: 16px; }
.cq-owned { margin-top: 16px; border-left: 2px solid var(--hp-red); padding-left: 16px; font-size: 11px; line-height: 1.8; }.cq-owned code { display: block; overflow-wrap: anywhere; }
.cq-footer { display: grid; grid-template-columns: 1fr auto; gap: 40px; font-size: 11px; line-height: 1.8; color: var(--hp-quiet); }.cq-footer > p:first-child { max-width: 800px; }.cq-footer a { display: inline-flex; min-height: 44px; align-items: center; margin-right: 16px; }
.ir-launch { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 0; border-top: 1px solid var(--hp-line); }.ir-launch p { color: var(--hp-quiet); font-size: 12px; max-width: 670px; line-height: 1.75; }.ir-section { margin-block: 24px 40px; padding-block: 28px; border-block: 2px solid var(--hp-ink); }.ir-section h2 { margin-bottom: 16px; }.ir-section p { font-size: 13px; line-height: 1.8; }.ir-status { padding-block: 16px; color: var(--hp-quiet); overflow-wrap: anywhere; }.ir-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-block: 16px; }.ir-select { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; font-size: 12px; }.ir-section input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--hp-red); }.ir-table { width: 100%; border-collapse: collapse; text-align: left; table-layout: fixed; font-size: 12px; }.ir-table th,.ir-table td { border-bottom: 1px solid var(--hp-line); padding: 16px 8px; overflow-wrap: anywhere; }.ir-table th:first-child { width: 52px; }.ir-table th:nth-child(2) { width: 55%; }.ir-wallet { font: 400 11px/1.7 var(--mono); }.ir-review { margin-block: 24px; padding: 24px; background: var(--hp-sheet); border-top: 3px solid var(--hp-red); }.ir-review ol { list-style: decimal; padding-left: 20px; }.ir-review li { padding-block: 10px; font: 400 12px/1.7 var(--mono); overflow-wrap: anywhere; }.ir-review pre,.ir-section code { white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word; font-size: 11px; }.ir-review summary { min-height: 44px; padding-block: 12px; cursor: pointer; font-size: 12px; }.ir-recovery { padding: 24px; border: 1px solid var(--hp-line); }.ir-recovery label { display: block; font-size: 12px; }.ir-recovery .pl-input { width: 100%; margin-block: 8px 16px; }
@media(max-width:700px) { .cq-nav { padding-block: 16px; }.cq-wordmark span { display: none; }.cq-page { padding-top: 32px; }.hpay-workspace .cq-hero h1 { font-size: clamp(60px,15vw,96px); }.cq-intro { grid-template-columns: 1fr; gap: 16px; }.cq-intro > p:first-child { font-size: 22px; }.cq-workspace { grid-template-columns: 1fr; gap: 32px; }.cq-slots { gap: 6px; }.cq-slots li { aspect-ratio: 1; padding: 8px; }.cq-request { padding: 24px 20px; }.cq-footer { grid-template-columns: 1fr; gap: 12px; }.ir-review,.ir-recovery { padding: 20px 16px; }.ir-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }.ir-table tbody,.ir-table tr { display: block; }.ir-table tr { position: relative; border-top: 1px solid var(--hp-line); padding: 12px 0 12px 40px; }.ir-table td { display: block; border: 0; padding: 4px 0; }.ir-table td:first-child { position: absolute; left: 0; top: 16px; }.ir-table td:nth-child(3)::before { content: 'Amount: '; }.ir-table td:nth-child(4)::before { content: 'Status: '; } }
@media(prefers-reduced-motion:reduce) { .invoice-campaign * { scroll-behavior: auto; } }

/* Pass-one review: bring the request form forward on QR-first phones and separate the receipt edge from the footer. */
.cq-footer { margin-top: 48px; }
@media(max-width:700px) { .cq-hero { padding-bottom: 24px; }.cq-hero h1 { margin: 16px 0 20px; }.cq-intro > p:first-child { display: none; }.cq-request { order: -1; }.cq-footer { margin-top: 32px; } }

.cq-nav-actions { display: flex; gap: 16px; align-items: center; }.cq-nav-actions > a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-size: 12px; text-decoration: none; }
@media(max-width:700px) { .cq-nav-actions { gap: 10px; }.cq-nav-actions .biome-wallet-button { padding-inline: 12px; font-size: 11px; } }