/* Shared contact appearance; each page keeps its own text and behavior. Production CSS stays untouched. */
:is(.home-index-page,.browse-page,.product-page) #contact{
  --line:#dce5f0;--muted:#60728d;
  width:min(760px,calc(100% - 40px));max-width:none;max-height:calc(100dvh - 40px);
  border:1px solid #dce5f0;border-radius:22px;background:#fff;color:#203759;
  box-shadow:0 24px 80px #142e5940;font-family:'PingFang SC','Microsoft YaHei',system-ui,sans-serif;
}
:is(.home-index-page,.browse-page,.product-page) #contact::backdrop{background:rgb(22 39 67 / 45%);backdrop-filter:blur(4px)}
:is(.home-index-page,.browse-page,.product-page) #contact .dialog-shell{max-height:calc(100dvh - 42px)}
:is(.home-index-page,.browse-page,.product-page) #contact .dialog-header{padding:26px 28px 22px;background:#f4f7fc;border-color:#dce5f0}
:is(.home-index-page,.browse-page,.product-page) #contact .dialog-header h2{font-family:inherit;font-size:28px;line-height:1.4;font-weight:700;letter-spacing:-.02em;color:#203759}
:is(.home-index-page,.browse-page,.product-page) #contact .dialog-header p{color:#60728d}
:is(.home-index-page,.browse-page,.product-page) #contact .close{background:#fff;color:#36527c;border:1px solid #d7e1ef;border-radius:12px;box-shadow:none}
:is(.home-index-page,.browse-page,.product-page) #contact .dialog-scroll{padding:26px 28px;min-height:0}
:is(.home-index-page,.browse-page,.product-page) #contact .contact-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:28px}
:is(.home-index-page,.browse-page,.product-page) #contact .contact-grid figure{margin:0;width:100%;max-width:228px;padding:12px;border:1px solid #e0e7f1;border-radius:16px;background:#fff}
:is(.home-index-page,.browse-page,.product-page) #contact .contact-grid img{display:block;width:100%;height:auto}
.product-page #contact .contact-grid img{aspect-ratio:1;object-fit:contain;background:none}
:is(.home-index-page,.browse-page,.product-page) #contact .button{background:#244c91;color:#fff;border:1px solid #244c91;border-radius:12px;box-shadow:none;min-height:44px}
:is(.home-index-page,.browse-page,.product-page) #contact .button:hover{background:#1c3e78;border-color:#1c3e78}
:is(.home-index-page,.browse-page,.product-page) #contact .contact-note{border-color:#dce5f0;color:#60728d}
:is(.home-index-page,.browse-page,.product-page) #contact :is(button,a):focus-visible{outline:3px solid #6a9fe8;outline-offset:3px}
@media(max-width:600px){
  :is(.home-index-page,.browse-page,.product-page) #contact{width:calc(100% - 24px);max-height:calc(100dvh - 24px);border-radius:18px}
  :is(.home-index-page,.browse-page,.product-page) #contact .dialog-shell{max-height:calc(100dvh - 26px)}
  :is(.home-index-page,.browse-page,.product-page) #contact .dialog-header{padding:18px 18px 16px;gap:12px}
  :is(.home-index-page,.browse-page,.product-page) #contact .dialog-header h2{font-size:23px}
  :is(.home-index-page,.browse-page,.product-page) #contact .dialog-scroll{padding:20px 18px}
  :is(.home-index-page,.browse-page,.product-page) #contact .contact-grid{grid-template-columns:minmax(0,1fr);gap:22px}
  :is(.home-index-page,.browse-page,.product-page) #contact .contact-grid figure{max-width:190px}
}

/* Purchase and custom-courseware channels share the existing contact dialog. */
:is(.home-index-page,.browse-page,.product-page) #contact .contact-channels{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:20px;margin-top:18px}
#contact .contact-channel{min-width:0;padding:18px;border:1px solid #dce5f0;border-radius:16px;background:#f8faff}
#contact .contact-channel h3{margin:0;color:#203759;font:700 19px/1.5 'PingFang SC','Microsoft YaHei',system-ui,sans-serif}
#contact .contact-channel-intro{margin:8px 0 16px;color:#60728d;font-size:14px;line-height:1.7;min-height:48px}
:is(.home-index-page,.browse-page,.product-page) #contact .contact-channel figure{box-sizing:border-box;max-width:228px;margin:0 auto;padding:10px}
#contact .contact-account,#contact .contact-channel-help{margin:14px 0 0;color:#60728d;font-size:13px;line-height:1.7;overflow-wrap:anywhere}
#contact .contact-channel dl{margin:14px 0;grid-template-columns:36px minmax(0,1fr);gap:6px 10px}
#contact .contact-channel dd{font-size:15px;overflow-wrap:anywhere}
#contact .contact-xhs-code{position:relative;aspect-ratio:1;overflow:hidden;background:#fff}
:is(.home-index-page,.browse-page,.product-page) #contact .contact-xhs-code img{position:absolute;left:-9.5%;top:-7.14%;width:117.5%;max-width:none;height:auto;aspect-ratio:auto;object-fit:initial}
@media(max-width:600px){
  :is(.home-index-page,.browse-page,.product-page) #contact .contact-channels{grid-template-columns:minmax(0,1fr);gap:16px}
  #contact .contact-channel-intro{min-height:0}
}

#contact .contact-buy-keyword{margin:0 0 16px;padding:10px 12px;border-radius:10px;background:#edf3fc;color:#36527c;font-size:14px;line-height:1.75}
#contact .contact-buy-keyword strong{font-weight:700;color:#244c91}

#contact .contact-buy-keyword .contact-follow-offer{display:block;margin-bottom:4px;font-size:16px}

/* Single WeChat contact for custom courseware and business enquiries. */
:is(.home-index-page,.browse-page,.product-page) #contact .contact-cooperation{grid-template-columns:minmax(0,1fr) 228px;align-items:center;gap:28px}
#contact .contact-cooperation .contact-lead{margin-top:0;font-size:17px;line-height:1.8}
#contact .contact-cooperation dl{display:grid;grid-template-columns:44px minmax(0,1fr);gap:10px;margin:20px 0}
#contact .contact-cooperation dd{margin:0}
#contact .contact-cooperation figcaption{margin-top:10px;text-align:center;font-size:14px}
#contact .contact-cooperation .copy-feedback:empty{display:none}
.revision-history{margin-bottom:56px;border-top:1px solid #dce5f0;padding-top:24px}
.revision-history summary{cursor:pointer;font-size:18px;color:#284e93}
.revision-history .revision-log{padding-top:24px}
@media(max-width:600px){:is(.home-index-page,.browse-page,.product-page) #contact .contact-cooperation{grid-template-columns:minmax(0,1fr);gap:20px}#contact .contact-cooperation figure{max-width:210px}}
