* { box-sizing: border-box; }
body { margin: 0; font-family: "Microsoft YaHei", Arial, sans-serif; color: #1f2933; }
.certificate-query-page { min-height: 100vh; background: linear-gradient(140deg, #667eea 0%, #764ba2 100%); }
.query-shell { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 52px 24px; }
.query-card { width: min(600px, 100%); min-height: 640px; background: #fff; border-radius: 18px; padding: 74px 50px 44px; text-align: center; box-shadow: 0 18px 60px rgba(35, 31, 80, .22); }
.query-logo { display: block; width: auto; max-width: 168px; max-height: 86px; margin: 0 auto 28px; object-fit: contain; }
.query-card h1 { margin: 0 0 14px; font-size: 32px; line-height: 1.25; color: #222; font-weight: 700; }
.query-card p { margin: 0 0 42px; color: #9aa4b2; font-size: 17px; }
.query-form { text-align: left; }
.query-form label { display: block; margin-bottom: 24px; font-size: 16px; color: #2f3742; }
.query-form label span { display: block; margin-bottom: 12px; }
.query-form input { width: 100%; height: 60px; border: 2px solid #e5e7eb; border-radius: 12px; padding: 0 20px; font-size: 18px; outline: none; transition: border-color .2s, box-shadow .2s; }
.query-form input:focus { border-color: #6b7af0; box-shadow: 0 0 0 4px rgba(103, 126, 234, .12); }
.captcha-row { display: grid; grid-template-columns: 1fr 158px; gap: 14px; align-items: center; }
.captcha-row img { width: 158px; height: 60px; object-fit: cover; border-radius: 12px; cursor: pointer; border: 1px solid #e5e7eb; }
.query-form button, .download-btn { border: 0; text-decoration: none; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.query-form button { width: 100%; height: 66px; margin-top: 14px; border-radius: 10px; color: #fff; font-size: 20px; font-weight: 700; background: linear-gradient(90deg, #667eea 0%, #764ba2 100%); }
.query-footer { margin-top: 26px; text-align: center; color: #98a2b3; font-size: 13px; line-height: 1.7; }
.query-footer h6 { margin: 2px 0; color: inherit; font-size: inherit; line-height: inherit; font-weight: 400; }
.query-helper { margin-top: 26px; color: #9aa4b2; text-align: center; }
.query-helper::first-letter { color: inherit; }
.query-card footer { margin-top: 44px; color: #b3bac5; font-size: 14px; line-height: 1.7; }
.certificate-detail-page { min-height: 100vh; background: #f4f7fb; padding: 44px 16px; }
.result-shell { width: min(980px, 100%); margin: 0 auto; }
.result-card { background: #fff; border: 1px solid #e4e9f0; border-radius: 8px; box-shadow: 0 18px 50px rgba(26, 38, 55, .08); overflow: hidden; }
.result-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding: 32px 34px 28px; border-bottom: 1px solid #edf1f6; background: #fbfcfe; }
.result-kicker { display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; background: #e8f7ef; color: #17834e; font-size: 13px; font-weight: 700; }
.result-header h1 { margin: 14px 0 8px; font-size: 30px; line-height: 1.25; letter-spacing: 0; color: #152033; }
.result-header p { margin: 0; color: #64748b; font-size: 16px; }
.result-header strong { color: #152033; }
.result-header-actions { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; }
.poetry-btn, .verify-badge { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; height: 38px; min-width: 92px; padding: 0 14px; border-radius: 6px; text-decoration: none; font-size: 15px; line-height: 1; font-weight: 700; white-space: nowrap; }
.poetry-btn { border: 1px solid #2563eb; background: #2563eb; color: #fff; }
.poetry-btn:hover { background: #1d4ed8; border-color: #1d4ed8; color: #fff; }
.verify-badge { border: 1px solid #11a36a; background: #11a36a; color: #fff; }
.result-layout { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 28px; padding: 30px 34px 0; }
.info-section h2 { margin: 0 0 14px; font-size: 18px; line-height: 1.35; color: #152033; }
.info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.info-item { min-height: 68px; border: 1px solid #e6ebf2; border-radius: 6px; padding: 12px 14px; background: #fff; display: flex; flex-direction: column; justify-content: center; }
.info-item span { margin-bottom: 6px; color: #7a8699; font-size: 13px; line-height: 1.2; }
.info-item strong { color: #1d2939; font-size: 16px; line-height: 1.45; font-weight: 600; word-break: break-word; }
.info-item.wide { grid-column: span 2; }
.asset-panel { display: grid; grid-template-columns: 1fr; gap: 14px; align-content: start; }
.photo-card, .qr-card { border: 1px solid #e6ebf2; border-radius: 6px; background: #fbfcfe; display: flex; align-items: center; justify-content: center; }
.photo-card { min-height: 168px; color: #98a2b3; font-size: 15px; }
.photo-card img { width: 132px; max-height: 154px; object-fit: cover; border-radius: 4px; }
.qr-card { min-height: 184px; flex-direction: column; gap: 10px; color: #64748b; font-size: 14px; }
.qr-card img { width: 126px; height: 126px; object-fit: contain; }
.certificate-section { padding: 24px 34px 0; }
.certificate-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.certificate-grid .wide { grid-column: span 4; }
.result-actions { display: flex; justify-content: flex-end; gap: 12px; padding: 28px 34px 34px; }
.result-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 108px; height: 42px; padding: 0 18px; border: 1px solid #d5dce7; border-radius: 6px; color: #334155; background: #fff; text-decoration: none; font-size: 15px; font-weight: 700; }
.result-btn.primary { border-color: #2563eb; background: #2563eb; color: #fff; }
.certificate-print-page { background: #edf2f7; padding: 40px 16px; }
.print-sheet { width: min(860px, 100%); margin: 0 auto; background: #fff; border: 1px solid #d7dee8; padding: 42px; color: #222; }
.print-sheet h1 { margin: 0 0 32px; text-align: center; font-size: 32px; }
.print-grid { display: grid; grid-template-columns: 180px 1fr 160px; gap: 28px; align-items: center; }
.print-photo img, .print-qr img { width: 100%; object-fit: contain; }
.print-photo img { max-height: 240px; object-fit: cover; }
.print-info p { margin: 0 0 14px; font-size: 18px; }
.print-qr { text-align: center; }
.print-qr span { display: block; margin-top: 10px; color: #64748b; }
.print-btn { display: block; width: 160px; height: 44px; margin: 34px auto 0; border: 0; border-radius: 6px; background: #0f766e; color: #fff; font-size: 17px; cursor: pointer; }
@media (max-width: 720px) {
  .query-shell { padding: 24px 14px; }
  .query-card { min-height: auto; padding: 46px 22px 30px; border-radius: 16px; }
  .query-card h1 { font-size: 28px; }
  .captcha-row { grid-template-columns: minmax(0, 1fr) 128px; gap: 10px; }
  .captcha-row input { height: 54px; font-size: 16px; padding: 0 14px; }
  .captcha-row img { width: 128px; height: 54px; border-radius: 10px; }
  .certificate-detail-page { padding: 18px 12px; }
  .result-header { flex-direction: column; padding: 24px 20px 22px; }
  .result-header h1 { font-size: 25px; }
  .result-header-actions { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  .poetry-btn, .verify-badge { height: 34px; min-width: 86px; }
  .result-layout { grid-template-columns: 1fr; gap: 18px; padding: 22px 20px 0; }
  .info-grid, .certificate-grid { grid-template-columns: 1fr; }
  .info-item.wide, .certificate-grid .wide { grid-column: span 1; }
  .asset-panel { grid-template-columns: 1fr 1fr; }
  .photo-card, .qr-card { min-height: 160px; }
  .qr-card img { width: 104px; height: 104px; }
  .certificate-section { padding: 22px 20px 0; }
  .result-actions { flex-direction: column; padding: 24px 20px 28px; }
  .result-btn { width: 100%; }
  .print-sheet { padding: 26px 18px; }
  .print-grid { grid-template-columns: 1fr; }
}
@media (max-width: 380px) {
  .captcha-row { grid-template-columns: minmax(0, 1fr) 112px; gap: 8px; }
  .captcha-row img { width: 112px; height: 50px; }
  .captcha-row input { height: 50px; }
}

@media print {
  body { background: #fff !important; padding: 0 !important; }
  .print-sheet { border: 0; width: 100%; }
  .print-btn { display: none; }
}