photos and comments functionality for contributions, moderation page functionality pending

public/styles.css

@@ -629,6 +629,97 @@ select.form-input { cursor: pointer; }
 .popup-detail-actions .btn { flex: 1; padding: 6px 12px; font-size: 0.8rem; min-height: 36px; }
 
 
+/* -----------------------------------------------------------------
+   4.8 Popup Comments
+   ----------------------------------------------------------------- */
+.popup-comments {
+    margin-top: var(--space-sm);
+    padding-top: var(--space-sm);
+    border-top: 1px solid var(--color-border);
+}
+
+.popup-comments-header {
+    font-size: 0.8rem;
+    font-weight: 600;
+    color: var(--color-text-secondary);
+    margin-bottom: var(--space-sm);
+}
+
+.popup-comments-list {
+    max-height: 150px;
+    overflow-y: auto;
+}
+
+.popup-comment {
+    padding: 6px 0;
+    border-bottom: 1px solid #f0f0f0;
+    font-size: 0.8rem;
+}
+
+.popup-comment:last-child { border-bottom: none; }
+
+.popup-comment-meta {
+    color: var(--color-text-secondary);
+    font-size: 0.75rem;
+    margin-bottom: 2px;
+}
+
+.popup-comment-text {
+    color: var(--color-text);
+    line-height: 1.4;
+}
+
+.popup-comment-delete {
+    color: var(--color-error);
+    font-size: 0.7rem;
+}
+
+.popup-comment-empty {
+    font-size: 0.8rem;
+    color: #bbb;
+    font-style: italic;
+    padding: 8px 0;
+}
+
+.popup-comment-form {
+    display: flex;
+    gap: 4px;
+    margin-top: var(--space-sm);
+}
+
+.popup-comment-input {
+    flex: 1;
+    padding: 6px 10px;
+    border: 1px solid var(--color-border);
+    border-radius: 16px;
+    font-size: 0.8rem;
+    font-family: var(--font-body);
+    outline: none;
+}
+
+.popup-comment-input:focus {
+    border-color: var(--color-primary);
+}
+
+.popup-comment-submit {
+    border: none;
+    background: var(--color-primary);
+    color: white;
+    width: 32px;
+    height: 32px;
+    border-radius: 50%;
+    cursor: pointer;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 0.75rem;
+    flex-shrink: 0;
+    transition: filter var(--transition-fast);
+}
+
+.popup-comment-submit:hover { filter: brightness(1.15); }
+
+
 /* =================================================================
    SECTION 5: Admin-specific Styles (admin.php)
    ================================================================= */