/* [TOUCHPOINT-KIT 2026-10-19] CodeB Wallet touchpoints: buttons, QR frame, store line, result states.
   From the wallet team's touchpoint guide (approved by the owner 19 Oct 2026). Kit and rules: /codeb-wallet-touchpoints.html
   Button: 56 px high (never below 48 px), 12 px radius, red CodeB mark 32 px, Inter SemiBold 17 px, clear space 28 px.
   .cbw-btn = navy, for light backgrounds;  .cbw-btn--white = white with navy outline, for dark backgrounds.
   Focus ring #F5A000. Font: Inter (SIL Open Font License), Latin subset served from this site. */
@font-face{font-family:"CodeB Inter";src:url("/fonts/inter-semibold-latin.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
.cbw-touch{margin:28px 0;text-align:center}
.cbw-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;box-sizing:border-box;min-height:56px;max-width:100%;padding:0 20px 0 16px;border-radius:12px;border:1.5px solid #0B3A8A;background:#0B3A8A;color:#FFFFFF;font-family:"CodeB Inter",Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-weight:600;font-size:17px;line-height:1.2;letter-spacing:0;text-align:left;white-space:nowrap;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.cbw-btn img{width:32px;height:32px;flex:0 0 32px;display:block}
.cbw-btn:hover{background:#0E46A6;border-color:#0E46A6;color:#FFFFFF}
.cbw-btn:focus-visible{outline:3px solid #F5A000;outline-offset:2px}
.cbw-btn--white{background:#FFFFFF;color:#0B3A8A;border-color:#0B3A8A}
.cbw-btn--white:hover{background:#EEF3FC;color:#0B3A8A;border-color:#0B3A8A}
.cbw-btn[hidden]{display:none}
/* the label never wraps: on narrow screens the whole button scales down in proportion (never below 48 px) */
@media (max-width:400px){.cbw-btn{min-height:50px;border-radius:11px;font-size:15px;padding:0 18px 0 14px;gap:11px}.cbw-btn img{width:28px;height:28px;flex-basis:28px}}
@media (max-width:340px){.cbw-btn{min-height:48px;font-size:14px;padding:0 14px 0 12px;gap:10px}.cbw-btn img{width:27px;height:27px;flex-basis:27px}}
.cbw-store{margin:10px 0 0;font-size:.88rem;line-height:1.5;color:inherit;opacity:.85}
.cbw-store a{color:inherit;font-weight:600;text-decoration:underline}
/* QR frame: screen variant navy; .cbw-qr--print white with a 2 px navy outline. The code always sits on white. */
.cbw-qr{box-sizing:border-box;width:320px;max-width:100%;margin:16px auto;padding:22px 30px 20px;border-radius:20px;background:#0B3A8A;color:#FFFFFF;text-align:center;font-family:"CodeB Inter",Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.cbw-qr--print{background:#FFFFFF;border:2px solid #0B3A8A;color:#0B3A8A}
.cbw-qr-head{display:flex;align-items:center;gap:10px;margin:0 -6px 18px;font-weight:600;font-size:18px;line-height:1.2;text-align:left}
.cbw-qr-head img{width:36px;height:36px;flex:0 0 36px;display:block}
.cbw-qr-code{box-sizing:border-box;width:100%;aspect-ratio:1/1;padding:12px;border-radius:12px;background:#FFFFFF;display:flex;align-items:center;justify-content:center}
.cbw-qr-code svg,.cbw-qr-code img,.cbw-qr-code canvas{width:100%;height:100%;display:block}
.cbw-qr-alt{margin:14px 0 0;font-size:13px;line-height:1.6;color:#DCE6FA;font-weight:600}
.cbw-qr--print .cbw-qr-alt{color:#0A1F44}
.cbw-qr-alt span{display:block;font-family:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;font-weight:400;overflow-wrap:anywhere}
.cbw-qr-alt a{color:inherit;text-decoration:none}
/* Result in plain words: Waiting / Done / Not completed */
.cbw-state{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.cbw-state::before{content:"";width:10px;height:10px;border-radius:50%;background:#8A93A3}
.cbw-state--waiting::before{background:#F5A000}
.cbw-state--done::before{background:#2E9E5B}
.cbw-state--failed::before{background:#D32526}