#contact-dialog:not([open]){display:none}
#contact-dialog{position:fixed;inset:0;display:block;width:min(720px,calc(100% - 24px));max-height:calc(100svh - 32px);margin:auto;padding:0;border:1px solid #4c5954;border-radius:16px;background:#1c2724;color:var(--cream);overflow-y:auto;overscroll-behavior:contain;box-shadow:0 24px 90px #0005}
#contact-dialog::backdrop{background:rgba(15,23,20,.6)}
.contact-dialog-header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 20px;background:#1c2724;border-bottom:1px solid #4c5954}
#contact-dialog-title{margin:0;font:600 20px/1.4 "Segoe UI","Microsoft YaHei",sans-serif;letter-spacing:0}
.contact-dialog-close{width:44px;height:44px;flex:none;border:1px solid #68766e;border-radius:50%;background:transparent;color:var(--cream);font:28px/1 sans-serif;cursor:pointer;touch-action:manipulation}
.contact-dialog-close:focus-visible{outline:2px solid #f1b49b;outline-offset:3px}
#contact-dialog .contact-board{opacity:1;transform:none;transition:none;display:grid;grid-template-columns:minmax(0,1fr);gap:0;padding:20px;border:0;border-radius:0}
#contact-dialog .contact-hook p{font-size:25px}
#contact-dialog .contact-hook{padding-bottom:20px}
#contact-dialog .wechat-qr{width:156px;margin:20px auto 0}
#contact-dialog .contact-socials{font-size:10px;line-height:1.7}
@media(min-width:640px){#contact-dialog .contact-board{grid-template-columns:minmax(0,1fr) 180px;gap:0 24px;padding:24px}#contact-dialog .wechat-qr{width:180px;margin:0}#contact-dialog .contact-hook,#contact-dialog .contact-socials{grid-column:1/-1}}