/* Original visual reference: huayang.hbhuayang.com.
   Original stylesheet credits: W3layouts, https://w3layouts.com,
   Creative Commons Attribution 3.0, https://creativecommons.org/licenses/by/3.0/ */
* { margin: 0; padding: 0; }
html { min-height: 100%; background: #081633 url('assets/bj.jpg') no-repeat center center fixed; background-size: 100% 100%; }
body { color: #333; font: 14px "Microsoft YaHei", sans-serif; }
.spacer { margin-top: 8%; min-height: 70px; }
.card { width: 380px; min-height: 260px; margin: 0 auto 36px; padding: 40px 60px 60px; background: #fff; border-radius: 20px; box-shadow: 0 5px 10px rgb(0 0 0 / 50%); }
.brand { text-align: center; margin-bottom: 5%; }
.brand img { max-width: 100%; height: auto; border: 0; }
h1 { margin: 10px 0 20px 15px; color: #7d7d7d; font: 18px Montserrat, sans-serif; line-height: 25px; }
h1::before { content: '\00a0'; }
input[type='text'] { box-sizing: border-box; width: 100%; padding: 15px; border: 1px solid #7d7d7d; font: 14px Arial, sans-serif; margin-bottom: 20px; border-radius: 25px; background: #fff; }
input[type='submit'] { box-sizing: border-box; width: 100%; margin-top: 15px; padding: 13px 0; border: 0; border-radius: 25px; background: #ca1622; color: #fff; font: 16px Arial, sans-serif; line-height: 22.5px; cursor: pointer; transition: background .2s; }
input[type='submit']:hover { background: #081148; }
input:focus-visible, #result a:focus-visible { outline: 2px solid #00479d; outline-offset: 3px; }
input:disabled { opacity: .65; cursor: wait; }
#result:not(:empty) { margin-top: 20px; line-height: 1.6; overflow-wrap: anywhere; }
#result a { display: block; border-radius: 25px; padding: 13px 0; background: #00479d; color: #fff; text-align: center; text-decoration: none; font-size: 16px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@media (max-width: 1440px) { .card { box-sizing: border-box; width: 40%; padding: 73px; } }
@media (max-width: 1366px) { .card { width: 38%; padding: 50px; } input[type='text'] { padding: 8px 15px; margin-bottom: 10px; height: 34px; } }
@media (max-width: 1280px) { .card { width: 40%; } }
@media (max-width: 1080px) { .card { width: 70%; padding: 60px; } }
@media (max-width: 991px) { .card { width: 85%; padding: 50px; } }
@media (max-width: 600px) { .spacer { margin-top: 8%; min-height: 40px; } .card { width: calc(100% - 32px); padding: 36px 24px; } h1 { margin-left: 0; font-size: 16px; } h1::before { content: none; } input[type='text'] { height: 42px; } }
/* 查询结果：失败文字紧随查询按钮，成功按钮间隔25px。 */
#result:not(:empty) { margin-top: 0; line-height: normal; }
.result-button { display: block; box-sizing: border-box; width: 100%; margin-top: 25px; padding: 13px 0; border: none; border-radius: 25px; background: #00479d; color: #fff; font: 16px Arial, sans-serif; line-height: 22.5px; text-align: center; cursor: pointer; }
.result-button:hover { background: #003679; }
.result-button:focus-visible { outline: 2px solid #00479d; outline-offset: 3px; }
/* 手机竖屏：按照原版截图的卡片宽度与顶部位置还原。 */
@media (max-width: 600px) {
  .spacer { margin-top: 0; min-height: 0; height: 10.7svh; }
  .card { box-sizing: border-box; width: 87.5%; margin: 0 auto 36px; padding: 8.8vw; border-radius: 4vw; min-height: 0; }
  .brand img { width: 100%; }
  h1 { margin: 10px 0 20px 15px; font-size: clamp(12px, 3.6vw, 18px); line-height: 1.4; }
  h1::before { content: '\00a0'; }
  input[type='text'] { height: 8.4vw; min-height: 32px; padding: 8px 2.6vw; margin-bottom: 2vw; font-size: clamp(12px, 2.8vw, 14px); }
  input[type='submit'], .result-button { font-size: clamp(13px, 3.2vw, 16px); padding: 2.5vw 0; line-height: 1.35; }
  input[type='submit'] { margin-top: 3vw; }
}