:root { --query-blue: #0b87ff; --query-green: #009688; }
* { box-sizing: border-box; }
html, body { min-width: 1020px; min-height: 100%; }
body { margin: 0; font-family: "Helvetica Neue", Helvetica, "PingFang SC", Tahoma, Arial, sans-serif; color: #333; }
button, input { font: inherit; }
button { cursor: pointer; }
button:focus-visible, a:focus-visible { outline: 2px solid #006bce; outline-offset: 3px; }
input:focus-visible { border-color: #1e9fff !important; outline: 1px solid #1e9fff; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.text-button, .header-button { padding: 0; border: 0; background: none; color: inherit; }
.login-page { background: #f0f0f0 url("bg.jpg") no-repeat left top; }
.login-page .container { min-height: max(100vh, 760px); }
.login-shell { width: 1020px; margin: 0 auto; }
.login-panel { margin-top: 80px; background: #fff; }
.notice-box { margin-top: 20px; }
.notice-heading { position: relative; }
.notice-heading h2, .tips-box h2 { display: inline; font-size: 18px; font-weight: 700; color: var(--query-blue); }
.notice-more { position: absolute; right: -20px; font-weight: 700; font-size: 15px; color: #01aaed; }
.notice-list .title { max-width: 350px; font-size: 15px; color: #333; }
.notice-list .date { position: absolute; right: 0; color: red; font-size: 14px; }
.tips-box { margin-top: -20px; }
.tips-box p { margin-top: 5px; font-size: 15px; color: #333; white-space: nowrap; }
.tips-box p:first-of-type { margin-top: 10px; }
.login-page .tips-box p a:not(.layui-btn) { color: #0000ff; }
.login-divider { width: 2px; height: 323px; margin: 50px auto; background: #d9d9d9; }
#login-title { margin-top: 20px; padding-bottom: 20px; color: var(--query-blue); font-size: 30px; font-weight: 700; }
.login-page input::placeholder { color: #ccc; font-size: 12px; opacity: 1; }
.captcha-column { padding-left: 10px; }
.captcha-button { width: 100%; height: 38px; display: block; padding: 0; border: 0; background: #ebd5eb; overflow: hidden; }
#captcha-image { display: block; width: 100%; height: 38px; }
.login-shortcuts { display: flex; align-items: flex-start; padding-top: 10px; }
.shortcut { flex: 1; display: flex; flex-direction: column; align-items: center; padding: 0; border: 0; background: none; color: #333; line-height: 22px; }
.shortcut img { display: block; }
.nonofficial-note { font-size: 14px; color: #555; }
.certificates-page { min-width: 1280px; background: #fef6f2; }
.query-header { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 0 32px; height: 60px; line-height: normal; }
.query-brand { display: flex; align-items: center; gap: 16px; }
.query-brand h1 { margin: 0; font-size: 32px; font-weight: 400; color: #fff; white-space: nowrap; }
.nonofficial-badge { padding: 3px 7px; border: 1px solid rgba(255, 255, 255, .8); border-radius: 2px; color: #fff; font-size: 12px; white-space: nowrap; }
.query-account { display: flex; align-items: center; gap: 5px; color: #fff; font-size: 14px; }
#account-name { display: inline-block; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
.account-separator { margin: 0 5px; opacity: .75; }
.header-button { color: #fff; white-space: nowrap; }
.power-icon { width: 14px; height: 14px; vertical-align: -2px; }
.query-main { padding: 0 32px 40px; }
.query-toolbar { display: flex; align-items: flex-start; justify-content: space-between; height: 96px; padding: 0 22px; }
.active-query-tab { margin-top: 0; padding: 22px 20px 14px; border-bottom: 4px solid #1e9fff; font-size: 16px; font-weight: 700; line-height: 20px; }
.account-actions { display: flex; align-items: center; gap: 42px; padding-top: 24px; font-size: 14px; font-weight: 700; }
.certificate-table { width: 100%; margin: 0; table-layout: fixed; background: #fff; }
.certificate-table th, .certificate-table td { height: 54px; padding: 9px 8px; text-align: center; font-size: 14px; font-weight: 400; }
.certificate-table thead tr { background: #f2f2f2; }
.certificate-table tbody tr:hover { background: #fff; }
.col-index { width: 7%; }
.col-name, .col-batch, .col-number { width: 23.333%; }
.col-status { width: 9%; }
.col-actions { width: 14%; }
.certificate-number { white-space: nowrap; font-variant-numeric: tabular-nums; }
.certificate-actions { white-space: nowrap; }
.certificate-actions .layui-btn { padding: 0 8px; height: 24px; line-height: 24px; font-size: 12px; border-radius: 0; }
.certificate-actions .layui-btn + .layui-btn { margin-left: 8px; }
.site-dialog { width: 520px; max-width: 90%; margin: auto; padding: 0; border: 1px solid #ddd; background: #fff; color: #333; box-shadow: 0 4px 22px rgba(0, 0, 0, .18); font-size: 15px; }
.site-dialog::backdrop { background: rgba(0, 0, 0, .3); }
.dialog-heading { display: flex; align-items: center; justify-content: space-between; padding: 14px 20px; border-bottom: 1px solid #eee; background: #f8f8f8; }
.dialog-heading h2 { font-size: 17px; font-weight: 400; }
.dialog-close { border: 0; background: none; color: #666; font-size: 26px; line-height: 22px; }
.dialog-content { padding: 24px; white-space: pre-line; line-height: 1.9; overflow-wrap: anywhere; }
.dialog-actions { display: flex; gap: 10px; justify-content: flex-end; padding: 0 20px 20px; }
.detail-disclaimer { margin-bottom: 18px; color: #666; font-size: 13px; }
.certificate-dialog { width: 1100px; max-height: 96vh; overflow-y: auto; }
.certificate-image-container { padding: 16px 20px 20px; }
.certificate-image-container .detail-disclaimer { margin-bottom: 12px; }
.certificate-image { display: block; width: 100%; height: auto; max-height: calc(96vh - 195px); object-fit: contain; }
.phone-input { margin-top: 8px; }
.local-note { margin-top: 10px; color: #888; font-size: 13px; }
.site-toast { position: fixed; left: 50%; top: 40%; z-index: 100; transform: translate(-50%, -50%); padding: 14px 24px; background: rgba(0, 0, 0, .75); color: #fff; font-size: 16px; }
@media print {
  .query-account, .account-actions, .certificate-actions, dialog, .site-toast { display: none !important; }
  .query-header { background: #137bbb !important; print-color-adjust: exact; }
  .nonofficial-badge { border-color: #333; color: #333; }
}