.shelfish-container { 
    background: transparent !important; margin: 2rem auto !important; clear: both !important; color: inherit !important; width: 100% !important; max-width: 1000px !important;
}

/* reactive masonry lanes: pack vertically to eliminate all gaps */
.shelfish-grid { 
    display: flex !important;
    gap: 1rem !important;
    width: 100% !important;
    align-items: flex-start !important;
}

.shelfish-lane {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 1.2rem !important; /* vertical displacement (your 2 red bars) */
}

/* unified container style — zero gap between card and its button */
.shelfish-item-wrapper { 
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    color: inherit !important;
    overflow-wrap: break-word !important; 
    word-break: break-word !important;
    hyphens: auto !important;
}

.shelfish-card { 
    background: color-mix(in srgb, currentColor, transparent 88%) !important; 
    border-radius: 12px !important; 
    padding: 0.8rem !important; 
    box-sizing: border-box !important; 
    display: flex !important; 
    flex-direction: column !important; 
    gap: 0.6rem !important; 
    color: inherit !important; 
    border: 1px solid color-mix(in srgb, currentColor, transparent 80%) !important; 
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important; 
    width: 100% !important; 
}

.shelfish-thumb { width: 100% !important; aspect-ratio: 2/3 !important; border-radius: 4px !important; position: relative !important; overflow: hidden !important; background: color-mix(in srgb, currentColor, transparent 88%) !important; display: flex !important; align-items: center !important; justify-content: center !important; }
.shelfish-is-music .shelfish-thumb { aspect-ratio: 1/1 !important; }

/* image rounding overwrite (parent theme fallback) */
.shelfish-thumb img { 
    width: 100% !important; 
    height: 100% !important; 
    object-fit: cover !important; 
    display: block !important; 
    opacity: 0; 
    transition: opacity 0.8s ease !important; 
    border-radius: 0 !important; 
}
.shelfish-thumb img.shelfish-loaded { opacity: 1 !important; }

/* typography polish from your last request */
.shelfish-info { display: flex !important; flex-direction: column !important; gap: 0.2rem !important; color: inherit !important; }
.shelfish-title { 
    font-size: 1rem !important; 
    font-weight: 500 !important; 
    line-height: 1.4 !important; 
    letter-spacing: -0.01em !important; 
    margin: 0 !important;
}

.shelfish-author { 
    font-size: 0.8rem !important; 
    opacity: 0.8 !important; 
    line-height: 1.4 !important;
    font-style: normal !important;
}

/* seamless review join */
.shelfish-has-review .shelfish-card { border-bottom-left-radius: 0 !important; border-bottom-right-radius: 0 !important; border-bottom: none !important; }

.shelfish-btn-wrapper { margin: 0 !important; display: block !important; width: 100% !important; color: inherit !important; }
.shelfish-btn { 
    width: 100% !important; display: block !important; padding: 0.8rem !important; box-sizing: border-box !important; 
    border: 1px solid color-mix(in srgb, currentColor, transparent 80%) !important; 
    background-color: transparent !important; color: inherit !important; 
    border-radius: 6px !important; border-top-left-radius: 0 !important; border-top-right-radius: 0 !important;
    text-decoration: none !important; font-size: 0.9rem !important; font-weight: 500 !important;
    transition: all 0.2s ease !important; text-align: left !important; 
}
.shelfish-btn:hover { background-color: color-mix(in srgb, currentColor, transparent 90%) !important; border-color: color-mix(in srgb, currentColor, transparent 60%) !important; }

/* arrow animation from your last request */
.shelfish-btn .shelfish-arrow { 
    display: inline-block !important; 
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important; 
    margin-left: 0.4rem !important; 
}
.shelfish-btn:hover .shelfish-arrow { transform: translateX(5px) !important; }

/* missing art fallback */
.shelfish-placeholder { position: absolute !important; inset: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; background: linear-gradient(135deg, #eee 0%, #ccc 100%) !important; font-size: 3rem; filter: grayscale(1); opacity: 0.2; }