.modal{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;padding:16px}
.modal.open{display:flex}
.modal .bg{position:absolute;inset:0;background:rgba(17,17,16,.6);backdrop-filter:blur(4px)}
.modal .box{position:relative;background:var(--white);color:var(--text);border-radius:20px;padding:28px;width:min(460px,100%);box-shadow:0 30px 80px rgba(0,0,0,.35);display:flex;flex-direction:column;gap:16px;max-height:calc(100vh - 32px);overflow:auto}
.modal .x{position:absolute;right:14px;top:14px;width:36px;height:36px;border-radius:99px;display:grid;place-items:center;color:var(--muted)}
.modal .x:hover{background:var(--paper);color:var(--text)}
.modal .x svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8}
.modal h3{font-size:26px;letter-spacing:-.02em;padding-right:40px}
.modal .p{color:var(--muted);font-size:15px}
.bubble{background:var(--paper);border-radius:14px 14px 14px 4px;padding:14px 16px;font-size:15px;position:relative}
.bubble small{display:block;font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.06em;text-transform:uppercase;margin-bottom:6px}
.msgs{display:flex;flex-direction:column;gap:8px}
.msgs a{display:flex;align-items:center;gap:14px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;font-size:16px;font-weight:500;transition:.2s}
.msgs a:hover{border-color:var(--text)}
.msgs a i{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex:none}
.msgs a i svg{width:20px;height:20px;fill:#fff}
.msgs a span{flex:1}
.msgs a em{font-style:normal;color:var(--muted);font-size:13px;font-weight:400}
.modal .call{font-size:14px;color:var(--muted);text-align:center}
.modal .call a{color:var(--text);font-weight:500}