:root {
  --ink:#18312d;
  --muted:#72807c;
  --line:#e4eae7;
  --green:#137862;
  --soft:#eaf4ef;
  --bg:#f5f7f5;
  --danger:#ad3c3c;
  font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;
  color:var(--ink);
  background:var(--bg);
  font-size:14px;
  font-synthesis:none;
}
* {
  box-sizing:border-box;
}
body {
  margin:0;
}
button,input,select,textarea {
  font:inherit;
}
button {
  cursor:pointer;
  border:1px solid #d8e0db;
  background:#fff;
  border-radius:7px;
  padding:9px 15px;
  color:var(--ink);
  font-weight:550;
  transition:background .15s,border-color .15s;
}
button:hover {
  background:#f1f5f2;
  border-color:#b6c9bf;
}
button:disabled {
  opacity:.45;
  cursor:not-allowed;
}
button.primary {
  background:var(--green);
  border-color:var(--green);
  color:#fff;
}
button.primary:hover {
  background:#0c6350;
}
input,select,textarea {
  width:100%;
  border:1px solid #d6dfd8;
  background:#fff;
  border-radius:6px;
  padding:10px 12px;
  color:var(--ink);
  outline:none;
}
input:focus,select:focus,textarea:focus {
  border-color:var(--green);
  box-shadow:0 0 0 3px #13786217;
}
button:focus-visible,a:focus-visible {
  outline:3px solid #84c9b3;
  outline-offset:3px;
}
label {
  display:block;
  margin:17px 0 7px;
  font-size:13px;
  font-weight:600;
}
textarea {
  resize:vertical;
}
h1,h2,h3,p {
  margin:0;
}
h1 {
  font-size:29px;
  letter-spacing:-.8px;
  font-weight:650;
  line-height:1.4;
}
h2 {
  font-size:16px;
  font-weight:650;
}
h3 {
  font-size:14px;
  font-weight:600;
}
.muted {
  color:var(--muted);
  line-height:1.7;
  margin-top:8px;
}
.subtle,.field-help {
  color:var(--muted);
  font-size:12px;
  line-height:1.65;
}
.subtle {
  margin-top:5px;
}
.eyebrow {
  font-size:10px;
  font-weight:650;
  letter-spacing:1.7px;
  color:#7d8d83;
  margin-bottom:10px;
}
.error {
  color:var(--danger);
  font-size:13px;
  line-height:1.6;
  min-height:0;
  margin-top:12px;
}
.error:empty {
  display:none;
}
[hidden] {
  display:none!important;
}
.full {
  width:100%;
}
.brand {
  display:flex;
  align-items:center;
  gap:10px;
  font-size:19px;
  font-weight:650;
  letter-spacing:-.3px;
}
.brand-mark {
  display:flex;
  align-items:center;
  justify-content:center;
  background:#d4edbc;
  color:#1c4335;
  width:35px;
  height:37px;
  border-radius:8px;
  font-size:23px;
  font-weight:750;
}
.brand small {
  display:block;
  font-size:10px;
  font-weight:400;
  letter-spacing:1.4px;
  margin-top:5px;
  color:#a9bcb2;
}
.app {
  display:flex;
  min-height:100vh;
}
.sidebar {
  width:218px;
  flex-shrink:0;
  background:#17372d;
  color:#f4f7f2;
  padding:29px 19px;
  position:fixed;
  inset:0 auto 0 0;
  display:flex;
  flex-direction:column;
}
.sidebar .brand {
  margin-left:5px;
}
.nav-label {
  font-size:10px;
  color:#91a99a;
  letter-spacing:1.4px;
  margin:48px 14px 14px;
}
nav {
  display:grid;
  gap:7px;
}
.nav-item {
  text-align:left;
  display:flex;
  align-items:center;
  gap:12px;
  width:100%;
  border:0;
  background:transparent;
  color:#b8c9be;
  padding:13px 14px;
  font-size:13px;
  font-weight:500;
}
.nav-item:hover {
  background:#284b3c;
  color:#fff;
}
.nav-item.active {
  background:#d3e8bd;
  color:#1e3d29;
  font-weight:650;
}
.nav-symbol {
  font-size:19px;
  line-height:1;
  width:20px;
  text-align:center;
}
.sidebar-bottom {
  margin-top:auto;
  padding:24px 10px 0;
  display:flex;
  align-items:center;
  font-size:11px;
  color:#a5bcae;
  gap:7px;
}
.status-dot {
  height:6px;
  width:6px;
  border-radius:50%;
  background:#a1c98a;
}
.version {
  margin-left:auto;
  color:#789783;
}
.workspace {
  margin-left:218px;
  flex:1;
  min-width:0;
  display:flex;
  flex-direction:column;
}
.topbar {
  height:66px;
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 34px;
  background:#fff;
  font-size:12px;
  color:var(--muted);
  gap:12px;
}
.slash {
  margin:0 13px;
  color:#bec8c1;
}
.account {
  display:flex;
  align-items:center;
  gap:12px;
}
.text-button {
  border:0;
  background:transparent;
  padding:5px;
  color:var(--muted);
  font-size:12px;
}
.badge {
  font-size:10px;
  padding:4px 7px;
  background:#eff3ef;
  border-radius:4px;
  color:#65776b;
  white-space:nowrap;
}
.badge.green {
  background:#e7f3ea;
  color:#33724c;
}
.badge.amber {
  background:#fbf2df;
  color:#8b691c;
}
.badge.red {
  background:#f9e8e7;
  color:#9b4040;
}
main {
  padding:36px 34px 24px;
  width:100%;
  max-width:1520px;
  margin:0 auto;
  flex:1;
}
.page-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:28px;
}
.stats {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-bottom:26px;
}
.stat {
  background:#fff;
  border:1px solid var(--line);
  border-radius:9px;
  padding:20px 23px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.stat>span {
  font-size:12px;
  color:#7b8780;
}
.stat strong {
  font-size:30px;
  font-weight:650;
  letter-spacing:-.7px;
  margin:9px 0 7px;
  font-variant-numeric:tabular-nums;
}
.stat small {
  font-size:11px;
  color:#95a095;
}
.feature-stat {
  background:#eaf0e5;
  border-color:#dfe7d9;
  justify-content:center;
}
.feature-stat strong {
  font-size:17px;
  letter-spacing:0;
  margin:14px 0 9px;
}
.feature-stat .mini-label {
  font-size:11px;
  color:#6e8067;
}
.feature-stat small {
  color:#7d8d78;
}
.panel {
  background:#fff;
  border:1px solid var(--line);
  border-radius:9px;
  overflow:hidden;
}
.panel-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:21px 23px;
}
.count {
  font-size:11px;
  background:#eff3ee;
  border-radius:5px;
  padding:3px 7px;
  color:#6c7e6d;
  vertical-align:middle;
  margin-left:6px;
}
.search {
  display:flex;
  gap:7px;
}
.search input {
  width:235px;
  font-size:12px;
}
.search button {
  font-size:12px;
}
.table-wrap {
  overflow:auto;
}
table {
  border-collapse:collapse;
  text-align:left;
  width:100%;
  font-size:12px;
}
th {
  font-weight:500;
  color:#879389;
  background:#f8faf7;
  padding:12px 23px;
  white-space:nowrap;
  border-top:1px solid #eef2ed;
  border-bottom:1px solid #eef2ed;
}
td {
  padding:18px 23px;
  border-bottom:1px solid #eef2ed;
  vertical-align:middle;
}
tbody tr:last-child td {
  border-bottom:0;
}
tbody tr:hover {
  background:#fcfdfb;
}
.right {
  text-align:right;
}
.file-cell {
  display:flex;
  gap:12px;
  align-items:center;
  min-width:200px;
  max-width:480px;
}
.file-mark {
  height:37px;
  min-width:33px;
  padding:0 5px;
  background:#f1f4ed;
  border:1px solid #e7ece1;
  border-radius:5px;
  color:#7f936b;
  font-size:9px;
  font-weight:650;
  display:flex;
  align-items:center;
  justify-content:center;
}
.file-info {
  min-width:0;
}
.path-button {
  border:0;
  padding:0;
  background:transparent;
  text-align:left;
  max-width:100%;
  overflow-wrap:anywhere;
  font-size:12px;
  color:#224c3b;
  font-weight:600;
  line-height:1.5;
}
.path-button:hover {
  background:transparent;
  color:var(--green);
  text-decoration:underline;
}
.description {
  font-size:11px;
  color:#89938c;
  margin-top:5px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:280px;
}
.hash {
  font-family:Consolas,monospace;
  font-size:10px;
  color:#a1aaa4;
  margin-top:4px;
}
.nowrap {
  white-space:nowrap;
}
.actions {
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
}
.actions button {
  border:0;
  padding:5px 6px;
  font-size:11px;
  color:#617766;
  background:transparent;
  white-space:nowrap;
}
.actions button:hover {
  background:#edf3eb;
}
.actions .danger {
  color:#b68378;
}
.actions .danger:hover {
  background:#f9eeea;
  color:var(--danger);
}
.pagination {
  border-top:1px solid var(--line);
  padding:14px 23px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:11px;
  color:#8b978e;
}
.pagination>div {
  display:flex;
  gap:8px;
}
.pagination button {
  font-size:11px;
  padding:6px 10px;
}
.empty {
  text-align:center;
  padding:58px 20px;
  color:var(--muted);
}
.empty h3 {
  color:#617268;
  margin:10px 0;
}
.empty p {
  font-size:12px;
}
.empty-icon {
  font-size:32px;
  color:#a8b99f;
}
.footnote {
  font-size:11px;
  color:#93a08f;
  margin-top:16px;
  line-height:1.7;
}
.app-footer {
  padding:18px 34px;
  display:flex;
  justify-content:space-between;
  color:#92a18e;
  font-size:10px;
  letter-spacing:.4px;
}
.ranking {
  margin-bottom:22px;
}
.ranking-item {
  padding:12px 23px;
  display:flex;
  align-items:center;
  gap:16px;
  border-top:1px solid #eff3ed;
  font-size:12px;
}
.rank {
  font-size:11px;
  color:#8fa284;
  min-width:17px;
}
.ranking-path {
  flex:1;
  overflow-wrap:anywhere;
}
.ranking-value {
  font-variant-numeric:tabular-nums;
  color:#467149;
  white-space:nowrap;
}
.settings-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  max-width:1080px;
}
.panel-body {
  padding:0 23px 24px;
}
.stack {
  display:flex;
  flex-direction:column;
  align-items:stretch;
}
.stack>label:first-child {
  margin-top:0;
}
.stack button {
  align-self:flex-start;
  margin-top:22px;
}
.user-list {
  margin-top:25px;
}
.user-row {
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:13px 0;
  border-top:1px solid var(--line);
  gap:8px;
}
.user-row>div {
  display:flex;
  align-items:center;
  gap:10px;
  overflow-wrap:anywhere;
}
.maintenance {
  grid-column:1/-1;
}
.maintenance-row {
  padding:20px 23px;
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.maintenance-row button {
  white-space:nowrap;
}
.danger-outline {
  color:var(--danger);
}
.login-screen {
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:30px;
  background:radial-gradient(ellipse at 15% 20%,#e1eadc,transparent 50%),#f4f6f1;
}
.login-card {
  width:420px;
  max-width:100%;
  padding:38px;
  background:#fff;
  border:1px solid #e0e7dd;
  border-radius:14px;
  box-shadow:0 18px 60px #28472e0a;
}
.login-card .brand {
  margin-bottom:40px;
}
.login-card h1 {
  font-size:26px;
}
.login-card .primary {
  margin-top:23px;
}
.login-footer {
  margin-top:28px;
  padding-top:22px;
  border-top:1px solid var(--line);
  font-size:10px;
  color:#92a08c;
}
.login-card .brand-mark {
  background:#17372d;
  color:#d4edbc;
}
dialog {
  border:1px solid #dce5dc;
  border-radius:12px;
  width:570px;
  max-width:calc(100vw - 32px);
  max-height:90vh;
  padding:0;
  color:var(--ink);
  box-shadow:0 20px 90px #16352830;
}
dialog::backdrop {
  background:#152d2560;
  backdrop-filter:blur(2px);
}
.dialog-heading {
  padding:23px 26px 19px;
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.dialog-heading .eyebrow {
  margin-bottom:6px;
}
.dialog-heading h2 {
  font-size:20px;
}
.close {
  border:0;
  background:transparent;
  font-size:25px;
  font-weight:400;
  color:#95a194;
  padding:0 5px;
}
.dialog-body {
  padding:0 26px 20px;
}
.dialog-footer {
  padding:16px 26px;
  background:#f8faf7;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:flex-end;
  gap:9px;
}
.optional {
  font-size:10px;
  font-weight:400;
  color:#a2aba0;
  margin-left:6px;
}
.field-help {
  font-size:11px;
  margin-top:7px;
}
.form-columns {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}
.path-label {
  padding-top:20px;
  font-family:Consolas,"Microsoft YaHei",monospace;
  overflow-wrap:anywhere;
  color:#667c64;
}
.checkbox {
  display:flex;
  align-items:center;
  gap:8px;
}
.checkbox input {
  width:auto;
  accent-color:var(--green);
}
progress {
  width:100%;
  height:7px;
  accent-color:var(--green);
  margin-top:20px;
}
.toast {
  position:fixed;
  bottom:28px;
  left:50%;
  transform:translateX(-50%);
  padding:13px 22px;
  border-radius:8px;
  background:#17372d;
  color:#fff;
  font-size:13px;
  max-width:calc(100vw - 36px);
  box-shadow:0 8px 24px #12271d20;
  z-index:100;
}
.toast.failure {
  background:#8c3d32;
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
@media(min-width:1500px) {
  main {
    padding-top:42px;
  }
  .resource-table td {
    padding-top:21px;
    padding-bottom:21px;
  }
}
@media(max-width:1100px) {
  .sidebar {
    width:186px;
    padding-left:14px;
    padding-right:14px;
  }
  .workspace {
    margin-left:186px;
  }
  main {
    padding:28px 23px;
  }
  .topbar {
    padding:0 23px;
  }
  .stat {
    padding:18px;
  }
  .feature-stat strong {
    font-size:14px;
  }
  td,th {
    padding-left:16px;
    padding-right:16px;
  }
  .file-cell {
    min-width:170px;
  }
  .description {
    max-width:210px;
  }
  .panel-toolbar {
    padding:18px;
  }
  .search input {
    width:190px;
  }
}
@media(max-width:760px) {
  .app {
    display:block;
  }
  .sidebar {
    position:static;
    width:100%;
    padding:17px 18px 12px;
    display:block;
  }
  .sidebar .brand {
    font-size:17px;
  }
  .sidebar .brand small {
    display:none;
  }
  .brand-mark {
    width:29px;
    height:30px;
    font-size:20px;
  }
  .nav-label,.sidebar-bottom {
    display:none;
  }
  nav {
    display:flex;
    gap:7px;
    margin-top:18px;
  }
  .nav-item {
    justify-content:center;
    padding:10px 12px;
    font-size:12px;
  }
  .nav-symbol {
    font-size:16px;
    width:16px;
  }
  .workspace {
    margin:0;
  }
  .topbar {
    height:52px;
    padding:0 18px;
    font-size:11px;
  }
  .account {
    gap:8px;
  }
  main {
    padding:25px 17px;
  }
  .page-heading {
    gap:12px;
    align-items:flex-start;
    margin-bottom:20px;
  }
  .page-heading h1 {
    font-size:25px;
  }
  .page-heading>.primary {
    font-size:12px;
    white-space:nowrap;
    margin-top:20px;
  }
  .muted {
    font-size:12px;
  }
  .stats {
    gap:10px;
    grid-template-columns:repeat(2,minmax(0,1fr));
    margin-bottom:20px;
  }
  .stat {
    padding:16px;
  }
  .stat strong {
    font-size:25px;
  }
  .stats .stat:last-child {
    grid-column:1/-1;
  }
  .feature-stat strong {
    font-size:16px;
  }
  .feature-stat {
    padding:16px;
  }
  .panel-toolbar {
    flex-wrap:wrap;
    padding:16px;
  }
  .search {
    width:100%;
  }
  .search input {
    flex:1;
    width:0;
  }
  .resource-table {
    min-width:700px;
  }
  table:not(.resource-table) {
    min-width:720px;
  }
  .pagination {
    padding:14px;
  }
  .settings-grid {
    grid-template-columns:1fr;
  }
  .maintenance-row {
    align-items:flex-start;
    flex-direction:column;
    gap:13px;
  }
  .app-footer {
    padding:14px 18px;
  }
  .form-columns {
    grid-template-columns:1fr;
    gap:0;
  }
  .dialog-heading {
    padding:20px;
  }
  .dialog-body {
    padding:0 20px 18px;
  }
  .dialog-footer {
    padding:15px 20px;
  }
  .login-card {
    padding:30px;
  }
  .ranking .panel-toolbar .subtle {
    font-size:10px;
  }
  .settings-grid .maintenance {
    grid-column:auto;
  }
}
@media(prefers-reduced-motion:reduce) {
  * {
    transition:none!important;
    scroll-behavior:auto!important;
  }
}

.project-bar { margin-bottom: 20px; }
.project-toolbar { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.project-toolbar select { flex: 1 1 240px; width: auto; min-width: 0; max-width: 460px; min-height: 44px; font-size: 15px; }
.project-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.project-actions button { min-height: 44px; padding: 10px 18px; font-size: 15px; font-weight: 600; white-space: nowrap; }
.project-actions button:not(.primary) { background: var(--soft); border-color: #b4cfc1; color: var(--green); }
.project-actions button:not(.primary):hover { background: #dceee3; border-color: var(--green); }
@media (max-width: 640px) {
  .project-toolbar select { flex-basis: 100%; max-width: none; }
  .project-actions { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-actions button { padding: 10px 12px; }
}
.choice-list { display: grid; gap: 10px; max-height: 260px; overflow-y: auto; padding: 8px 0; }
.choice-list .checkbox { display: flex; align-items: center; gap: 8px; }
.choice-list input { width: auto; }
fieldset { border: 1px solid #dfe5ef; border-radius: 8px; min-width: 0; }
.user-row { flex-wrap: wrap; gap: 10px; }

.upload-file-list { display: grid; gap: 12px; max-height: 300px; overflow-y: auto; margin-top: 14px; }
.upload-file-row { border: 1px solid #dfe5ef; border-radius: 8px; padding: 10px; display: grid; gap: 6px; }
.upload-file-path { margin: 0; overflow-wrap: anywhere; font-size: 13px; }
.upload-file-row progress { width: 100%; }
.upload-file-row button { justify-self: start; }

.upload-summary { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
#upload-progress { width: 100%; height: 12px; }
.upload-task-panel { margin-top: 20px; }
.upload-filters { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.upload-filters select { width: 130px; }
.upload-filters input { width: 240px; }
.upload-task-scroll { max-height: 65vh; overflow: auto; }
.upload-task-table { width: 100%; min-width: 780px; table-layout: fixed; }
.upload-task-table th { position: sticky; top: 0; background: #f6f8f5; z-index: 1; }
.upload-task-table th:nth-child(1) { width: 36%; }
.upload-task-table th:nth-child(2) { width: 10%; }
.upload-task-table th:nth-child(3) { width: 23%; }
.upload-task-table th:nth-child(4) { width: 23%; }
.upload-task-table th:nth-child(5) { width: 8%; }
.upload-task-table td { padding: 10px 12px; overflow-wrap: anywhere; }
.upload-task-progress progress { width: calc(100% - 48px); vertical-align: middle; }
.upload-row-percent { display: inline-block; width: 44px; text-align: right; font-size: 12px; }
.upload-task-table .error { margin: 0; font-size: 12px; }

.project-user-panel { grid-column: 1 / -1; }
.project-user-layout { display: grid; grid-template-columns: 230px minmax(0, 1fr); }
.settings-projects { padding: 16px; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 8px; max-height: 620px; overflow-y: auto; }
.settings-project-button { display: flex; text-align: left; align-items: center; flex-wrap: wrap; gap: 8px; padding: 12px; }
.settings-project-button strong { flex: 1; overflow-wrap: anywhere; }
.settings-project-button small { flex-basis: 100%; color: var(--muted); }
.settings-project-button.selected { background: var(--soft); border-color: var(--green); }
.project-user-content { min-width: 0; }
.project-user-content .panel-toolbar { flex-wrap: wrap; gap: 12px; }
#settings-user-search { max-width: 230px; }
.settings-user-table { min-width: 680px; }
.settings-user-table td { overflow-wrap: anywhere; max-width: 240px; }
.user-table-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.user-table-actions button { padding: 7px 10px; font-size: 13px; white-space: nowrap; }
.project-user-content .footnote { padding: 12px 20px; }
@media (max-width: 850px) {
  .project-user-layout { grid-template-columns: 1fr; }
  .settings-projects { flex-direction: row; flex-wrap: wrap; max-height: 200px; border-right: 0; border-bottom: 1px solid var(--line); }
  .settings-project-button { flex: 1 0 160px; }
}

.settings-user-table td:first-child { min-width: 125px; }
.settings-user-table td:first-child strong { white-space: nowrap; }

/* 独立成员页使用紧凑行和固定表头，较多账号时仍能对应列名。 */
#page-members .settings-user-table td { padding: 8px 12px; }
#page-members .settings-user-table th { padding: 10px 12px; position: sticky; top: 0; background: var(--soft); z-index: 1; }
#page-members .project-user-content .table-wrap { max-height: 65vh; overflow: auto; }
#page-members .settings-user-table td:nth-child(4) { white-space: nowrap; }
#page-members .settings-projects { gap: 4px; padding: 12px; }
#page-members .settings-project-button { padding: 8px 10px; }

/* 上传选择和逐文件进度共享窗口，长列表独立滚动。 */
#upload-dialog { width: min(1200px, 96vw); max-width: 96vw; }
#upload-dialog .dialog-body { padding-top: 12px; }
#upload-dialog .upload-task-panel { margin: 0 24px 24px; }
#upload-dialog > .panel { margin: 0 24px 16px; }
#upload-dialog .upload-task-scroll { max-height: 38vh; }
.upload-drop-zone { padding: 24px; border: 2px dashed var(--green); border-radius: 10px; background: var(--soft); text-align: center; margin-bottom: 16px; }

#upload-dialog[open] { display: grid; grid-template-columns: 340px minmax(0, 1fr); grid-template-rows: max-content 1fr; align-items: start; }
#upload-dialog #upload-form { grid-row: span 2; border-right: 1px solid var(--line); }
#upload-dialog > .panel { margin: 16px 16px 0; min-width: 0; }
#upload-dialog .dialog-heading { padding: 14px 20px; }
#upload-dialog .dialog-body { padding: 12px 20px; }
#upload-dialog .dialog-body label { margin-top: 10px; }
#upload-dialog .upload-drop-zone { padding: 14px; }
#upload-dialog .upload-task-scroll { max-height: 52vh; }
#upload-dialog .upload-task-table { min-width: 570px; }
#upload-dialog .upload-task-panel { margin-bottom: 16px; }
#upload-dialog progress { margin-top: 8px; }
@media (max-width: 850px) {
  #upload-dialog[open] { display: block; }
  #upload-dialog #upload-form { border-right: 0; }
}

.backup-scroll { max-height: 420px; overflow: auto; }
.backup-scroll td { overflow-wrap: anywhere; max-width: 350px; }

.resource-breadcrumbs, .resource-folders { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 20px; border-top: 1px solid var(--line); }
.resource-folders:empty { display: none; }
.folder-entry { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 10px 16px; cursor: pointer; }
.folder-entry img { flex: 0 0 24px; }
.folder-entry .folder-name { font-size: 14px; font-weight: 600; }
.resource-breadcrumbs button, .resource-folders button { overflow-wrap: anywhere; text-align: left; }

/* 单栏紧凑列表固定可视高度，切换少量文件的目录也不会压缩页面导致滚动跳动。 */
.resource-explorer { border-top: 1px solid var(--line); }
.directory-content { min-width: 0; }
.directory-content > .table-wrap { height: clamp(540px, 70vh, 900px); overflow: auto; overflow-anchor: none; }
.resource-table td { padding: 8px 14px; height: 44px; }
.resource-table .file-cell { gap: 10px; }
.resource-table .file-mark { width: 28px; height: 28px; min-width: 28px; font-size: 9px; }
.resource-table .file-info { min-width: 0; }
.resource-table .path-button { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.resource-table .actions { flex-wrap: nowrap; white-space: nowrap; }
.directory-row .folder-entry { min-height: 28px; padding: 0; border: 0; background: transparent; }
.resource-table th { position: sticky; top: 0; background: var(--soft); z-index: 1; }

/* 动态替换目录内容时禁止浏览器自行选择滚动锚点。 */
html, body, #page-resources { overflow-anchor: none; }

/* 合并标题、路径和目录操作，深路径横向滚动，避免占用文件展示高度。 */
.file-toolbar { display: flex; align-items: center; gap: 12px; padding: 12px 16px; }
.file-toolbar h2 { flex-shrink: 0; font-size: 15px; white-space: nowrap; }
.file-toolbar .resource-breadcrumbs { flex: 1; min-width: 100px; flex-wrap: nowrap; overflow-x: auto; padding: 0; border: 0; }
.file-toolbar .resource-breadcrumbs button { flex-shrink: 0; white-space: nowrap; padding: 7px 9px; }
.file-toolbar-actions { display: flex; gap: 6px; flex-shrink: 0; }
.file-toolbar-actions button { padding: 7px 10px; white-space: nowrap; }
.file-toolbar .search { flex: 0 1 210px; min-width: 160px; }
.file-toolbar .search input { min-width: 0; width: 100%; }
@media (max-width: 850px) {
  .file-toolbar { flex-wrap: wrap; }
  .file-toolbar .resource-breadcrumbs { min-width: 45%; }
  .file-toolbar .search { flex: 1; }
}

.file-toolbar .search button { flex-shrink: 0; white-space: nowrap; }
.file-toolbar .resource-breadcrumbs:focus { outline: none; }
.file-toolbar .resource-breadcrumbs:focus-visible { outline: 2px solid var(--green); }