/* workout-video 專用樣式：只補 ui-template 沒有的版面；顏色一律用 token。 */
.auth-wrap { min-height: 100dvh; display: grid; place-items: center; padding: 16px; }
.auth-card { width: 100%; max-width: 420px; }
.brand { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 1.1rem; }
.topbar .brand { margin-right: auto; }
.drop {
  border: 2px dashed var(--color-border); border-radius: var(--radius-lg, 12px); padding: 28px 16px; text-align: center;
  background: var(--color-surface); cursor: pointer; transition: border-color .15s, background .15s;
}
.drop:hover, .drop.is-over { border-color: var(--color-primary); background: var(--color-primary-soft, var(--color-surface-2, var(--color-surface))); }
.drop input { display: none; }
.video-list { display: grid; gap: 8px; }
.video-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--color-border); border-radius: var(--radius-md, 8px); background: var(--color-surface); }
.video-item input[type="checkbox"] { width: 18px; height: 18px; flex: none; }
.video-item .meta { color: var(--color-text-secondary); font-size: .85rem; }
.video-item .order { min-width: 26px; height: 26px; display: inline-grid; place-items: center; border-radius: 999px; background: var(--color-primary); color: #fff; font-size: .8rem; font-weight: 700; }
.task-card { display: grid; grid-template-columns: 160px 1fr; gap: 14px; }
.task-card .thumb { width: 160px; height: 120px; object-fit: cover; border-radius: var(--radius-md, 8px); background: var(--color-surface-2, var(--color-border)); }
.task-card .thumb--empty { display: grid; place-items: center; color: var(--color-text-secondary); font-size: .8rem; }
.task-card .big { font-size: 2rem; font-weight: 700; line-height: 1.1; }
.task-card .summary { white-space: pre-wrap; }
.files { display: flex; flex-wrap: wrap; gap: 8px; }
.preview video { width: 100%; max-height: 70dvh; background: #000; border-radius: var(--radius-md, 8px); }
.upload-progress { display: grid; gap: 4px; }
@media (max-width: 640px) {
  .task-card { grid-template-columns: 1fr; }
  .task-card .thumb { width: 100%; height: 160px; }
}