#contact-card-design { padding:32px 12px; }
#contact-card-design .contact-stage { width:100%; max-width:680px; margin:0 auto; container-type:inline-size; }
#contact-card-design .contact-panel { position:relative; overflow:hidden; display:flex; align-items:center; gap:28px; padding:32px; background:#ffffff; color:#182b43; border:1px solid #dbe7f6; border-radius:22px; box-shadow:0 12px 32px #2546750c; font-family:system-ui,"Microsoft YaHei",sans-serif; }
#contact-card-design .contact-panel::before { content:""; position:absolute; inset:0 auto 0 0; width:5px; background:#3189e8; }
#contact-card-design .contact-logo { display:block; width:110px; height:auto; flex:none; }
#contact-card-design .contact-copy { min-width:0; }
#contact-card-design .contact-eyebrow { font-size:11px; font-weight:600; letter-spacing:1.8px; color:#3a7abc; margin:0 0 8px; }
#contact-card-design .contact-title { font-size:22px; font-weight:650; line-height:1.4; margin:0 0 8px; }
#contact-card-design .contact-sub { font-size:14px; line-height:1.65; color:#617187; margin:0; }
#contact-card-design .contact-id { display:flex; align-items:center; flex-wrap:wrap; gap:9px; margin:16px 0 12px; }
#contact-card-design .contact-label { font-size:12px; color:#617187; }
#contact-card-design .contact-account { font-size:18px; font-weight:600; line-height:1.4; letter-spacing:.2px; color:#236ac0; overflow-wrap:anywhere; }
#contact-card-design .contact-note { font-size:12px; line-height:1.7; color:#738198; margin:0; }
@media (max-width: 500px) {
 #contact-card-design .contact-panel { align-items:flex-start; gap:16px; padding:24px 20px; border-radius:18px; }
 #contact-card-design .contact-logo { width:66px; margin-top:22px; }
 #contact-card-design .contact-title { font-size:18px; }
 #contact-card-design .contact-sub { font-size:13px; }
 #contact-card-design .contact-id { gap:4px 8px; margin:13px 0 10px; }
 #contact-card-design .contact-account { font-size:16px; }
}

#contact-card-design, #contact-card-design * { box-sizing:border-box; }
#contact-card-design { position:relative; width:100%; text-align:left; padding-bottom:max(32px, env(safe-area-inset-bottom)); }
#contact-card-design .contact-account { min-width:0; max-width:100%; user-select:all; }
body.contact-desktop .body { height:auto; min-height:80vh; gap:20px; padding:32px 0 16px; }
body.contact-mobile .wrap { overflow:hidden; background:#eef4fc; }
body.contact-mobile .bg { position:absolute; top:0; left:0; }
body.contact-mobile .flex-down { position:relative; top:auto; padding-top:33.015625%; }
body.contact-mobile #contact-card-design { padding-left:0; padding-right:0; }
@media (max-width:360px) {
  #contact-card-design .contact-panel { gap:12px; padding:20px 16px; }
  #contact-card-design .contact-logo { width:48px; }
  #contact-card-design .contact-title { font-size:17px; }
}