.page-library {
  display: grid;
  grid-template-columns: var(--ui-page-library-rail-width) minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  background: var(--ui-bg);
}

.page-library__rail { padding-top: var(--ui-page-library-rail-padding); }
.page-library__toggle,
.page-library__refresh {
  margin: 0 auto;
  color: var(--ui-value-muted);
  cursor: pointer;
}

.page-library__toggle {
  display: flex;
  width: 100%;
  height: auto;
  min-height: var(--ui-icon-button-size);
  flex-direction: column;
  gap: var(--space-2);
}

.page-library__toggle-label {
  font-size: var(--ui-font-size-micro);
  font-weight: var(--ui-font-weight-regular);
  line-height: 1;
}

.page-library__toggle:hover,
.page-library__refresh:hover,
.page-library.is-open .page-library__toggle { color: var(--ui-accent); }

.page-library__file-icon {
  width: var(--ui-library-file-icon-width);
  height: var(--ui-library-file-icon-height);
  overflow: visible;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.page-library__content {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 100%;
  overflow-y: auto;
  padding: var(--ui-page-library-padding-block-start) var(--ui-page-library-padding-inline-end) var(--ui-page-library-padding-block-end) var(--ui-page-library-padding-inline-start);
}
.page-library__content[hidden] { display: none; }
.page-library__header { display: flex; align-items: center; justify-content: space-between; }
.page-library__header h2 { margin: 0; color: var(--ui-panel-title-color); font-size: var(--ui-panel-title-font-size); font-weight: var(--ui-panel-title-font-weight); letter-spacing: var(--ui-panel-title-letter-spacing); text-transform: var(--ui-panel-title-text-transform); }
.page-library__refresh { margin: 0; font-size: var(--ui-font-size-action-glyph); }
.page-library__refresh[hidden],
.page-library__folder-header[hidden],
.page-library__list[hidden] { display: none; }
.page-library__section { margin-top: 17px; }
.page-library__section--files { padding-top: 14px; border-top: 1px solid color-mix(in srgb, var(--ui-border) 72%, transparent); }
.page-library__section h3 { margin: 0 0 7px; color: var(--ui-section-title-color); font-size: var(--ui-section-title-font-size-compact); font-weight: var(--ui-section-title-font-weight-compact); letter-spacing: var(--ui-section-title-letter-spacing-compact); text-transform: var(--ui-section-title-text-transform); }
.page-library__draft-status { min-height: 14px; color: var(--ui-panel-meta-color); font-size: var(--ui-panel-meta-font-size); font-weight: var(--ui-panel-meta-font-weight); }
.page-library__drafts { display: grid; }
.page-library__draft {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--ui-icon-button-size);
  align-items: center;
  border-top: 1px solid color-mix(in srgb, var(--ui-border) 72%, transparent);
}
.page-library__draft-resume,
.page-library__draft-delete {
  min-width: 0;
  padding: 7px 4px;
  border: 0;
  background: transparent;
  color: var(--ui-value-primary);
  font: inherit;
  cursor: pointer;
}
.page-library__draft-resume { display: grid; gap: var(--page-library-draft-meta-gap); text-align: start; }
.page-library__draft-resume span { overflow: hidden; font-size: var(--ui-control-label-font-size-compact); font-weight: var(--ui-control-label-font-weight); text-overflow: ellipsis; white-space: nowrap; }
.page-library__draft-resume small { color: var(--ui-panel-meta-color); font-size: var(--ui-panel-meta-font-size-compact); font-weight: var(--ui-panel-meta-font-weight); }
.page-library__draft-delete { width: var(--ui-icon-button-size); height: var(--ui-icon-button-size); padding: 0; color: var(--ui-value-muted); font-size: var(--ui-font-size-action-glyph); opacity: 0; }
.page-library__draft:hover .page-library__draft-delete,
.page-library__draft-delete:focus-visible { opacity: .72; }
.page-library__draft:hover .page-library__draft-resume,
.page-library__draft.is-active .page-library__draft-resume { color: var(--ui-accent); }
.page-library__draft-delete:hover { color: var(--ui-danger); opacity: 1; }
.page-library__folder-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--ui-control-gap-lg); margin-top: var(--ui-panel-section-gap); }
.page-library__folder-identity { display: flex; min-width: 0; align-items: center; gap: var(--ui-control-gap-md); color: var(--ui-value-primary); }
.page-library__folder-icon { width: var(--ui-tool-icon-size); height: var(--ui-tool-icon-size); flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; }
.page-library__folder { overflow: hidden; margin: 0; color: inherit; font-size: var(--ui-section-title-font-size); font-weight: var(--ui-section-title-font-weight); text-overflow: ellipsis; white-space: nowrap; }
.page-library__choose { min-height: var(--ui-field-height-md); padding: var(--space-3) var(--space-5); border: 1px solid var(--ui-border); border-radius: var(--ui-radius-field); background: var(--ui-control-bg); color: var(--ui-field-label-color); font-size: var(--ui-font-size-caption); font-weight: var(--ui-control-label-font-weight); cursor: pointer; }
.page-library__choose:hover { border-color: var(--ui-accent); color: var(--ui-accent); }
.page-library__status { margin-top: var(--ui-panel-item-gap); color: var(--ui-panel-meta-color); font-size: var(--ui-panel-meta-font-size); font-weight: var(--ui-panel-meta-font-weight); }
.page-library__status:empty { display: none; }
.page-library__list { display: grid; margin-top: var(--ui-panel-item-gap); padding-inline-start: var(--ui-section-content-indent); }
.page-library__branch { display: grid; }
.page-library__directory { min-width: 0; }
.page-library__directory > summary,
.page-library__page {
  min-width: 0;
  min-height: var(--ui-panel-row-height);
  padding: 0 4px;
  overflow: hidden;
  border: 0;
  border-top: 1px solid color-mix(in srgb, var(--ui-border) 72%, transparent);
  background: transparent;
  color: var(--ui-value-primary);
  font-size: var(--ui-control-label-font-size);
  font-weight: var(--ui-control-label-font-weight);
  line-height: var(--ui-panel-row-height);
  text-align: start;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.page-library__directory > summary { display: flex; align-items: center; color: var(--ui-value-primary); list-style: none; }
.page-library__directory > summary::-webkit-details-marker { display: none; }
.page-library__directory > summary::before { display: inline-block; width: var(--ui-menu-leading-icon-width); flex: 0 0 auto; color: var(--ui-value-muted); content: "▸"; }
.page-library__directory[open] > summary::before { content: "▾"; }
.page-library__tree-icon { width: var(--ui-tool-icon-size); height: var(--ui-tool-icon-size); flex: 0 0 auto; margin-inline-end: var(--ui-control-gap-md); fill: none; stroke: currentColor; stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; }
.page-library__file-entry-icon { color: var(--ui-value-muted); }
.page-library__page { display: flex; align-items: center; }
.page-library__page::before { width: var(--ui-menu-leading-icon-width); flex: 0 0 auto; content: ""; }
.page-library__directory > summary span,
.page-library__page span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.page-library__directory > .page-library__branch { padding-inline-start: var(--ui-section-content-indent); }
.page-library__page:hover,
.page-library__page.is-active { color: var(--ui-accent); }

.page-library__basic-files { margin-top: var(--ui-panel-section-gap); }
.page-library__basic-files[hidden] { display: none; }
.page-library__basic-files h3 { margin: 0 0 var(--ui-panel-item-gap); color: var(--ui-section-title-color); font-size: var(--ui-section-title-font-size); font-weight: var(--ui-section-title-font-weight); }
.page-library__basic-actions { display: flex; flex-wrap: wrap; gap: var(--ui-control-gap-md); }
.page-library__fallback-note {
  position: relative;
  margin-top: auto;
  padding: var(--space-12) var(--space-15) 0 0;
  color: var(--ui-panel-meta-color);
  font-size: var(--ui-panel-meta-font-size);
  line-height: var(--ui-line-height-summary);
}
.page-library__fallback-note[hidden] { display: none; }
.page-library__fallback-note p { margin: 0; }
.page-library__fallback-note-dismiss {
  position: absolute;
  top: var(--space-8);
  right: calc(0px - var(--space-5));
  color: var(--ui-value-muted);
  font-size: var(--ui-font-size-action-glyph);
  cursor: pointer;
  opacity: .55;
}
.page-library__fallback-note-dismiss:hover,
.page-library__fallback-note-dismiss:focus-visible { opacity: 1; }
