/* 云端上传页 */
.up-body{background:var(--bg);overflow:auto;font-size:15px}
.up-wrap{max-width:760px;margin:0 auto;padding:30px 20px 60px}

.up-head{display:flex;align-items:center;gap:13px;margin-bottom:22px}
.up-logo{
  width:44px;height:44px;border-radius:13px;display:grid;place-items:center;flex:0 0 auto;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));color:#fff;font-weight:800;font-size:14px;
  box-shadow:0 8px 22px rgba(91,110,245,.28)
}
.up-head h1{margin:0;font-size:19px;letter-spacing:-.3px}
.up-head p{margin:2px 0 0;font-size:12.5px;color:var(--ink-3)}
.up-back{
  margin-left:auto;font-size:13px;color:var(--ink-2);text-decoration:none;
  padding:6px 12px;border:1px solid var(--line);border-radius:9px;background:#fff;white-space:nowrap
}
.up-back:hover{color:#3d4bd6;border-color:#c9cfff;background:var(--brand-soft)}

.dropzone{
  position:relative;border:2px dashed #d8dced;border-radius:18px;background:#fff;
  padding:34px 22px;text-align:center;color:var(--ink-2);transition:.16s;cursor:pointer;
  box-shadow:0 2px 10px rgba(22,25,34,.04)
}
.dropzone:hover{border-color:#c3caff;background:#fcfcff}
.dropzone.drag{border-color:var(--brand);background:#f5f6ff}
.dz-icon{color:#b9c0d8;margin-bottom:10px}
.dropzone.drag .dz-icon{color:var(--brand)}
.dz-title{font-size:15px;font-weight:600;color:var(--ink)}
.dz-link{border:0;background:transparent;color:#4356e8;font-weight:700;cursor:pointer;font-size:15px;padding:0;font-family:inherit}
.dz-link:hover{text-decoration:underline}
.dz-sub{margin-top:7px;font-size:12.5px;color:var(--ink-3)}
.dz-hint{
  position:absolute;inset:0;border-radius:16px;background:rgba(238,240,255,.95);
  display:grid;place-items:center;font-weight:700;color:#3d4bd6;opacity:0;pointer-events:none;transition:.15s
}
.dropzone.drag .dz-hint{opacity:1}

.up-stats{
  display:flex;align-items:center;gap:10px;margin:16px 2px 4px;
  font-size:12.5px;color:var(--ink-2);flex-wrap:wrap
}
.up-btn{
  border:1px solid var(--line);background:#fff;color:var(--ink-2);font-size:12.5px;
  padding:5px 11px;border-radius:8px;cursor:pointer;font-family:inherit;transition:.14s
}
.up-btn:hover{color:#3d4bd6;border-color:#c9cfff;background:var(--brand-soft)}
.up-btn.ghost{margin-left:auto}
.up-btn.ghost + .up-btn.ghost{margin-left:0}

.uplist{display:flex;flex-direction:column;gap:9px;margin-top:14px}
.row{
  display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);
  border-radius:12px;padding:11px 13px;box-shadow:0 1px 3px rgba(22,25,34,.04)
}
.row.done{border-color:#d6f0e0;background:#fbfefc}
.row.err{border-color:#fbd5d5;background:#fffafa}
.row .fico{
  width:38px;height:38px;border-radius:9px;background:#f2f4fb;border:1px solid #e8eaf3;
  display:grid;place-items:center;flex:0 0 auto;font-size:10px;font-weight:800;color:#7b829e;letter-spacing:.3px
}
.row.done .fico{background:#eafaf0;border-color:#cdeed9;color:#0f7a3d}
.row .fmain{flex:1;min-width:0}
.row .fname{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .fmeta{font-size:11.5px;color:var(--ink-3);margin-top:2px;font-family:var(--mono);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .fmeta a{color:#4356e8;text-decoration:none}
.row .fmeta a:hover{text-decoration:underline}
.bar{height:4px;background:#eef0f8;border-radius:99px;overflow:hidden;margin-top:7px}
.bar i{display:block;height:100%;width:0;border-radius:99px;
  background:linear-gradient(90deg,var(--brand),var(--brand-2));transition:width .18s}
.row.done .bar i{background:linear-gradient(90deg,#34d399,#12a150)}
.row .act{flex:0 0 auto;display:flex;gap:5px}
.row .act button{
  border:1px solid var(--line);background:#fff;color:var(--ink-2);font-size:11.5px;
  padding:4px 9px;border-radius:7px;cursor:pointer;font-family:inherit;white-space:nowrap
}
.row .act button:hover{color:#3d4bd6;border-color:#c9cfff;background:var(--brand-soft)}
.pct{font-family:var(--mono);font-size:11.5px;color:var(--ink-3);flex:0 0 auto;min-width:38px;text-align:right}

.up-foot{
  margin-top:34px;padding-top:14px;border-top:1px solid var(--line);
  display:flex;flex-direction:column;gap:5px;font-size:11.5px;color:var(--ink-3)
}
.up-foot code{background:#f1f3fa;border:1px solid #e6e9f4;border-radius:4px;padding:1px 5px;font-size:11px;color:#5a6280}

@media (max-width:560px){
  .up-wrap{padding:20px 13px 40px}
  .up-head h1{font-size:17px}
  .dropzone{padding:26px 14px}
  .row{padding:9px 10px;gap:9px}
  .row .act button{padding:4px 7px}
  .up-btn.ghost{margin-left:0}
}