@layer components {
  /* ——— A folder open inside its parent's list ———
     Its contents hang under its row at the row's lead edge — past the
     chevron column — so the nesting reads without a frame, and a folder in
     there is the same row one step in. Its own list | grid stands at the end
     of its row while it is open, never over what it holds. */
  .vault-preview {
    display: block;
    margin-inline-start: 2rem;
  }

  .vault-folder:not([open]) .file-row__trail .segmented {
    display: none;
  }

  /* Open as a list: a hairline under the folder's row, across the whole
     sheet, before its first row. Open as a grid: the tiles, with air under
     them, and the next row's own hairline after. */
  .vault-folder[open]:not(:has(.vault-preview .tiles)) > summary {
    border-block-end: var(--border);
  }

  .vault-preview .tiles {
    padding-block: var(--inline-space-half) var(--block-space);
  }
}
