/* SinfuCouponPro 2.1.9.0 — QuickPad field UI.
   Goal: one active 10-key stage at a time, large touch targets, 4-tap auto verification.
   Code rule: A-J, A-J, 0-9, 0-9. */
body.issue-body:not(.claim-mode) .agency-field{
  background:linear-gradient(180deg,#f7fbff,#edf5ff)!important;
  border-color:#bed4f4!important;
  padding:13px!important;
}
body.issue-body:not(.claim-mode) .agency-field>label{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  margin-bottom:7px!important;
}
body.issue-body:not(.claim-mode) .virtual-code-row{
  display:block!important;
  margin:0 0 8px!important;
}
body.issue-body:not(.claim-mode) .virtual-code-shell{
  min-height:0!important;
  width:100%!important;
  padding:10px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:10px!important;
  align-items:center!important;
  background:#fff!important;
  border:2px solid #a8c6f2!important;
  border-radius:15px!important;
  box-shadow:0 5px 14px rgba(37,99,235,.08)!important;
  outline:none!important;
}
body.issue-body:not(.claim-mode) .virtual-code-shell:focus{
  border-color:#3b82f6!important;
  box-shadow:0 0 0 4px rgba(59,130,246,.12)!important;
}
body.issue-body:not(.claim-mode) .virtual-code-display{
  min-width:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:5px!important;
  align-items:center!important;
  justify-items:stretch!important;
  overflow:visible!important;
}
body.issue-body:not(.claim-mode) .quick-code-slots{
  width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
}
body.issue-body:not(.claim-mode) .code-slot{
  min-width:0!important;
  width:auto!important;
  height:58px!important;
  border-radius:13px!important;
  border:1.5px solid #c6d8f2!important;
  background:#f8fbff!important;
  color:#a0b1c5!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:24px!important;
  font-weight:950!important;
  line-height:1!important;
  letter-spacing:0!important;
  font-variant-numeric:tabular-nums!important;
}
body.issue-body:not(.claim-mode) .code-slot.filled{
  color:#123f7f!important;
  background:#e9f3ff!important;
  border-color:#6da2ea!important;
  box-shadow:inset 0 0 0 1px rgba(59,130,246,.08)!important;
  font-size:27px!important;
}
body.issue-body:not(.claim-mode) .quick-code-stage{
  min-width:0!important;
  color:#58728f!important;
  font-size:11px!important;
  line-height:1.25!important;
  font-weight:850!important;
  text-align:center!important;
  letter-spacing:0!important;
}
body.issue-body:not(.claim-mode) .virtual-code-mini-actions{
  width:78px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:6px!important;
}
body.issue-body:not(.claim-mode) .mini-code-btn{
  width:100%!important;
  min-height:34px!important;
  height:34px!important;
  padding:0 7px!important;
  border-radius:9px!important;
  font-size:11px!important;
  font-weight:900!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
/* The fourth key auto-verifies; keep the button in DOM for JS/keyboard fallback, not as a touch target. */
body.issue-body:not(.claim-mode) .code-check-btn{
  display:none!important;
}
body.issue-body:not(.claim-mode) .secure-keypad{
  display:block!important;
  margin:0!important;
  padding:8px 0 0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body.issue-body:not(.claim-mode) .secure-keypad.is-locked{display:none!important;}
body.issue-body:not(.claim-mode) .keypad-stage-title{
  min-height:34px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  margin:0 0 7px!important;
  padding:6px 10px!important;
  color:#1f4f89!important;
  background:#e8f3ff!important;
  border:1px solid #c9def8!important;
  border-radius:10px!important;
}
body.issue-body:not(.claim-mode) .keypad-stage-title b{display:none!important;}
body.issue-body:not(.claim-mode) .keypad-stage-title span{
  width:100%!important;
  color:#275a95!important;
  font-size:12px!important;
  font-weight:900!important;
  text-align:center!important;
}
body.issue-body:not(.claim-mode) .secure-keypad.is-complete .keypad-stage-title{
  background:#ecf8f1!important;
  border-color:#c4ead3!important;
}
body.issue-body:not(.claim-mode) .secure-keypad.is-complete .keypad-stage-title span{
  color:#0f8150!important;
}
body.issue-body:not(.claim-mode) .keypad-row{
  width:100%!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:8px!important;
  margin:0!important;
}
body.issue-body:not(.claim-mode) .keypad-row[hidden]{display:none!important;}
body.issue-body:not(.claim-mode) .keypad-key{
  min-width:0!important;
  width:100%!important;
  min-height:66px!important;
  height:66px!important;
  padding:0!important;
  border-radius:14px!important;
  border:1.5px solid #acd0fa!important;
  background:#fff!important;
  color:#164f9e!important;
  box-shadow:0 4px 10px rgba(37,99,235,.10)!important;
  font-size:26px!important;
  font-weight:950!important;
  line-height:1!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
  transition:transform .06s ease,background .06s ease,border-color .06s ease,box-shadow .06s ease!important;
}
body.issue-body:not(.claim-mode) .keypad-digit{
  color:#153f78!important;
  background:#f7fbff!important;
}
body.issue-body:not(.claim-mode) .keypad-key:active:not(:disabled){
  transform:scale(.94)!important;
  background:#dcecff!important;
  border-color:#3f83df!important;
  box-shadow:0 1px 4px rgba(37,99,235,.13)!important;
}
body.issue-body:not(.claim-mode) .keypad-key:disabled{
  opacity:.32!important;
  box-shadow:none!important;
}
body.issue-body:not(.claim-mode) .quick-code-rule{
  margin-top:8px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#61758d!important;
  font-size:10.5px!important;
  font-weight:800!important;
  text-align:center!important;
}
/* Verification errors stay in-card instead of forcing a modal confirmation. */
body.issue-body:not(.claim-mode) #m.alert{
  margin:0 0 8px!important;
  border-radius:11px!important;
  font-size:12px!important;
  line-height:1.4!important;
  padding:9px 11px!important;
}
@media(max-width:560px){
  body.issue-body:not(.claim-mode) .agency-field{padding:10px!important;}
  body.issue-body:not(.claim-mode) .virtual-code-shell{
    grid-template-columns:minmax(0,1fr)!important;
    gap:7px!important;
    padding:9px!important;
    border-radius:13px!important;
  }
  body.issue-body:not(.claim-mode) .code-slot{
    height:54px!important;
    font-size:22px!important;
    border-radius:11px!important;
  }
  body.issue-body:not(.claim-mode) .code-slot.filled{font-size:25px!important;}
  body.issue-body:not(.claim-mode) .virtual-code-mini-actions{
    width:100%!important;
    grid-template-columns:1fr 1fr!important;
    gap:7px!important;
  }
  body.issue-body:not(.claim-mode) .mini-code-btn{
    min-height:38px!important;
    height:38px!important;
    font-size:12px!important;
  }
  body.issue-body:not(.claim-mode) .keypad-stage-title{
    min-height:32px!important;
    margin-bottom:6px!important;
    padding:5px 8px!important;
  }
  body.issue-body:not(.claim-mode) .keypad-stage-title span{font-size:11.5px!important;}
  body.issue-body:not(.claim-mode) .keypad-row{gap:6px!important;}
  body.issue-body:not(.claim-mode) .keypad-key{
    min-height:62px!important;
    height:62px!important;
    border-radius:12px!important;
    font-size:25px!important;
  }
  body.issue-body:not(.claim-mode) .quick-code-rule{margin-top:6px!important;font-size:10px!important;}
}
@media(max-width:380px){
  body.issue-body:not(.claim-mode) .quick-code-slots{gap:6px!important;}
  body.issue-body:not(.claim-mode) .code-slot{height:50px!important;}
  body.issue-body:not(.claim-mode) .keypad-row{gap:5px!important;}
  body.issue-body:not(.claim-mode) .keypad-key{height:58px!important;min-height:58px!important;font-size:23px!important;}
}

/* Ver 2.2.7: A-J / 0-9 各 10 鍵，5 欄自動換成兩排。 */
body.issue-body:not(.claim-mode) .keypad-row{row-gap:8px!important;}
@media(max-width:560px){body.issue-body:not(.claim-mode) .keypad-row{row-gap:6px!important;}}
