diff --git a/src/client/styles.css b/src/client/styles.css
index 3e530e6..2b07f11 100644
--- a/src/client/styles.css
+++ b/src/client/styles.css
@@ -227,7 +227,8 @@ button.lc-brief-row-link { cursor: pointer; }
 .lc-event-time { color: var(--dsw-alias-label-secondary); font-size: 12px; }
 /*
  ---- File Activity card: the header chips double as purpose/form filters (the shared lc-gran toggle look with an ops count);
- rows speak the browser's element-row anatomy (chevron, fact chips, right-aligned time) and expand into a per-operation log. ----
+ rows speak the browser's element-row anatomy (chevron, fact chips, right-aligned time) and expand into a per-operation log
+ on a tree-guide rail. ----
  */
 .lc-fa-ctl { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
 .lc-fa-ctl .lc-gran { margin-left: 0; }
@@ -239,29 +240,31 @@ button.lc-brief-row-link { cursor: pointer; }
 .lc-fa-meta-delta { position: relative; }
 .lc-fa-meta-tip { position: absolute; top: calc(100% + 6px); left: 0; z-index: 6; width: max-content; max-width: 260px; white-space: normal; background: var(--dsw-alias-bg-layer-2); border: 1px solid var(--dsw-alias-border-l1); border-radius: 6px; padding: 6px 10px; font-size: 12px; line-height: 1.5; color: var(--dsw-alias-label-primary); box-shadow: 0 2px 8px rgba(0,0,0,0.18); pointer-events: none; opacity: 0; transition: opacity 120ms ease; }
 .lc-fa-meta-delta:hover .lc-fa-meta-tip { opacity: 1; }
-.lc-fa-item { border-radius: 6px; }
-.lc-fa-item-on { background: var(--dsw-alias-interactive-bg-active); }
-.lc-fa-row { display: flex; align-items: center; gap: 7px; width: 100%; border: 0; background: transparent; color: var(--dsw-alias-label-primary); font: inherit; font-size: 12px; padding: 5px 6px; cursor: pointer; text-align: left; border-radius: 6px; transition: background-color 120ms ease; }
+/* An expanded file reads as one contained card: layer-2 fill inside a hairline frame. */
+.lc-fa-item { border: 1px solid transparent; border-radius: 8px; transition: background-color 120ms ease, border-color 120ms ease; }
+.lc-fa-item-on { background: var(--dsw-alias-bg-layer-2); border-color: var(--dsw-alias-border-l1); }
+.lc-fa-row { display: flex; align-items: center; gap: 7px; width: 100%; border: 0; background: transparent; color: var(--dsw-alias-label-primary); font: inherit; font-size: 12px; padding: 6px 8px; cursor: pointer; text-align: left; border-radius: 7px; transition: background-color 120ms ease; }
 .lc-fa-row:hover { background: var(--dsw-alias-interactive-bg-hover); }
-.lc-fa-form { flex: none; width: 16px; text-align: center; font-size: 11px; }
+.lc-fa-form { flex: none; width: 16px; text-align: center; font-size: 11px; opacity: 0.85; }
 .lc-fa-path { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .lc-fa-path em { font-style: normal; color: var(--dsw-alias-label-secondary); }
-/* Per-purpose count badges: one fixed tint per purpose (read = brand, write = success, search = warn). */
-.lc-fa-badge { flex: none; display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; padding: 0 6px; border-radius: 4px; white-space: nowrap; }
-.lc-fa-badge i { display: inline-block; width: 6px; height: 6px; border-radius: 2px; background: currentColor; }
-.lc-fa-b-read { color: var(--dsw-alias-brand-primary); background: color-mix(in srgb, var(--dsw-alias-brand-primary) 15%, transparent); }
-.lc-fa-b-write { color: var(--dsw-alias-state-success-primary); background: color-mix(in srgb, var(--dsw-alias-state-success-primary) 15%, transparent); }
-.lc-fa-b-search { color: var(--dsw-alias-state-warn-primary); background: color-mix(in srgb, var(--dsw-alias-state-warn-primary) 15%, transparent); }
+/* Per-purpose count badges: pill chips, one fixed tint per purpose (read = brand, write = success, search = warn). */
+.lc-fa-badge { flex: none; display: inline-flex; align-items: center; gap: 4px; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; padding: 1px 7px; border-radius: 999px; white-space: nowrap; }
+.lc-fa-badge i { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
+.lc-fa-b-read { color: var(--dsw-alias-brand-primary); background: color-mix(in srgb, var(--dsw-alias-brand-primary) 14%, transparent); }
+.lc-fa-b-write { color: var(--dsw-alias-state-success-primary); background: color-mix(in srgb, var(--dsw-alias-state-success-primary) 14%, transparent); }
+.lc-fa-b-search { color: var(--dsw-alias-state-warn-primary); background: color-mix(in srgb, var(--dsw-alias-state-warn-primary) 14%, transparent); }
 .lc-fa-delta { flex: none; display: inline-flex; gap: 5px; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
 .lc-fa-up { color: var(--dsw-alias-state-success-primary); }
 .lc-fa-down { color: var(--dsw-alias-state-error-primary); }
-.lc-fa-time { flex: none; color: var(--dsw-alias-label-secondary); font-size: 11px; }
-.lc-fa-ops { padding: 2px 6px 6px 26px; display: flex; flex-direction: column; gap: 1px; }
+.lc-fa-time { flex: none; color: var(--dsw-alias-label-secondary); font-size: 11px; font-variant-numeric: tabular-nums; }
+/* The expanded op log hangs on a tree-guide rail aligned under the row chevron. */
+.lc-fa-ops { margin: 0 8px 8px 15px; padding: 2px 0 2px 10px; border-left: 2px solid var(--dsw-alias-border-l1); display: flex; flex-direction: column; gap: 1px; }
 .lc-fa-op { display: flex; align-items: center; gap: 8px; min-width: 0; border: 0; background: transparent; color: var(--dsw-alias-label-primary); font: inherit; font-size: 11px; padding: 3px 6px; text-align: left; border-radius: 5px; transition: background-color 120ms ease; }
 .lc-fa-op-link { cursor: pointer; }
 .lc-fa-op-link:hover { background: var(--dsw-alias-interactive-bg-hover); }
 .lc-fa-op-time { flex: none; width: 58px; color: var(--dsw-alias-label-secondary); font-variant-numeric: tabular-nums; }
-.lc-fa-op-tool { flex: none; font-size: 11px; padding: 0 6px; border-radius: 4px; background: var(--dsw-alias-bg-layer-2); border: 1px solid var(--dsw-alias-border-l1); color: var(--dsw-alias-label-secondary); }
+.lc-fa-op-tool { flex: none; font-size: 11px; padding: 0 6px; border-radius: 999px; background: var(--dsw-alias-bg-layer-1); border: 1px solid var(--dsw-alias-border-l1); color: var(--dsw-alias-label-secondary); }
 .lc-fa-op-detail { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--dsw-alias-label-secondary); }
 .lc-fa-more { padding: 2px 6px; color: var(--dsw-alias-label-secondary); font-size: 11px; }
 .lc-fa-note { margin-top: 8px; color: var(--dsw-alias-label-secondary); font-size: 12px; }