/* Popups and top-right buttons: Share window, Message window, header buttons. Flat colors only. */

/* header buttons (top right, on every tab) */
.top{position:relative}
.topbtns{position:absolute;top:14px;right:16px;display:flex;gap:8px}
.topbtns button{width:42px;height:42px;border-radius:50%;border:1.5px solid #3a3a3a;background:#0a0a0a;color:#fff;font-size:1rem;cursor:pointer;transition:.15s}
.topbtns button:hover{background:var(--red);border-color:var(--red)}

/* popup windows */
dialog.pop{max-width:560px}
dialog.pop h2{font-size:1.4rem;margin-bottom:6px}
.popfoot{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}.popfoot .btn{margin-top:0}
#contactForm{margin-top:14px}

/* share window */
.sharegrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:16px 0}
.sharegrid a{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 4px;border-radius:12px;background:#000;border:1px solid var(--line);color:#fff;text-decoration:none;font-size:.78rem;font-weight:700;transition:.15s}
.sharegrid a:hover{border-color:var(--red);background:#150305}.sharegrid i{font-size:1.4rem}
.copyrow{display:flex;gap:8px;margin-bottom:14px}.copyrow input{flex:1;min-width:0}.copyrow .btn{margin-top:0;padding:10px 16px}

@media(max-width:700px){.top{padding-top:64px}}
@media(max-width:600px){.sharegrid{grid-template-columns:repeat(3,1fr)}.topbtns{top:10px;right:10px}.topbtns button{width:38px;height:38px}}