:root { --line: #e3e6ea; --main: #2b6cf6; --muted: #7b8494; }
* { box-sizing: border-box; }
body { margin: 0; padding: 24px; font: 14px/1.6 "Microsoft YaHei", system-ui, sans-serif;
       color: #1f2429; background: #f5f6f8; }
.wrap { max-width: 1000px; margin: 0 auto; }
.head { display: flex; justify-content: flex-end; gap: 10px; margin-bottom: 14px; }
.card { background: #fff; border: 1px solid var(--line); border-radius: 8px;
        padding: 16px; margin-bottom: 14px; }
label { display: block; font-size: 13px; color: var(--muted); margin-bottom: 6px; }
textarea, input[type=text], input[type=password] {
  width: 100%; border: 1px solid var(--line); border-radius: 6px; padding: 9px 11px;
  font: inherit; outline: none; background: #fff; }
textarea:focus, input[type=text]:focus, input[type=password]:focus { border-color: var(--main); }
textarea { height: 84px; resize: vertical; }
.row { display: flex; gap: 12px; margin-top: 12px; }
.row > div { flex: 1; }
.row > div.pwd { flex: 0 0 130px; }
button { border: 0; border-radius: 6px; padding: 9px 18px; font: inherit;
         background: var(--main); color: #fff; cursor: pointer; }
button:disabled { background: #b9c3d4; cursor: not-allowed; }
button.ghost { background: #eef1f6; color: #1f2429; }
button.mini { padding: 5px 10px; font-size: 12px; background: #eef1f6; color: #1f2429; }
.btnbar { display: flex; align-items: center; gap: 10px; margin-top: 14px; flex-wrap: wrap; }
.status { color: var(--muted); font-size: 13px; }
.status.err { color: #d33; }
.tree { max-height: 340px; overflow: auto; border: 1px solid var(--line);
        border-radius: 6px; padding: 6px; margin-top: 4px; }
.node { display: flex; align-items: center; gap: 8px; padding: 5px 6px; border-radius: 5px; }
.node:hover { background: #f3f6fd; }
.node .name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.node .size { color: var(--muted); font-size: 12px; }
.kids { margin-left: 22px; }
.expand { width: 18px; text-align: center; color: var(--muted); cursor: pointer; user-select: none; }
.expand.leaf { cursor: default; visibility: hidden; }
table.links { width: 100%; border-collapse: collapse; }
table.links th, table.links td { border-bottom: 1px solid var(--line); padding: 8px 6px;
        text-align: left; font-size: 13px; vertical-align: top; }
table.links th { color: var(--muted); font-weight: normal; }
table.links input { width: 100%; border: 1px solid var(--line); border-radius: 4px;
        padding: 5px 7px; font: 12px/1.5 Consolas, monospace; background: #fafbfc; }
.acts { display: flex; gap: 6px; white-space: nowrap; }
.size { color: var(--muted); font-size: 12px; }
td.time { color: var(--muted); font-size: 12px; white-space: nowrap; }
.err { color: #d33; font-size: 12px; }
.hide { display: none; }
/* 设置弹窗 */
.mask { position: fixed; inset: 0; background: rgba(15,20,30,.45); display: flex;
        align-items: center; justify-content: center; z-index: 20; }
.mask.hide { display: none; }
.modal { background: #fff; border-radius: 10px; padding: 20px; width: 460px;
         max-width: calc(100vw - 32px); box-shadow: 0 12px 40px rgba(0,0,0,.2); }
.modal h2 { font-size: 16px; margin: 0 0 16px; }
.field { margin-bottom: 14px; }
.field a.dl-link { font-size: 14px; text-decoration: none; }
.field a.dl-link:hover { text-decoration: underline; }
.switch { display: flex; align-items: center; gap: 8px; font-size: 13px; color: #1f2429; }
.switch input { width: 16px; height: 16px; }
.switch.off { color: var(--muted); }
.modal .btnbar { justify-content: flex-end; }
a { color: var(--main); }