.scan-page { --scan-muted: color-mix(in srgb, var(--fg) 84%, var(--bg)); }
.scan-account { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
#creditBalance { font-variant-numeric: tabular-nums; color: var(--white); }
.scan-page #sol { margin-top: 4px; }
#sol .side { height: calc(100vh - 180px); min-height: 240px; }
#sol .history-empty { padding: 10px; color: var(--scan-muted); font-size: 12px; }
.scan-toolbar { padding: 26px 26px 0; max-width: 1200px; }
.scan-toolbar label { display: block; margin-bottom: 9px; color: var(--white); font-weight: 600; }
.scan-input-row { display: flex; gap: 10px; }
.scan-input-row #q { flex: 1; min-width: 0; min-height: 44px; padding: 10px 12px; border: 1px solid var(--control-border); background: var(--control-bg); border-radius: var(--control-radius); font-family: var(--font-mono); }
.scan-field { position: relative; flex: 1; min-width: 0; display: flex; }
.scan-field #q { flex: 1; padding-right: 12px; }
.scan-field:has(.chain-tag:not([hidden])) #q { padding-right: 150px; }
.scan-field.has-logo #q { padding-right: 40px; }
.chain-tag { position: absolute; right: 9px; top: 50%; transform: translateY(-50%); max-width: 136px; padding: 4px 9px; border-radius: 999px; border: 1px solid var(--control-border); background: var(--bg); color: var(--scan-muted); font-size: 11px; font-weight: 600; line-height: 1.2; letter-spacing: .02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; }
.chain-tag[data-chain="solana"], .chain-tag[data-chain="bnb"], .chain-tag[data-chain="robinhood"] { color: var(--white); border-color: var(--accent); }
.chain-tag[hidden] { display: none; }
.chain-tag.logo { display: flex; padding: 0; border: 0; background: transparent; max-width: none; }
.chain-tag .cl { width: 18px; height: 18px; margin: 0; display: block; }
#sol .ri > .cl { margin: 0 -3px 0 0; flex: none; }
#sol .chip .cl { margin: 0; flex: none; }
.scan-input-row #go { min-height: 44px; padding: 10px 18px; }
.scan-page input::placeholder { color: var(--scan-muted); opacity: 1; }
.scan-page input { caret-color: var(--accent); }
.scan-page ::selection { background: var(--accent); color: var(--bg); }
.scan-page :focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
#scanHelp, #scanStatus { color: var(--scan-muted); font-size: 12px; margin: 8px 0 0; }
#scanStatus:empty { display: none; }
#scanStatus[data-error="true"] { color: var(--red); }
#sol .page { padding: 24px 26px 70px; }
#sol .scan-intro { max-width: 790px; margin: 32px 0 0; }
#sol .scan-intro h2 { font-size: clamp(26px, 3vw, 36px); letter-spacing: -.03em; line-height: 1.2; text-wrap: balance; }
#sol .scan-intro > p { max-width: 65ch; color: var(--scan-muted); font-size: 14px; line-height: 1.75; }
.scan-intro dl { margin: 32px 0; border-top: 1px solid var(--border); }
.scan-intro dl > div { display: grid; grid-template-columns: 160px 1fr; gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--border); }
.scan-intro dt { font-weight: 600; color: var(--white); }
.scan-intro dd { margin: 0; color: var(--scan-muted); }
#sol .scan-intro .scan-scope { font-size: 12px; }
#sol button:disabled { cursor: not-allowed; opacity: .6; }
#sol .report-time { color: var(--scan-muted); font-size: 12px; }
#sol .th .acts { flex-wrap: wrap; max-width: 100%; }
.scan-page dialog { width: min(460px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); overflow-y: auto; padding: 30px; background: var(--bg); color: var(--fg); border: 1px solid var(--border); border-radius: 14px; box-shadow: 0 20px 60px #0006; font: inherit; }
.scan-page dialog::backdrop { background: #0009; }
.scan-page dialog h2 { margin: 0 30px 12px 0; color: var(--white); font-size: 23px; line-height: 1.3; letter-spacing: -.025em; }
.scan-page dialog p { line-height: 1.65; }
.scan-page .dialog-close { position: absolute; right: 12px; top: 12px; width: 32px; padding: 0; font-size: 20px; }
.scan-page dialog label { display: block; margin: 16px 0 7px; }
.scan-page dialog input { display: block; width: 100%; box-sizing: border-box; min-height: 42px; padding: 10px; }
.scan-page .scan-small { color: var(--scan-muted); font-size: 12px; }
#walletPay, #createPayment, #checkPayment { width: 100%; min-height: 44px; }
.dialog-message { min-height: 1.5em; overflow-wrap: anywhere; }
.dialog-message[data-error="true"] { color: var(--red); }
.refill-amount { padding: 4px 0 14px; border-bottom: 1px solid var(--border); }
.refill-row { display: flex; align-items: center; gap: 14px; }
.scan-page dialog .refill-row input { flex: 1; width: auto; min-width: 0; font-size: 20px; font-weight: 600; font-variant-numeric: tabular-nums; }
.refill-row strong { flex: none; white-space: nowrap; font-size: 16px; color: var(--white); font-variant-numeric: tabular-nums; }
.refill-presets { display: flex; gap: 6px; margin-top: 10px; }
.refill-presets button { flex: 1; min-height: 32px; padding: 0 6px; font-size: 12px; }
.refill-presets button.on { border-color: var(--accent); color: var(--white); }
.refill-amount .scan-small { margin: 10px 0 0; }
#mobilePay { margin: 20px 0 0; }
#mobilePay summary { cursor: pointer; }
#paymentLinkForm button { margin-top: 12px; }
#paymentDetails { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--border); }
#paymentDetails > button { min-height: 40px; }
#checkPayment { margin-top: 14px; }
#paymentAmount { font-variant-numeric: tabular-nums; color: var(--white); }
#paymentQR { display: block; max-width: 100%; height: auto; margin: 0 auto 18px; border-radius: 8px; }
#paymentQR[hidden] { display: none; }
.payment-address { font-family: var(--font-mono); overflow-wrap: anywhere; }
.scan-busy { padding: 38px 0; max-width: 65ch; color: var(--scan-muted); }
.scan-busy h2 { font-size: 23px; }
.scan-busy p { margin-top: 12px; }
@media (max-width: 760px) {
  .scan-page .app-header .l1 { flex-wrap: wrap; gap: 10px; }
  .scan-page .top-nav { order: 3; flex-basis: 100%; overflow-x: auto; }
  .scan-page .top-nav { gap: 0; }
  .scan-page .top-nav a { min-height: 38px; padding: 0 8px; font-size: 12px; gap: 5px; }
  .scan-page .page-heading { flex-direction: column; align-items: stretch; gap: 18px; }
  .scan-account { justify-content: space-between; gap: 10px; }
  .scan-toolbar, #sol .page { padding-left: var(--page-pad); padding-right: var(--page-pad); }
  #sol .scan-intro { margin-top: 12px; }
  .scan-intro dl > div { grid-template-columns: 1fr; gap: 6px; }
  .scan-input-row { flex-direction: column; }
  .scan-field, .scan-input-row #q, .scan-input-row #go { width: 100%; max-width: none; box-sizing: border-box; }
  .scan-page dialog { padding: 26px 20px; }
  #sol .app { display: flex; flex-direction: column; }
  #sol .side { display: flex; position: static; order: 2; height: auto; min-height: 0; border-right: 0; border-top: 1px solid var(--border); padding-bottom: 55px; }
  #sol .recent { max-height: 240px; }
}
@media (prefers-reduced-motion: reduce) { .scan-page *, .scan-page *::before, .scan-page *::after { animation: none !important; transition: none !important; } }
