/* ============================================================
 * pro-media.css — 媒体分片上传/播放器样式（#40）
 * 严格沿用产品设计令牌：indigo #4F6BED、卡片/线条/圆角，不引入第二套配色
 * ============================================================ */
.media-widget {
  --indigo:#4F6BED; --indigo-600:#3D55D4; --indigo-50:#F2F4FF; --indigo-100:#E8EDFF;
  --ink:#1D1D1F; --ink-2:#6E6E73; --ink-3:#8E8E93;
  --card:#fff; --line:#D2D2D7; --line-2:#E8E8ED; --bg-soft:#F5F5F7;
  --success:#16a34a; --danger:#dc2626; --warning:#d97706;
  --r-lg:12px; --r-xl:16px;
  font-family:inherit; color:var(--ink);
  background:var(--card); border:1px solid var(--line-2);
  border-radius:var(--r-xl); padding:20px; max-width:760px; margin:0 auto;
  box-shadow:0 2px 10px rgba(29,29,31,.05);
}
.media-widget *{box-sizing:border-box;}
.mw-title{font-size:16px;font-weight:700;margin:0 0 4px;}
.mw-sub{font-size:12.5px;color:var(--ink-3);margin:0 0 16px;}

/* 拖拽区 */
.mw-drop{
  border:2px dashed var(--line); border-radius:var(--r-lg);
  padding:28px 16px; text-align:center; cursor:pointer;
  transition:border-color .15s, background .15s; background:var(--bg-soft);
}
.mw-drop:hover,.mw-drop.is-drag{border-color:var(--indigo);background:var(--indigo-50);}
.mw-drop-icon{font-size:28px;line-height:1;margin-bottom:8px;color:var(--indigo);}
.mw-drop-t{font-size:14px;font-weight:600;}
.mw-drop-s{font-size:12px;color:var(--ink-3);margin-top:4px;}

/* 状态条 */
.mw-file{margin-top:14px;border:1px solid var(--line-2);border-radius:var(--r-lg);padding:12px 14px;}
.mw-file-head{display:flex;align-items:center;gap:10px;}
.mw-file-name{font-size:13.5px;font-weight:600;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.mw-file-size{font-size:12px;color:var(--ink-3);}
.mw-badge{font-size:11px;padding:2px 8px;border-radius:999px;font-weight:600;}
.mw-badge.loading{background:var(--indigo-50);color:var(--indigo-600);}
.mw-badge.ok{background:#E8F7EE;color:var(--success);}
.mw-badge.err{background:#FDECEA;color:var(--danger);}
.mw-badge.pause{background:#FFF4E5;color:var(--warning);}

/* 进度条 */
.mw-progress{height:8px;background:var(--line-2);border-radius:999px;overflow:hidden;margin:10px 0 6px;}
.mw-progress-bar{height:100%;background:linear-gradient(90deg,var(--indigo),#6B8AFF);border-radius:999px;width:0;transition:width .2s;}
.mw-meta{display:flex;justify-content:space-between;font-size:12px;color:var(--ink-3);}
.mw-actions{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap;}
.mw-btn{
  border:1px solid var(--line);background:var(--card);color:var(--ink);
  padding:6px 14px;border-radius:8px;font-size:12.5px;cursor:pointer;transition:all .15s;font-weight:500;
}
.mw-btn:hover{border-color:var(--indigo);color:var(--indigo);}
.mw-btn.primary{background:var(--indigo);border-color:var(--indigo);color:#fff;}
.mw-btn.primary:hover{background:var(--indigo-600);color:#fff;}
.mw-btn[disabled]{opacity:.5;cursor:not-allowed;}

/* 空态/错误态 */
.mw-empty{padding:18px;text-align:center;color:var(--ink-3);font-size:13px;}
.mw-error{background:#FDECEA;color:var(--danger);border-radius:8px;padding:10px 12px;font-size:12.5px;margin-top:10px;display:none;}
.mw-error.show{display:block;}

/* 播放器 */
.mw-player{margin-top:16px;border-radius:var(--r-lg);overflow:hidden;background:#000;aspect-ratio:16/9;position:relative;}
.mw-player video{width:100%;height:100%;display:block;}
.mw-player-poster{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-size:14px;background:#111;}
.mw-toolbar{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap;}
.mw-toolbar select{font-size:12px;padding:4px 8px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);}

/* 响应式 */
@media(max-width:640px){
  .media-widget{padding:14px;}
  .mw-drop{padding:20px 10px;}
  .mw-actions .mw-btn{flex:1;text-align:center;}
}