/* Compact friend cards follow https://evan.top/index.php?view=friends. */
[data-neighbor-page] { --neighbor-font: var(--font-body); }
[data-neighbor-page] .collection-intro { margin: 0 0 22px; max-width: none; font: 400 14px/1.8 var(--neighbor-font); }
[data-neighbor-page] .link-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; max-width: none; }
[data-neighbor-page] .link-card { grid-template-columns: 36px minmax(0,1fr); gap: 13px; min-height: 76px; padding: 14px; border: 1px solid color-mix(in srgb,var(--ink) 7%,var(--paper)); border-radius: var(--radius); background: var(--paper); font-family: var(--neighbor-font); transition: border-color .2s,background .2s; }
[data-neighbor-page] .link-card:hover { transform: none; border-color: color-mix(in srgb,var(--accent) 35%,var(--paper)); background: color-mix(in srgb,var(--accent) 2%,var(--paper)); }
[data-neighbor-page] .link-card img,[data-neighbor-page] .link-card-mark { width: 36px; height: 36px; padding: 2px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--paper); object-fit: cover; }
[data-neighbor-page] .link-card-mark { font: 500 16px/1 var(--neighbor-font); }
[data-neighbor-page] .link-card-name { display: flex; min-width: 0; align-items: center; gap: 8px; }
[data-neighbor-page] .link-card strong { min-width: 0; font: 500 16px/1.5 var(--font-heading); }
[data-neighbor-page] .link-card-name svg { flex-shrink: 0; width: 12px; height: 12px; color: var(--muted); }
[data-neighbor-page] .link-card small { display: block; margin-top: 3px; font: 400 13px/1.5 var(--neighbor-font); white-space: nowrap; text-overflow: ellipsis; }
[data-neighbor-page] .link-card:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

/* Keep the existing site information and native comments. */
.neighbor-site {
    max-width: none;
    margin: 36px 0 0;
    padding-top: 26px;
    border-top: 1px solid var(--line);
    font: 400 14px/1.8 var(--neighbor-font);
}

.neighbor-site > h2 {
    margin: 0;
    font: 500 18px/1.6 var(--font-heading);
}

.neighbor-site-info {
    margin: 20px 0 0;
}

.neighbor-site-info > div {
    display: grid;
    grid-template-columns: 3em minmax(0, 1fr);
    gap: 16px;
    margin-bottom: 10px;
}

.neighbor-site-info > div:last-child {
    margin-bottom: 0;
}

.neighbor-site-info dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.neighbor-site-info a:focus-visible {
    outline: 2px solid var(--accent);
    outline-offset: 4px;
}

[data-neighbor-page] .comments { max-width: none; }
@media(max-width:1000px) { [data-neighbor-page] .link-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) {
    [data-neighbor-page] .link-grid { grid-template-columns: minmax(0,1fr); gap: 12px; }
    [data-neighbor-page] .link-card { padding: 15px 16px; }
}
@media(prefers-reduced-motion:reduce) { [data-neighbor-page] .link-card { transition: none; } }

