.desktop-file-icon { position: fixed; left: 80px; top: 51px; width: 86px; min-height: 88px; padding: 9px 5px; display: flex; align-items: center; flex-direction: column; gap: 11px; border: 1px solid transparent; border-radius: 5px; color: white; font-size: 12px; text-shadow: 0 1px 4px #14251ee0; user-select: none; }
.desktop-file-icon:hover { background: #ffffff18; border-color: #ffffff26; }
.desktop-file-icon:focus { background: #ffffff26; border-color: #ffffff60; }
.folder-art { display: block; position: relative; width: 44px; height: 39px; margin-top: 3px; border-radius: 6px; background: linear-gradient(#008cec,#1f9cf3); box-shadow: 0 3px 8px #132f3525; flex-shrink: 0; }
.folder-art::before { content: ''; position: absolute; left: 0; top: -4px; width: 24px; height: 10px; border-radius: 6px 6px 0 0; background: #1598f0; }
.folder-art span { position: absolute; inset: 5px 4px 3px; background: #ecf7ff; border-radius: 3px; transform: rotate(-3deg); }
.folder-art::after { content: ''; position: absolute; inset: 11px 0 0; border-radius: 4px 4px 6px 6px; background: linear-gradient(#69d4ff,#30b0f6); border-top: 1px solid #c2edff99; }
.folder-art-small { width: 23px; height: 20px; margin-top: 1px; border-radius: 4px; box-shadow: none; }
.folder-art-small::before { width: 12px; height: 6px; top: -2px; border-radius: 4px 4px 0 0; }
.folder-art-small span { inset: 3px 2px 1px; }
.folder-art-small::after { top: 6px; border-radius: 3px; }
.files-window { left: 20%; top: 13%; width: 72vw; height: 74vh; min-width: 560px; min-height: 360px; }
.files-layout { display: flex; flex: 1; min-height: 0; }
.files-sidebar { flex: 0 0 180px; min-width:0; padding: 9px 8px; overflow: auto; }
.files-tree { list-style:none; margin:0; padding:0; }
.files-tree-row { display:flex; align-items:center; padding-left:calc(var(--file-depth,0) * 14px); min-height:39px; border-radius:6px; color:#292e34; }
.files-tree-row:hover {background:#e9ebed;}
.files-tree-row.is-selected {background:#fff;color:#1670f5;}
.files-tree-link {display:flex;align-items:center;gap:8px;min-width:0;flex:1;padding:9px 6px 9px 2px;text-align:left;font-size:12px;color:inherit;}
.files-tree-link span {overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.files-tree-link svg {width:17px;height:17px;flex-shrink:0;}
.files-tree-toggle,.files-tree-spacer {display:inline-grid;place-items:center;flex:0 0 23px;width:23px;height:30px;color:inherit;}
.files-tree-toggle {border-radius:4px;}
.files-tree-toggle:hover {background:#808b9917;}
.files-tree-toggle svg {width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.files-tree-toggle[aria-expanded="true"] svg {transform:rotate(90deg);}
.files-tree-toggle:focus-visible,.files-tree-link:focus-visible {outline-offset:-2px;}
.files-main { display: flex; flex-direction: column; flex: 1; min-width: 0; background: #fff; border-radius: 9px 9px 0 0; margin-right: 8px; }
.files-location-bar { display: flex; gap: 12px; align-items: center; padding: 19px 18px 12px; }
.files-breadcrumb { min-width: 110px; flex: 1; display: flex; align-items: center; height: 32px; border: 1px solid #dce0e4; border-radius: 5px; padding: 0 7px; font-size: 12px; color: #252b31; }
.files-breadcrumb svg { width: 14px; height: 14px; flex-shrink: 0; }
.files-breadcrumb input { width:100%; min-width:0; border:0; outline:none; background:transparent; font:inherit; color:inherit; text-overflow:ellipsis; }
.files-breadcrumb:focus-within {outline:2px solid #327ced;outline-offset:1px;}
.files-crumbs {display:flex;align-items:center;gap:2px;min-width:0;overflow:auto;scrollbar-width:none;}
.files-crumbs::-webkit-scrollbar {display:none;}
.files-crumbs button {flex-shrink:0;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:5px 4px;border-radius:3px;color:inherit;}
.files-crumbs button:hover {background:#edf3fa;}
.files-crumbs button[aria-current] {font-weight:500;}
.files-crumb-divider {flex-shrink:0;padding:0 2px;color:#69737d;}
#files-edit-path {align-self:stretch;flex:1 0 23px;min-width:23px;display:flex;align-items:center;justify-content:flex-end;color:#84909b;}
#files-edit-path svg {opacity:0;}
.files-breadcrumb:hover #files-edit-path svg,#files-edit-path:focus-visible svg {opacity:1;}
.files-navigation {display:flex;align-items:center;gap:8px;flex-shrink:0;}
.files-history-buttons {display:flex;border:1px solid #dce0e4;border-radius:5px;overflow:hidden;}
.files-navigation button {display:grid;place-items:center;width:29px;height:30px;color:#4e5760;}
.files-navigation button svg {width:16px;height:16px;}
.files-history-buttons button+button {border-left:1px solid #dce0e4;}
#files-up {border:1px solid #dce0e4;border-radius:5px;width:32px;height:32px;}
.files-navigation button:enabled:hover {background:#edf3fa;}
.files-navigation button:disabled {opacity:.35;cursor:var(--cursor-default,default);}
.files-search { display: flex; align-items: center; gap: 7px; height: 31px; width: 175px; border: 1px solid #e2e5e8; border-radius: 5px; padding: 0 9px; color: #939ba3; }
.files-search:focus-within { outline: 2px solid #327ced; outline-offset: 1px; }
.files-search svg { width: 15px; height: 15px; flex-shrink: 0; }
.files-search input { width: 100%; min-width: 0; border: 0; background: transparent; outline: none; font: inherit; font-size: 12px; color: #30373e; }
.files-actions { display: flex; align-items: center; justify-content: space-between; gap: 9px; padding: 0 18px 12px; }
.files-actions>#files-category-label {margin-left:auto;}
.files-actions>button { display: flex; align-items: center; gap: 6px; border: 1px solid #e2e5e8; border-radius: 4px; padding: 5px 10px; font-size: 11px; }
.files-actions>button svg { width: 13px; height: 13px; }
.files-actions>button:disabled { opacity: .38; cursor:var(--cursor-default, default); }
.files-actions>button:enabled:hover { background: #f3f7fc; }
.files-sort-label { display: flex; align-items: center; gap: 7px; color: #616a73; font-size: 10px; }
.files-sort-label select { font: inherit; color: #3e4852; background: #f8f9fa; padding: 5px; border: 1px solid #e9ebed; border-radius: 4px; max-width: 155px; }
.files-list-scroll { flex: 1; min-height: 0; overflow: auto; padding: 0 18px; }
.files-table { border-collapse: collapse; width: 100%; font-size: 12px; table-layout: fixed; }
.files-table th { position: sticky; top: 0; z-index: 1; text-align: left; font-weight: 400; background: #fff; color: #707880; border-block: 1px solid #eceef0; height: 32px; }
.files-table th:first-child { width: 48%; padding-left: 8px; }
.files-table th:nth-child(2) { width: 15%; }
.files-table th:nth-child(3) { width: 23%; }
.files-table th:nth-child(4) { width: 14%; }
.files-table td { border-bottom: 1px solid #f0f1f2; color: #424b54; padding: 0 8px 0 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; height: 46px; }
.file-row:hover { background: #f5f8fc; }
.file-row.is-selected { background: #eaf3ff; }
.file-name-cell {display:flex;align-items:center;min-width:0;padding-left:calc(var(--file-depth,0) * 16px);}
.file-link { display: flex; align-items: center; gap: 9px; padding: 7px 4px; color: #20262c; flex:1; min-width:0; text-align:left; font:inherit; }
.file-link:focus-visible { outline-offset: -2px; border-radius: 3px; }
.file-link .file-icon { width: 24px; height: 29px; font-size: 12px; flex-shrink: 0; }
.file-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-extension { color: #9ba6af; }
.file-node-icon {display:grid;place-items:center;width:24px;height:29px;flex-shrink:0;color:#6c9dbb;}
.file-node-icon svg {width:22px;height:22px;}
.file-app-icon {width:26px;height:29px;}
.file-app-icon img {display:block;width:26px;height:26px;object-fit:contain;}
.file-music-cover {position:relative;width:28px;height:28px;border-radius:5px;overflow:hidden;background:#edf2fa;color:#7186ae;font-size:20px;}
.file-music-cover img {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.files-music-state {display:flex;align-items:center;gap:12px;margin:0 18px 10px;color:#66717e;font-size:12px;line-height:1.6;}
.files-music-state span {min-width:0;overflow-wrap:anywhere;}
.files-music-state button {flex-shrink:0;padding:4px 9px;border:1px solid #dce4ee;border-radius:4px;color:#2877da;}
.files-music-state button:enabled:hover {background:#edf3fa;}
.files-music-state button:disabled {opacity:.5;}
html[data-system-theme="dark"] .file-music-cover {background:#303c4d;color:#a8bce1;}
html[data-system-theme="dark"] .files-music-state {color:#aab8c6;}
html[data-system-theme="dark"] .files-music-state button {border-color:#425469;color:#8dbdff;}
html[data-system-theme="dark"] .files-music-state button:enabled:hover {background:#324357;}
.files-error {margin:0 18px 10px;padding:8px 10px;border-radius:5px;background:#fff4e6;color:#8d5410;font-size:12px;overflow-wrap:anywhere;}
.files-window>.window-status { border-top: 1px solid #e5e7e9; }
.files-empty { padding: 65px 15px; display: flex; flex-direction: column; align-items: center; gap: 12px; font-size: 12px; color: #99a1a8; }
.files-empty svg { width: 36px; height: 36px; color: #b5c6d3; }
.files-empty strong { color: #73818b; font-weight: 500; }
.files-empty button { color: #327ced; font-size: 11px; padding: 8px; }
/* The folder and loading sheet are decorative; the actual table keeps its layout. */
.files-launch {position:fixed;pointer-events:none;isolation:isolate;transform-origin:center;will-change:transform;}
.files-launch-folder {position:absolute;inset:0;display:block;}
.files-launch-back {position:absolute;inset:24% 0 0;border-radius:10px;background:linear-gradient(#008cec,#1f9cf3);box-shadow:0 12px 28px #133f5d30;}
.files-launch-back::before {content:"";position:absolute;left:0;top:-10px;width:52%;height:18px;border-radius:9px 9px 0 0;background:#1598f0;}
.files-launch-paper {position:absolute;inset:20% 8% 7%;display:flex;flex-direction:column;gap:7px;padding:12px 13px;border:1px solid #ffffffbd;border-radius:6px;background:linear-gradient(145deg,#fff,#eaf6ff);box-shadow:0 2px 10px #154e741c;}
.files-launch-caption {margin-bottom:2px;white-space:nowrap;font-size:12px;font-weight:500;line-height:1.4;letter-spacing:.02em;color:#527991;}
.files-close .files-launch-caption {visibility:hidden;}
.files-launch-line {display:block;flex-shrink:0;width:100%;height:5px;border-radius:3px;background:#96c8e7;transform-origin:left;}
.files-launch-line:nth-of-type(2) {width:82%;}
.files-launch-line:nth-of-type(3) {width:60%;}
.files-launch-front {position:absolute;inset:46% 0 0;border-radius:7px 7px 10px 10px;border-top:1px solid #d3f3ffd9;background:linear-gradient(#69d4ff,#30b0f6);box-shadow:0 5px 14px #0867a124;transform-origin:center bottom;}
.files-launch-layer {transform-origin:center;will-change:transform,opacity;}
html[data-system-theme="dark"] .files-launch-back {box-shadow:0 16px 32px #0005;}
html[data-system-theme="dark"] .files-launch-paper {background:linear-gradient(145deg,#f2f9ff,#dceefa);}
@media(max-width:760px) {
  .files-launch-paper {padding:9px 8px;gap:5px;}
  .files-launch-caption {font-size:11px;}
  .files-launch-line {height:4px;}
}
@media(prefers-reduced-motion:reduce) {.files-launch {display:none;}}
@media(max-width: 1000px) { .files-window { left: 85px; width: calc(100vw - 110px); } .files-sidebar { flex-basis: 138px; } .files-location-bar { flex-wrap: wrap; gap: 8px; } .files-search { width: 100%; } }
@media(max-width: 760px) {
  .desktop-file-icon { left: 64px; top: 58px; width: 76px; }
  .files-window { left: 58px; top: 8px; width: calc(100vw - 66px); height: calc(100dvh - 16px); min-width: 0; min-height: 0; }
  .files-layout { flex-direction: column; }
  .files-sidebar { flex: 0 0 auto; max-height:150px; padding:4px 7px; overflow:auto; }
  .files-tree-row {min-height:40px;padding-left:calc(var(--file-depth,0) * 12px);}
  .files-tree-link {font-size:12px;min-height:40px;padding-block:7px;}
  .files-tree-toggle,.files-tree-spacer {flex-basis:30px;width:30px;height:40px;}
  .files-main { min-height: 0; margin: 0 5px; }
  .files-location-bar { padding: 12px 10px 10px; }
  .files-navigation {gap:6px;}
  .files-navigation button {width:28px;height:38px;}
  #files-up {width:32px;height:40px;}
  .files-breadcrumb {height:40px;}
  .files-breadcrumb input {font-size:16px;}
  .files-crumbs button {max-width:145px;}
  .files-error,.files-music-state {margin-inline:10px;}
  .files-actions { padding: 0 10px 10px; }
  .files-sort-label { font-size: 9px; gap: 4px; }
  .files-sort-label select { max-width: 125px; }
  .files-list-scroll { padding: 0 10px; }
  .files-table th:nth-child(2),.files-table th:nth-child(4),.files-table td:nth-child(2),.files-table td:nth-child(4) { display: none; }
  .files-table th:first-child { width: 65%; }
  .files-table th:nth-child(3) { width: 35%; }
  .file-name-cell {padding-left:calc(var(--file-depth,0) * 10px);}
  .file-link { gap: 6px; padding-left: 1px; }
  .file-link .file-icon { width: 19px; height: 25px; }
  .files-table td { font-size: 10px; }
  .files-help { display: none; }
}