:root {
    --ss-icon-sm: 18px;
    --ss-icon-md: 20px;
    --ss-icon-lg: 22px;
    --ss-icon-xl: 28px;
    --ss-icon-button-size: 40px;
    --ss-icon-touch-size: 44px;
}

.ss-icon {
    display: block;
    width: var(--ss-icon-md);
    height: var(--ss-icon-md);
    flex: 0 0 auto;
    object-fit: contain;
}

.ss-icon--sm { width: var(--ss-icon-sm); height: var(--ss-icon-sm); }
.ss-icon--md { width: var(--ss-icon-md); height: var(--ss-icon-md); }
.ss-icon--lg { width: var(--ss-icon-lg); height: var(--ss-icon-lg); }
.ss-icon--xl { width: var(--ss-icon-xl); height: var(--ss-icon-xl); }

.ss-icon-button {
    display: inline-grid;
    place-items: center;
    width: var(--ss-icon-button-size);
    height: var(--ss-icon-button-size);
    min-width: var(--ss-icon-button-size);
    min-height: var(--ss-icon-button-size);
}

.ss-icon-button:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .24);
    outline-offset: 2px;
}

.ss-icon--decorative { pointer-events: none; }
.ss-icon--disabled { opacity: .45; }

@media (max-width: 768px), (pointer: coarse) {
    .ss-icon-button {
        width: var(--ss-icon-touch-size);
        height: var(--ss-icon-touch-size);
        min-width: var(--ss-icon-touch-size);
        min-height: var(--ss-icon-touch-size);
    }
}

/* R3 defensive icon sizing: live UI icons must never inherit source-export dimensions. */
.ss-card-action img,
.ss-post-action-btn img,
.ss-post-action-readonly img,
.ss-post-options-trigger img,
.ss-post-options-panel img,
.ss-comment-tool-btn img,
.ss-comment-submit-btn img,
.ss-comment-menu img,
.ss-feed-side-icon img,
.ss-suggested-icon-btn img,
.ss-suggested-dismiss img,
.ss-feed-provenance img,
.ss-post-provenance-trigger img,
.ss-source-trail-modal img,
.ss-source-trail-list img {
    max-width: var(--ss-icon-xl);
    max-height: var(--ss-icon-xl);
    object-fit: contain;
}

.ss-comment-tool-btn img,
.ss-comment-submit-btn img,
.ss-comment-menu img,
.ss-suggested-icon-btn img,
.ss-suggested-dismiss img {
    width: var(--ss-icon-md);
    height: var(--ss-icon-md);
}


/* R3-D2 broader defensive sizing for live action icons and suggested-connection media. */
.ss-feed-post-card img.ss-icon,
.ss-post-reader-card img.ss-icon,
.ss-comments-card img.ss-icon,
.ss-source-trail-modal img.ss-icon {
    max-width: var(--ss-icon-xl);
    max-height: var(--ss-icon-xl);
    object-fit: contain;
}

.ss-suggested-profile-link img {
    max-width: 100%;
    max-height: 100%;
    object-fit: cover;
}