diff --git a/css/crimescene.css b/css/crimescene.css
index b96c5bf..13c5e59 100644
--- a/css/crimescene.css
+++ b/css/crimescene.css
@@ -1111,14 +1111,16 @@ mark.ur-highlight {
 }
 
 .prop-subcollection-toggle {
-    font-size: 1rem;
+    font-size: 0.75rem;
     color: #ff2d2d;
     transition: transform 0.25s;
     display: inline-block;
+    width: 1rem;
+    flex-shrink: 0;
 }
 
-.prop-subcollection.collapsed .prop-subcollection-toggle {
-    transform: rotate(-90deg);
+.prop-subcollection:not(.collapsed) .prop-subcollection-toggle {
+    transform: rotate(90deg);
 }
 
 .prop-subcollection.collapsed .prop-doc-list,
diff --git a/js/crimescene.js b/js/crimescene.js
index cb1f81c..5bf315d 100644
--- a/js/crimescene.js
+++ b/js/crimescene.js
@@ -317,9 +317,9 @@
             html += `<div class="prop-section-label">SUB-COLLECTIONS [${col.subcollections.length}]</div>`;
             col.subcollections.forEach(sc => {
                 const nScDocs = sc.documents ? sc.documents.length : 0;
-                html += `<div class="prop-subcollection">`;
+                html += `<div class="prop-subcollection collapsed">`;
                 html += `<div class="prop-subcollection-header" onclick="this.parentElement.classList.toggle('collapsed')">`;
-                html += `<span class="prop-subcollection-toggle">▾</span>`;
+                html += `<span class="prop-subcollection-toggle">▶</span>`;
                 html += `<span class="prop-subcollection-name">${esc(sc.name)}</span>`;
                 html += `<span class="prop-subcollection-count">[${nScDocs} DOC${nScDocs === 1 ? '' : 'S'}]</span>`;
                 html += `</div>`;