/* 视频审片
 *
 * 版式：列表用卡片，审片台是「左播放器 / 右批注」两栏。
 * 窄屏必须竖排 —— 手机上左右分栏会把播放器压成一条缝，
 * 片子根本没法看，批注也没地方写。
 */

.rv-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:14px 0}
.rv-toolbar .input{max-width:280px}

.rv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));
  gap:12px;min-width:0}

.rv-card{border:1px solid var(--line);border-radius:12px;padding:13px 14px;background:#fff;
  display:flex;flex-direction:column;gap:8px;cursor:pointer;transition:.15s;min-width:0}
.rv-card:hover{border-color:#c9d3e6;box-shadow:var(--shadow);transform:translateY(-1px)}
.rv-card-head{display:flex;align-items:flex-start;gap:8px;justify-content:space-between}
.rv-card-title{font-weight:700;font-size:14.5px;line-height:1.35;min-width:0;
  overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.rv-card-sub{color:var(--txt-3);font-size:12.5px;display:flex;gap:6px;flex-wrap:wrap;min-width:0}
.rv-card-sub .sep{color:var(--line)}
.rv-card-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding-top:8px;border-top:1px dashed var(--line-2)}
.rv-ep{font-weight:700;color:var(--brand)}

/* 状态胶囊 */
.rv-st{font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:999px;white-space:nowrap;flex-shrink:0}
.rv-st.reviewing{background:#fff5e6;color:#b26a00}
.rv-st.changes{background:#fdecec;color:#c62828}
.rv-st.approved{background:#e8f6ee;color:#1a7f45}
.rv-st.superseded{background:#f1f3f6;color:#7a8699}

.rv-badge{font-size:11.5px;font-weight:700;color:#b26a00;background:#fff5e6;
  padding:2px 7px;border-radius:999px}

/* 审片台 */
.rv-detail{margin-top:18px;border:1px solid var(--line);border-radius:14px;
  background:#fff;padding:16px 18px 18px}
.rv-detail-head{display:flex;justify-content:space-between;align-items:flex-start;
  gap:12px;flex-wrap:wrap;margin-bottom:14px}
.rv-detail-head h3{margin:0 0 4px;font-size:16px}
.rv-detail-actions{display:flex;gap:8px;flex-wrap:wrap}

.rv-body{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:16px;align-items:start}
@media (max-width:960px){ .rv-body{grid-template-columns:minmax(0,1fr)} }

.rv-player-side{min-width:0;display:flex;flex-direction:column;gap:10px}
.rv-player-wrap{position:relative;background:#0d1117;border-radius:10px;overflow:hidden;
  aspect-ratio:16/9;min-width:0}
.rv-player-wrap video{width:100%;height:100%;display:block;object-fit:contain;background:#0d1117}
.rv-video-empty{position:absolute;inset:0;display:none;flex-direction:column;
  align-items:center;justify-content:center;gap:8px;color:#aab4c4;text-align:center;padding:20px}
.rv-video-empty.show{display:flex}
.rv-video-empty p{margin:0;font-size:13px}
.rv-video-empty a{color:#fff}

.rv-timebar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rv-now{font-variant-numeric:tabular-nums;font-weight:700;font-size:15px;color:var(--brand)}
#rvTimeHint{flex:1;min-width:120px}
@media (max-width:640px){ #rvTimeHint{display:none} }

.rv-composer{border:1px solid var(--line);border-radius:10px;padding:12px;
  background:#fafbfd;display:flex;flex-direction:column;gap:9px}
.rv-composer-head{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.rv-t{max-width:78px;text-align:center;font-variant-numeric:tabular-nums}
.rv-text{width:100%;resize:vertical;font-family:inherit;padding:9px 11px;
  border:1px solid var(--line);border-radius:8px;outline:none}
.rv-text:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.rv-composer-foot{display:flex;justify-content:flex-end;gap:8px}

/* 批注栏 */
.rv-notes-side{border:1px solid var(--line-2);border-radius:10px;
  display:flex;flex-direction:column;min-width:0;max-height:560px;background:#fff}
@media (max-width:960px){ .rv-notes-side{max-height:none} }
.rv-notes-head{display:flex;align-items:center;justify-content:space-between;
  padding:10px 12px;border-bottom:1px solid var(--line-2);font-size:13px;font-weight:700}
.rv-only-open{display:flex;align-items:center;gap:5px;font-weight:400;cursor:pointer}
.rv-notes{overflow:auto;padding:8px;display:flex;flex-direction:column;gap:8px;min-width:0}

.rv-note{border:1px solid var(--line-2);border-radius:9px;padding:9px 10px;
  display:flex;flex-direction:column;gap:6px;background:#fff;min-width:0}
.rv-note.resolved{opacity:.62;background:#f8f9fb}
.rv-note-top{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.rv-ts{font-variant-numeric:tabular-nums;font-weight:700;font-size:12px;
  color:#fff;background:var(--brand);border-radius:5px;padding:1px 6px;
  cursor:pointer;border:none;font-family:inherit}
.rv-ts:hover{filter:brightness(1.1)}
.rv-note-who{font-size:12px;color:var(--txt-3);min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rv-note-text{font-size:13px;line-height:1.5;white-space:pre-wrap;word-break:break-word}
.rv-note-acts{display:flex;gap:6px;flex-wrap:wrap}
.rv-reply{border-left:2px solid var(--line);padding-left:8px;margin-top:2px;
  display:flex;flex-direction:column;gap:4px}
.rv-reply .who{font-size:11.5px;color:var(--txt-3);font-weight:600}
.rv-reply .txt{font-size:12.5px;line-height:1.45;white-space:pre-wrap}

/* 交片弹层：人员勾选 */
.rv-people{display:flex;flex-wrap:wrap;gap:6px;max-height:150px;overflow:auto;
  padding:8px;border:1px solid var(--line);border-radius:8px;background:#fafbfd}
.rv-people label{display:flex;align-items:center;gap:5px;font-size:12.5px;
  padding:3px 8px;border:1px solid var(--line);border-radius:999px;
  background:#fff;cursor:pointer;white-space:nowrap}
.rv-people label:has(input:checked){border-color:var(--brand);background:var(--brand-soft);
  color:var(--brand);font-weight:600}
.rv-people input{margin:0}

/* 结论横幅 */
.rv-verdict{border-radius:9px;padding:9px 12px;font-size:13px;display:flex;
  gap:8px;align-items:flex-start;flex-wrap:wrap}
.rv-verdict.ok{background:#e8f6ee;color:#17693c;border:1px solid #bfe3cd}
.rv-verdict.bad{background:#fdecec;color:#a32424;border:1px solid #f3c9c9}

/* 结论弹层：打回用红按钮，通过用主色 —— 两个动作后果差得远，不能长一个样 */
.rv-decide-text{width:100%;min-height:104px;resize:vertical;line-height:1.65;
  font-size:13.5px;margin:8px 0 6px;box-sizing:border-box}
#rvDecideBox .modal-body{padding-top:6px}
.rv-need{color:#c0392b}
.rv-need::before{content:'* ';font-weight:700}
.btn.danger{background:var(--danger);border-color:var(--danger);color:#fff}
.btn.danger:hover{filter:brightness(1.06)}
.btn.danger:disabled{opacity:.6;cursor:default;filter:none}

@media (max-width:640px){
  .rv-detail{padding:13px 12px 15px}
  .rv-detail-actions .btn{flex:1}
  .rv-timebar{gap:6px}
  .rv-composer-head{justify-content:flex-start}
}