.yy-contact-main > :not(.yy-contact-host) { display:none !important; }
.yy-contact-mode a[data-sidebar="menu-button"][href="/profile"] { background:transparent !important; color:var(--sidebar-foreground); font-weight:400 !important; }
[data-yy-contact-nav] > svg { width:16px; height:16px; flex-shrink:0; }
.yy-contact-host { min-height:0; flex:1; overflow:auto; color:var(--foreground); }
.yy-contact-page { max-width:1120px; margin:0 auto; padding:24px; }
.yy-contact-page-heading { margin-bottom:20px; }
.yy-contact-page-heading h1 { font-size:24px; line-height:1.35; font-weight:650; letter-spacing:-.025em; margin:0 0 6px; }
.yy-contact-page-heading p,.yy-contact-person header p,.yy-contact-group-copy > p { color:var(--muted-foreground); font-size:13px; line-height:1.6; margin:0; }
.yy-contact-card { background:var(--card); border:1px solid var(--border); border-radius:var(--radius-lg,12px); box-shadow:0 1px 2px #00000003; }
.yy-contact-title { display:flex; align-items:center; gap:9px; }
.yy-contact-title > svg { width:18px; height:18px; color:var(--muted-foreground); }
.yy-contact-title h2 { font-size:16px; line-height:1.4; font-weight:600; margin:0; }
.yy-contact-group { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:18px 24px; margin-bottom:20px; }
.yy-contact-group-copy > p { margin-top:7px; }
.yy-contact-group-account { display:flex; gap:10px; align-items:center; margin-top:12px; font-size:14px; }
.yy-contact-group-account span { color:var(--muted-foreground); font-size:12px; }
.yy-contact-group-account strong { font-weight:500; font-family:var(--font-mono,monospace); }
.yy-contact-people { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px; }
.yy-contact-person { min-width:0; overflow:hidden; }
.yy-contact-person > header { padding:18px 20px 14px; border-bottom:1px solid var(--border); }
.yy-contact-person header p { margin-top:5px; }
.yy-contact-channels { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); padding:18px 14px; gap:12px; }
.yy-contact-channel { min-width:0; display:flex; flex-direction:column; align-items:center; }
.yy-contact-channel + .yy-contact-channel { border-left:1px solid var(--border); padding-left:12px; }
.yy-contact-channel-heading { align-self:stretch; padding-left:6px; margin-bottom:10px; }
.yy-contact-platform { display:inline-block; font-size:12px; font-weight:500; color:var(--muted-foreground); }
.yy-contact-qr { display:block; position:relative; width:144px; max-width:100%; aspect-ratio:1; flex-shrink:0; padding:0; border:1px solid #ededed; border-radius:10px; overflow:hidden; background:#fff; cursor:zoom-in; }
.yy-contact-qr canvas { display:block; width:100%; height:100%; background:#fff; }
.yy-contact-group-qr { width:136px; }
.yy-contact-zoom-hint { position:absolute; left:0; right:0; bottom:0; font-size:11px; padding:4px; text-align:center; background:#0009; color:#fff; opacity:0; transition:opacity .15s; }
.yy-contact-qr:hover .yy-contact-zoom-hint,.yy-contact-qr:focus-visible .yy-contact-zoom-hint { opacity:1; }
.yy-contact-account { font-family:var(--font-mono,monospace); font-size:13px; line-height:1.6; margin-top:11px; max-width:100%; overflow-wrap:anywhere; user-select:all; }
.yy-contact-actions { display:flex; align-items:center; gap:8px; margin-top:12px; flex-wrap:wrap; }
.yy-contact-channel .yy-contact-actions { justify-content:center; gap:5px; }
.yy-contact-actions button,.yy-contact-dialog-actions button { display:inline-flex; align-items:center; justify-content:center; gap:6px; border:1px solid var(--border); border-radius:7px; background:var(--background); color:var(--foreground); padding:7px 10px; font-size:12px; line-height:1.2; font-weight:500; cursor:pointer; white-space:nowrap; }
.yy-contact-channel .yy-contact-actions button { padding:6px 7px; font-size:11px; gap:4px; }
.yy-contact-actions button > svg,.yy-contact-dialog-actions button > svg { width:13px; height:13px; }
.yy-contact-actions button:hover,.yy-contact-dialog-actions button:hover { background:var(--accent); }
.yy-contact-actions button[data-copied] { border-color:var(--primary); color:var(--primary); }
.yy-contact-host button:focus-visible,.yy-contact-dialog button:focus-visible { outline:2px solid var(--ring); outline-offset:3px; }
.yy-contact-toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%); z-index:20000; background:var(--foreground); color:var(--background); box-shadow:0 4px 20px #0002; padding:10px 16px; border-radius:9px; font-size:13px; max-width:calc(100vw - 32px); text-align:center; }
.yy-contact-toast[hidden] { display:none; }
.yy-contact-dialog { width:min(430px,calc(100vw - 32px)); max-height:calc(100svh - 32px); overflow:auto; margin:auto; border:1px solid var(--border); border-radius:16px; padding:20px; color:var(--foreground); background:var(--background); box-shadow:0 20px 70px #0004; }
.yy-contact-dialog::backdrop { background:#0008; backdrop-filter:blur(3px); }
.yy-contact-dialog-top { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.yy-contact-dialog h2 { margin:0; font-size:17px; font-weight:600; }
.yy-contact-icon-button { width:30px; height:30px; padding:5px; border:0; background:transparent; color:var(--muted-foreground); border-radius:6px; cursor:pointer; }
.yy-contact-icon-button svg { width:20px; height:20px; }
.yy-contact-large-qr { background:white; border-radius:12px; overflow:hidden; margin-top:18px; border:1px solid #ededed; }
.yy-contact-large-qr canvas { display:block; width:100%; height:auto; aspect-ratio:1; }
.yy-contact-dialog-account { font-family:var(--font-mono,monospace); font-size:14px; text-align:center; margin:14px 0; overflow-wrap:anywhere; }
.yy-contact-dialog-actions { display:flex; align-items:center; justify-content:center; gap:10px; }
@media(max-width:1050px) { .yy-contact-people { grid-template-columns:minmax(0,1fr); } .yy-contact-channels { padding:20px; gap:20px; } .yy-contact-qr { width:156px; } .yy-contact-group-qr { width:136px; } .yy-contact-channel .yy-contact-actions button { font-size:12px; padding:7px 10px; } }
@media(max-width:560px) { .yy-contact-page { padding:20px 14px; } .yy-contact-page-heading h1 { font-size:22px; } .yy-contact-group { padding:16px; gap:12px; } .yy-contact-group-qr { width:112px; } .yy-contact-group-copy > p { font-size:12px; max-width:170px; } .yy-contact-group .yy-contact-actions { gap:6px; } .yy-contact-actions button { font-size:11px; padding:6px 7px; } .yy-contact-person > header { padding:16px; } .yy-contact-channels { padding:16px 10px; gap:8px; } .yy-contact-channel + .yy-contact-channel { padding-left:8px; } .yy-contact-qr { width:138px; } .yy-contact-group-qr { width:112px; } .yy-contact-channel .yy-contact-actions { flex-direction:column; width:100%; gap:6px; } .yy-contact-channel .yy-contact-actions button { width:calc(100% - 8px); max-width:138px; font-size:11px; padding:7px 8px; } .yy-contact-account { font-size:12px; } }
@media(prefers-reduced-motion:reduce) { .yy-contact-zoom-hint { transition:none; } }