body { background: #fafaf7; }
.navbar-brand { letter-spacing: -0.02em; }

.item-card {
    transition: transform 0.15s, box-shadow 0.15s;
}
.item-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}

.item-name {
    font-family: Georgia, serif;
    font-weight: 600;
}

.history-note {
    border-left: 3px solid #d4b483;
    padding-left: 1rem;
    margin-bottom: 1.5rem;
}

.photo-thumb {
    object-fit: cover;
    width: 100%;
    height: 200px;
    border-radius: 4px;
}

.locked-marker {
    color: #aa6c39;
    font-size: 0.85em;
}

.visibility-public { color: #2c7a2c; }
.visibility-followers { color: #aa6c39; }
.visibility-private { color: #6c757d; }

/* Avatars */
.avatar {
    border-radius: 50%;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-weight: 600;
    flex-shrink: 0;
}
.avatar img { width: 100%; height: 100%; object-fit: cover; }
.avatar-sm { width: 32px; height: 32px; font-size: 0.85rem; }
.avatar-md { width: 48px; height: 48px; font-size: 1rem; }
.avatar-lg { width: 96px; height: 96px; font-size: 2rem; }
.avatar-xl { width: 160px; height: 160px; font-size: 3rem; }

/* Activity feed */
.feed-event {
    padding: 0.75rem 0;
    border-bottom: 1px solid #eee;
    display: flex;
    gap: 0.75rem;
}
.feed-event:last-child { border-bottom: none; }
.feed-event .feed-body { flex: 1; }
.feed-event .feed-time { color: #999; font-size: 0.8rem; }

/* Collection */
.collection-card {
    transition: transform 0.15s, box-shadow 0.15s;
}
.collection-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
}
.progress-bar-curator { background-color: #d4b483; }

/* @-mention tags rendered inside names */
.tag-mention {
    color: #8e6b3e;
    text-decoration: none;
    font-weight: 500;
}
.tag-mention:hover { text-decoration: underline; }

/* Links that must remain clickable on top of a Bootstrap .stretched-link card
   (mention links in names, curator links, etc.). The stretched-link ::after sits at
   z-index:1; these need to sit above it. */
.card .tag-mention,
.card .card-inner-link {
    position: relative;
    z-index: 2;
}

.pending-tag-banner {
    background: #fff3cd;
    border: 1px solid #ffe69c;
    border-radius: 6px;
    padding: 0.75rem 1rem;
    margin-bottom: 1rem;
}

/* Feed thumbnail (item-first event layout) */
.feed-thumb-link {
    flex-shrink: 0;
    display: block;
    width: 56px;
    height: 56px;
    border-radius: 6px;
    overflow: hidden;
}
.feed-thumb {
    width: 56px;
    height: 56px;
    object-fit: cover;
}
.feed-message a { color: #5d4a2f; font-weight: 500; text-decoration: none; }
.feed-message a:hover { text-decoration: underline; }