
.ft-root[data-v-0f0b387c] {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}
.ft-label[data-v-0f0b387c] {
  padding: 8px 12px 4px;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--fm-text-muted);
  flex-shrink: 0;
}
.ft-scroll[data-v-0f0b387c] {
  flex: 1;
  overflow-y: auto;
  padding-bottom: 8px;
}
.ft-empty[data-v-0f0b387c] {
  padding: 8px 12px;
  font-size: 0.75rem;
  color: var(--fm-text-muted);
}
[data-v-0f0b387c] .ft-node-wrap { display: flex; flex-direction: column;
}
[data-v-0f0b387c] .ft-node {
  display: flex;
  align-items: center;
  gap: 5px;
  padding-top: 4px;
  padding-bottom: 4px;
  padding-right: 8px;
  cursor: pointer;
  border-radius: 5px;
  margin: 1px 4px;
  font-size: 0.8rem;
  color: var(--fm-text);
  user-select: none;
  transition: background .1s;
}
[data-v-0f0b387c] .ft-node:hover { background: var(--fm-item-hover);
}
[data-v-0f0b387c] .ft-node--active {
  background: var(--fm-item-selected) !important;
  color: var(--fm-accent);
  font-weight: 600;
}
[data-v-0f0b387c] .ft-chevron {
  width: 14px;
  height: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 0.9rem;
  color: var(--fm-text-muted);
  transition: transform .15s;
  border-radius: 3px;
}
[data-v-0f0b387c] .ft-chevron:hover { background: var(--fm-border);
}
[data-v-0f0b387c] .ft-chevron--open i { transform: rotate(90deg); display: block;
}
[data-v-0f0b387c] .ft-chevron--hidden { visibility: hidden;
}
[data-v-0f0b387c] .ft-folder-icon {
  font-size: 1rem;
  color: var(--fm-accent);
  flex-shrink: 0;
}
[data-v-0f0b387c] .ft-folder-name {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
[data-v-0f0b387c] .ft-badge {
  font-size: 0.6rem;
  background: var(--fm-border);
  color: var(--fm-text-muted);
  border-radius: 8px;
  padding: 1px 5px;
  flex-shrink: 0;
}

.fm-file-icon[data-v-8385be2b] {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.fm-icon-wrap[data-v-8385be2b] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.fm-icon-glyph[data-v-8385be2b] {
  font-size: 2.8rem;
  color: var(--icon-color);
  line-height: 1;
}
.fm-thumbnail[data-v-8385be2b] {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 4px;
}
.fm-ext-badge[data-v-8385be2b] {
  font-size: 0.52em;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--icon-color);
  text-transform: uppercase;
  line-height: 1;
}

.fm-chips-root[data-v-f3a46c82] {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.fm-chip[data-v-f3a46c82] {
  position: absolute;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 6px;
  border-radius: 10px;
  font-size: 0.6rem;
  font-weight: 700;
  white-space: nowrap;
  pointer-events: auto;
  box-shadow: 0 1px 3px rgba(0,0,0,.3);
  line-height: 1.4;
  --fm-chip-default: #6366f1;
}
.fm-chip--top-left[data-v-f3a46c82]    { top: 4px;  left: 4px;
}
.fm-chip--top-right[data-v-f3a46c82]   { top: 4px;  right: 4px;
}
.fm-chip--bottom-left[data-v-f3a46c82] { bottom: 4px; left: 4px;
}
.fm-chip--bottom-right[data-v-f3a46c82]{ bottom: 4px; right: 4px;}
/* Override top for stacked chips — set via inline :style offset */
.fm-chip--top-left[style][data-v-f3a46c82],
.fm-chip--top-right[style][data-v-f3a46c82],
.fm-chip--bottom-left[style][data-v-f3a46c82],
.fm-chip--bottom-right[style][data-v-f3a46c82] { top: unset; bottom: unset;
}
.fm-chip-icon[data-v-f3a46c82] { font-size: 0.75em;
}

.fm-item[data-v-f7b7b1da] {
  position: relative;
  cursor: pointer;
  border-radius: 8px;
  border: 1.5px solid transparent;
  transition: background .1s, border-color .1s, opacity .12s, box-shadow .1s;
  user-select: none;
  outline: none;
}
.fm-item[data-v-f7b7b1da]:hover { background: var(--fm-item-hover);
}
.fm-item.is-selected[data-v-f7b7b1da] {
  border-color: var(--fm-accent);
  background: var(--fm-item-selected);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--fm-accent) 15%, transparent);
}
.fm-item.is-cut[data-v-f7b7b1da] { opacity: .4;
}
.fm-item.is-dragging[data-v-f7b7b1da] { opacity: .25;
}

/* Grid card */
.fm-item.is-grid[data-v-f7b7b1da] {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 10px 4px 8px;
  width: 100%;
  gap: 0;
}
.fm-item.is-grid .fm-icon-area[data-v-f7b7b1da] {
  position: relative;
  width: 76px; height: 76px;
  flex-shrink: 0;
  border-radius: 10px;
  overflow: hidden;
  background: color-mix(in srgb, var(--type-color, var(--fm-accent)) 10%, var(--fm-surface));
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 8px;
  border: 1px solid color-mix(in srgb, var(--type-color, var(--fm-accent)) 20%, transparent);
}
.fm-item.is-grid .fm-type-strip[data-v-f7b7b1da] {
  position: absolute; bottom: 0; left: 0; right: 0;
  height: 3px;
  background: var(--type-color, var(--fm-accent));
}
.fm-item.is-grid .fm-name[data-v-f7b7b1da] {
  font-size: 0.72rem; color: var(--fm-text);
  text-align: center; word-break: break-all;
  display: -webkit-box; -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; overflow: hidden; width: 100%; line-height: 1.35;
}
.fm-item.is-grid .fm-meta[data-v-f7b7b1da] { font-size: 0.62rem; color: var(--fm-text-muted); margin-top: 2px;
}

/* List row */
.fm-item.is-list[data-v-f7b7b1da] {
  display: grid;
  grid-template-columns: 32px 1fr 80px 110px 56px;
  align-items: center;
  padding: 4px 10px; gap: 10px; border-radius: 5px;
}
.fm-item.is-list .fm-icon-area[data-v-f7b7b1da] {
  position: relative; width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center;
}
/* Shrink icon glyph in list rows */
.fm-item.is-list .fm-icon-area[data-v-f7b7b1da] .fm-icon-glyph { font-size: 1.35rem;
}
.fm-item.is-list .fm-type-strip[data-v-f7b7b1da] { display: none;
}
.fm-item.is-list .fm-name[data-v-f7b7b1da] {
  font-size: 0.8rem; color: var(--fm-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.fm-item.is-list .fm-meta[data-v-f7b7b1da] { display: none;
}
.fm-item.is-list .fm-list-size[data-v-f7b7b1da],
.fm-item.is-list .fm-list-date[data-v-f7b7b1da],
.fm-item.is-list .fm-list-type[data-v-f7b7b1da] { font-size: 0.71rem; color: var(--fm-text-muted); white-space: nowrap;
}
.fm-rename-input[data-v-f7b7b1da] {
  width: 100%; font-size: 0.75rem; padding: 2px 5px;
  border: 1px solid var(--fm-accent); border-radius: 4px;
  background: var(--fm-surface); color: var(--fm-text); outline: none; text-align: center;
}
.fm-item.is-list .fm-rename-input[data-v-f7b7b1da] { text-align: left;
}

.fm-grid-root[data-v-e683a06c] {
  position: relative;
  flex: 1;
  overflow-y: auto;
  min-height: 0;
}
.fm-grid--drag-over[data-v-e683a06c] { outline: 2px dashed var(--fm-accent); outline-offset: -4px; border-radius: 8px;
}
.fm-list-header[data-v-e683a06c] {
  display: grid;
  grid-template-columns: 32px 1fr 80px 110px 56px;
  padding: 4px 10px;
  gap: 10px;
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--fm-text-muted);
  border-bottom: 1px solid var(--fm-border);
  position: sticky;
  top: 0;
  background: var(--fm-header-bg, var(--fm-surface));
  z-index: 1;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.fm-col-sortable[data-v-e683a06c] {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 4px;
}
.fm-col-sortable[data-v-e683a06c]:hover { color: var(--fm-text);
}
.fm-items-grid[data-v-e683a06c] {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
  gap: 2px;
  padding: 8px 6px;
}
.fm-items-list[data-v-e683a06c] {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 4px;
}
.fm-empty[data-v-e683a06c] {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 60px 20px;
  color: var(--fm-text-muted);
}
.fm-empty-icon[data-v-e683a06c] { font-size: 3.5rem; opacity: .4;
}
.fm-empty p[data-v-e683a06c] { font-size: 0.85rem; margin: 0;
}
.fm-drag-hint[data-v-e683a06c] {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: var(--fm-item-selected);
  border-radius: 8px;
  pointer-events: none;
  font-size: 0.9rem;
  color: #a5b4fc;
}
.fm-drag-hint i[data-v-e683a06c] { font-size: 2.5rem;
}

/* FM tokens mapped directly to app _variables.scss CSS custom properties */
:root, [data-bs-theme] {
  --fm-surface:        var(--bg-panel);
  --fm-text:           var(--text-main);
  --fm-text-secondary: var(--text-muted);
  --fm-text-muted:     var(--text-muted);
  --fm-accent:         var(--primary-color);
  --fm-border:         var(--border-color);
  --fm-item-hover:     var(--item-hover);
  --fm-item-selected:  var(--selection-bg);
  --fm-bar-bg:         var(--bg-app);
  --fm-header-bg:      var(--bg-header);
  --fm-sidebar-bg:     var(--bg-app);
}

.fm-root[data-v-94a48c99] {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: var(--fm-surface);
  overflow: hidden;
  outline: none;
  color: var(--fm-text);
  font-family: var(--bs-body-font-family, system-ui, sans-serif);
  font-size: 0.875rem;
  border-radius: 10px;
}

/* ── Top bar ─────────────────────────────────────── */
.fm-topbar[data-v-94a48c99] {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-bottom: 1px solid var(--fm-border);
  background: var(--fm-header-bg);
  flex-shrink: 0;
  min-height: 42px;
}
.fm-nav[data-v-94a48c99] { display: flex; gap: 2px;
}
.fm-icon-btn[data-v-94a48c99] {
  display: flex; align-items: center; justify-content: center;
  width: 28px; height: 28px;
  border: none; background: none;
  border-radius: 5px;
  cursor: pointer;
  color: var(--fm-text);
  font-size: 1.1rem;
  transition: background .1s;
}
.fm-icon-btn[data-v-94a48c99]:hover:not(:disabled) { background: var(--fm-item-hover);
}
.fm-icon-btn[data-v-94a48c99]:disabled { opacity: .35; cursor: default;
}
.fm-icon-btn--active[data-v-94a48c99] { background: var(--fm-item-selected) !important; color: var(--fm-accent);
}
.fm-breadcrumb[data-v-94a48c99] {
  display: flex; align-items: center; gap: 3px;
  flex: 1; min-width: 0; overflow: hidden;
}
.fm-bc-item[data-v-94a48c99] {
  font-size: 0.8rem; color: var(--fm-text-muted);
  cursor: pointer; padding: 2px 4px; border-radius: 4px;
  display: flex; align-items: center; gap: 3px;
  white-space: nowrap;
  transition: color .1s;
}
.fm-bc-item[data-v-94a48c99]:hover { color: var(--fm-text);
}
.fm-bc-label[data-v-94a48c99] { font-weight: 500; color: var(--fm-text);
}
.fm-bc-sep[data-v-94a48c99] { font-size: 0.75rem; color: var(--fm-text-muted); flex-shrink: 0;
}
.fm-topbar-right[data-v-94a48c99] { display: flex; align-items: center; gap: 6px;
}
.fm-search-wrap[data-v-94a48c99] {
  display: flex; align-items: center; gap: 6px;
  background: var(--fm-bar-bg);
  border: 1px solid var(--fm-border);
  border-radius: 6px;
  padding: 0 8px;
  color: var(--fm-text-muted);
  font-size: 0.85rem;
}
.fm-search-input[data-v-94a48c99] {
  background: none; border: none; outline: none;
  color: var(--fm-text); font-size: 0.8rem;
  width: 160px; padding: 4px 0;
}
.fm-view-toggle[data-v-94a48c99] { display: flex; gap: 1px;
}

/* ── Body split ──────────────────────────────────── */
.fm-body[data-v-94a48c99] { display: flex; flex: 1; min-height: 0; overflow: hidden;
}
.fm-sidebar[data-v-94a48c99] {
  flex-shrink: 0;
  background: var(--fm-sidebar-bg);
  border-right: 1px solid var(--fm-border);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.fm-resize-handle[data-v-94a48c99] {
  width: 4px; flex-shrink: 0; cursor: col-resize;
  background: var(--fm-border);
  transition: background .15s;
}
.fm-resize-handle[data-v-94a48c99]:hover { background: var(--fm-accent);
}
.fm-content[data-v-94a48c99] { flex: 1; display: flex; flex-direction: column; min-width: 0; overflow: hidden;
}

/* ── Action strip ────────────────────────────────── */
.fm-actionstrip[data-v-94a48c99] {
  display: flex; align-items: center; gap: 2px;
  padding: 4px 8px;
  border-bottom: 1px solid var(--fm-border);
  background: var(--fm-header-bg);
  flex-shrink: 0;
}
.fm-strip-btn[data-v-94a48c99] {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 4px 8px; border: none; background: none;
  border-radius: 5px; cursor: pointer;
  font-size: 0.78rem; color: var(--fm-text);
  transition: background .1s;
  white-space: nowrap;
}
.fm-strip-btn[data-v-94a48c99]:hover:not(:disabled) { background: var(--fm-item-hover);
}
.fm-strip-btn[data-v-94a48c99]:disabled { opacity: .35; cursor: default;
}
.fm-strip-btn--danger[data-v-94a48c99]:hover:not(:disabled) { color: var(--danger-color); background: var(--danger-bg-subtle, rgba(var(--bs-danger-rgb,220,53,69),.08));
}
.fm-strip-sep[data-v-94a48c99] { width: 1px; height: 18px; background: var(--fm-border); margin: 0 2px;
}
.fm-strip-btn--icon[data-v-94a48c99] { padding: 4px 6px;
}
[data-v-94a48c99] .fm-sort-sel {
  font-size: 0.75rem !important;
  height: 28px !important;
  min-width: 130px;
  margin-left: auto;
}
[data-v-94a48c99] .fm-sort-sel .p-select-label { padding: 3px 8px !important; font-size: 0.75rem !important;
}
[data-v-94a48c99] .fm-sort-sel .p-select-dropdown { width: 28px !important;
}

/* ── Status bar ──────────────────────────────────── */
.fm-statusbar[data-v-94a48c99] {
  display: flex; align-items: center; justify-content: space-between;
  padding: 4px 12px;
  border-top: 1px solid var(--fm-border);
  background: var(--fm-header-bg);
  flex-shrink: 0;
  min-height: 28px;
}
.fm-status-text[data-v-94a48c99] { font-size: 0.72rem; color: var(--fm-text-muted);
}
.fm-storage-inline[data-v-94a48c99] { display: flex; align-items: center; gap: 8px;
}
.fm-storage-track[data-v-94a48c99] {
  width: 80px; height: 4px; background: var(--fm-bar-bg);
  border-radius: 99px; overflow: hidden;
}
.fm-storage-fill[data-v-94a48c99] { height: 100%; border-radius: 99px; transition: width .3s;
}
.fm-storage-label[data-v-94a48c99] { font-size: 0.68rem; color: var(--fm-text-muted);
}
.fm-storage-label.is-warn[data-v-94a48c99] { color: var(--danger-color);
}
[data-v-94a48c99] .fm-ctx-danger { color: #ef4444;
}

.fm-test-overlay {
  position: fixed; inset: 0; z-index: 99999;
  background: rgba(0,0,0,.65);
  display: flex; align-items: center; justify-content: center;
}
.fm-test-window {
  width: min(960px, 94vw); height: min(650px, 90vh);
  border-radius: 12px; overflow: hidden;
  box-shadow: 0 24px 80px rgba(0,0,0,.6);
}
