/* 상태 표시 규칙(2026-10-07 정리안) — 뜻 = 색 하나, 꼬리표는 한 크기의 둥근 알약, 진행 중은 회색 + 도는 동그라미,
   검정은 사람이 고른 것만, 종류(본편 · 선공개 · 소스 받기 · 합본 …)는 바탕 없이 '점 + 글자'. 테두리 없음.
   다른 css 뒤에 읽어서 기능마다 따로 만든 꼬리표를 여기서 한 번에 맞춘다. 올리는 중 화살표(workflow-card)는 그대로. */
:root{--st-info-bg:color-mix(in srgb,var(--accent) 11%,var(--surface))}

/* ── 꼬리표: 크기 하나 ── */
.video-pub,.video-edited,.video-need,.video-skip,.rf-badge,.tr-card .rf-tag,.script-chip,.lv-badge,.folder-status,.sample-badge{
 display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 8px;border-radius:999px;font-size:11px;font-weight:650;line-height:1;white-space:nowrap;font-style:normal;vertical-align:middle}
/* 오류 */
.lv-badge.fail,.folder-status.failed,.video-need{background:var(--danger-bg);color:var(--status-error)}
/* 주의 */
.rf-badge.warn,.tr-card .rf-tag.warn{background:var(--dot-warn-bg);color:var(--status-warn)}
/* 완료 */
.video-pub,.lv-badge.ok,.script-chip.ok,.script-chip.rend{background:var(--dot-ok-bg);color:var(--status-ok)}
.script-chip.rend::before{content:"";width:7px;height:4px;border-left:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-1px) rotate(-45deg)}
/* 정보 — 일부공개는 아직 공개 전 */
.video-pub.unlisted,.video-edited{background:var(--st-info-bg);color:var(--accent)}
/* 중립 */
.video-skip,.rf-badge.info,.tr-card .rf-tag.info,.script-chip,.lv-badge,.folder-status,.sample-badge{background:var(--inset);color:var(--secondary)}
/* 진행 중 — 색 대신 도는 동그라미 */
.script-chip.busy,.lv-badge.busy,.folder-status.running{background:var(--inset);color:var(--ink)}
.script-chip.busy::before,.lv-badge.busy::before,.folder-status.running::before{content:"";flex:none;width:8px;height:8px;margin:0;border-radius:50%;background:none;border:1.5px solid currentColor;border-top-color:transparent;animation:st-spin .9s linear infinite;vertical-align:0}
@keyframes st-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.script-chip.busy::before,.lv-badge.busy::before,.folder-status.running::before,.video-dot.busy{animation:none}}
/* 고른 것 — 검정 */
.thumb-picks .thumb-badge{background:var(--solid);color:var(--on-solid)}

/* ── 점 ── */
.video-dot.busy{background:none;border:1.5px solid var(--ink);border-top-color:transparent;animation:st-spin .9s linear infinite}
.video-dot.edited{background:var(--accent)}   /* 안 본 새 판 = 정보(새것) */

/* ── 종류: 바탕 없이 점 + 글자 ── */
.rs-kind,.src-tag,.arc-tag{display:inline-flex;align-items:center;gap:5px;padding:0;background:none!important;border-radius:0;font-size:11px;font-weight:600;color:var(--secondary)}
.rs-kind::before,.src-tag::before,.arc-tag::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--muted);flex:none}
.rs-kind.is-main{color:var(--accent)}.rs-kind.is-main::before{background:var(--accent)}
.rs-due-tag{display:inline-flex;align-items:center;gap:6px;padding:0;background:none;color:var(--source-due)}
.rs-due-tag::before{content:"";width:6px;height:6px;border-radius:1.5px;transform:rotate(45deg);background:var(--source-due-dot);flex:none}

/* ── 안내 상자(2026-10-07) — 아이콘 · 굵은 제목 · 설명 · 오른쪽 버튼, 크기 · 여백 하나. 색은 뜻대로 ── */
.nb{display:flex;align-items:flex-start;gap:10px;margin-top:12px;padding:12px 14px;border-radius:12px;background:var(--inset);font-size:12px;line-height:1.55;color:var(--secondary);text-align:left}
.nb>.nb-ic{width:18px;height:18px;flex:none;margin-top:1px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;color:var(--muted)}
.nb>.tx{flex:1;min-width:0}
.nb>.tx>b{display:block;font-size:13px;font-weight:650;color:var(--ink);margin-bottom:1px}
.nb>.tx>span{display:block}
.nb.err{background:var(--danger-bg)}.nb.err>.nb-ic,.nb.err>.tx>b{color:var(--status-error)}
.nb.warn{background:var(--dot-warn-bg)}.nb.warn>.nb-ic,.nb.warn>.tx>b{color:var(--status-warn)}
.nb.info{background:var(--st-info-bg)}.nb.info>.nb-ic,.nb.info>.tx>b{color:var(--accent)}
.nb.ok{background:var(--dot-ok-bg)}.nb.ok>.nb-ic,.nb.ok>.tx>b{color:var(--status-ok)}
.nb-acts{display:flex;gap:6px;flex:none;align-self:center;flex-wrap:wrap;justify-content:flex-end}
.nb-act{flex:none;align-self:center;border:0;border-radius:999px;padding:7px 12px;font:inherit;font-size:12px;font-weight:600;background:var(--surface);color:var(--ink);text-decoration:none;cursor:pointer;white-space:nowrap}
.nb-act:hover{background:var(--hover)}
.nb-act.solid{background:var(--solid);color:var(--on-solid)}
label.nb{cursor:pointer}
.nb .nb-ck{appearance:none;-webkit-appearance:none;width:18px;height:18px;margin:1px 0 0;border:0;border-radius:5px;background:var(--surface);flex:none;display:grid;place-items:center;cursor:pointer}
.nb .nb-ck:checked{background:var(--solid)}
.nb .nb-ck:checked::after{content:"";width:9px;height:5px;border-left:2px solid var(--on-solid);border-bottom:2px solid var(--on-solid);transform:translateY(-1px) rotate(-45deg)}
.nb .nb-ck:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.nb .tr-gap-rows{margin-top:8px}
.nb-help{margin:12px 2px 0;font-size:12px;line-height:1.6;color:var(--muted)}
@media(max-width:520px){.nb{flex-wrap:wrap}.nb-acts,.nb>.nb-act{margin-left:28px}}
/* 다른 화면의 글자만 있는 안내 상자도 같은 크기 · 여백으로 */
.thumb-warn,.sr-warn,.jp-skip,.air-warn{padding:12px 14px;border-radius:12px;font-size:12px;line-height:1.55}
.thumb-warn{background:var(--dot-warn-bg);color:var(--status-warn)}
.air-warn b{font-size:13px}

/* 카드 둘째 줄 꼬리표 사이 간격 · 줄 맞춤(2026-10-08 — 수정됨 · 지역 제한이 크기 규칙에서 빠져 일부공개와 높이가 달랐다) */
.video-list-copy>span .video-pub,.video-list-copy>span .video-edited,.video-list-copy>span .video-need{margin-right:4px}
.rf-badges{vertical-align:middle}

/* 색 시험(2026-10-13) — '정상이다 · 있다'는 보라(대표색). 응답 정상 · 원본 있음 · 자막 붙음 · 받은 회차 · 채운 목표.
   '끝났다'(공개됨 · 승인 · 완료)는 여기 넣지 않는다 — 그쪽은 화면별로 회색으로 내릴 차례. 초록 토큰은 아직 다른 곳에서 쓰니 지우지 않는다 */
:root{--fine:#6A3EE8;--fine-dot:#7C4DFF;--fine-bg:color-mix(in srgb,#7C4DFF 12%,transparent)}
:root[data-theme="dark"]{--fine:#B39BFF;--fine-dot:#A58BFF;--fine-bg:color-mix(in srgb,#7C4DFF 28%,transparent)}
.home-node-state.good i,.nodes-health.good i,.ws-st.ok i{background:var(--fine-dot)}
.hc-goal u.on{background:var(--fine-dot)}
.hc-week em.ok,.st-prog.ok,.ws-st.ok,.osub-just{color:var(--fine)}
.wr-st.ok svg{color:var(--fine)}
.ws-rk .k-up{border-color:var(--fine-dot)}
.ws-band.got,.osub-on,.osub-status.ok,.src-chip.ok,.sr-node-chip.src{background:var(--fine-bg);color:var(--fine)}
.osub-file.new{background:var(--fine-bg)}

/* 색 옮기기 1차(2026-10-13) — 작업 화면 · 검수 카드 · 썸네일 창 · 작업 목록 카드의 호박색 · 초록을 새 뜻으로.
   기다림 = 보라(2026-10-13 사용자가 하늘 · 호박색 · 보라 중에 고름) · 우리가 고칠 것 = 코랄 · 챙길 것 = 연두(작은 꼬리표에만) · 정상 · 있다 = 보라 · 끝난 것 = 회색 */
:root{--wait:#6A3EE8;--wait-bg:color-mix(in srgb,#7C4DFF 12%,transparent);--wait-dot:#7C4DFF;--fix:#E03E33;--fix-bg:color-mix(in srgb,#FF5A4E 16%,transparent);--care:#E4FF1A;--care-ink:#17181c;--care-soft:color-mix(in srgb,#E4FF1A 62%,var(--surface))}
:root[data-theme="dark"]{--wait:#B39BFF;--wait-bg:color-mix(in srgb,#7C4DFF 28%,transparent);--wait-dot:#A58BFF;--fix:#FF8076;--fix-bg:color-mix(in srgb,#FF5A4E 26%,transparent);--care-soft:color-mix(in srgb,#E4FF1A 30%,var(--surface))}
/* 영상 목록의 단계 꼬리표 · 거르기 점 · 이력 점 */
.vs-tag.rev{background:var(--wait-bg);color:var(--wait)}
.vs-tag.fix,.vs-tag.bad{background:var(--fix-bg);color:var(--fix)}
.vs-tag.care{background:var(--care);color:var(--care-ink)}
.vs-tag.ok{background:var(--inset);color:var(--secondary)}
.vs-filter .d.rev{background:var(--wait-dot)}.vs-filter .d.fix{background:#FF5A4E}.vs-filter .d.ok{background:var(--muted)}
.vs-tl li.fix::before{background:#FF5A4E}.vs-tl li.ok::before{background:var(--fine-dot)}
.vs-warn{padding:0 6px;border-radius:999px;background:var(--surface);color:var(--ink)}   /* 주의 숫자 — 색 없이 흰 칸에 검은 글자(2026-10-13 사용자가 여섯 안 중 고름) */
.vs-th.pick{background:var(--fine-bg);color:var(--fine)}
/* 올린 영상 꼬리표 — 공개 전 · 예약됨 · 공개됨은 유튜브에 어떻게 올라가 있는지만 알린다(모두 회색). 색은 검수 단계 꼬리표가 맡는다 */
.video-pub,.video-pub.unlisted,.script-chip.ok,.script-chip.rend{background:var(--inset);color:var(--secondary)}
.rf-badge.warn,.tr-card .rf-tag.warn{background:var(--care);color:var(--care-ink)}
/* 검수 카드 */
/* 검수 카드 상태 색(2026-10-13 사용자가 정함) — 올리는 중 · 신청하는 중 · 공개됨은 제목 검정에 아이콘만 색, 나머지는 제목까지 색(아이콘은 제목 색을 따라간다) */
.workflow-status[data-stage] .status-icon{color:inherit}
.workflow-status[data-stage=uploading] strong,.workflow-status[data-stage=attaching] strong,.workflow-status[data-stage=scheduled] strong{color:var(--ink)}
.workflow-status[data-stage=uploading] .status-icon{color:var(--status-warn)}   /* 호박색 */
.workflow-status[data-stage=attaching] .status-icon{color:#2FB6AC}              /* 레이블리 로고에서 뽑은 색 — 바꾸지 않는다 */
.workflow-status[data-stage=scheduled] .status-icon{color:var(--muted)}
.workflow-status[data-stage=pending] strong,.workflow-status[data-stage=approved] strong{color:var(--fine)}   /* 보라 */
.workflow-status[data-stage=revision] strong,.workflow-status[data-stage=error] strong,.workflow-status[data-stage=rejected] strong{color:var(--fix)}   /* 코랄 — 우리가 고칠 것 */
.tr-card .tr-geo{background:var(--fix-bg);color:var(--fix)}
.tr-card .tr-rights.done{background:var(--inset)}
.tr-card .tr-rights.done .tr-rights-ic,.tr-card .tr-rights.done b{color:var(--secondary)}
.tr-card .tr-move-chk.ok{background:var(--fine-bg)}
/* 썸네일 창 — 안내 상자는 연한 연두(넓은 면이라 형광 그대로는 안 쓴다) */
.thumb-warn{background:var(--care-soft);color:var(--ink)}
.thumb-picks .thumb-check{color:var(--secondary)}
.thumb-picks .thumb-check::before{content:"";display:inline-block;width:6px;height:6px;margin-right:5px;border-radius:50%;background:var(--care);box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 25%,transparent);vertical-align:1px}
.thumb-cell.cand img{outline-color:var(--fine-dot)}
.thumb-done{background:var(--fine-bg)}.thumb-done span{color:var(--fine)}
/* 공용 안내 상자 */
.nb.warn{background:var(--care-soft)}.nb.warn>.nb-ic,.nb.warn>.tx>b{color:var(--ink)}
.nb.ok{background:var(--fine-bg)}.nb.ok>.nb-ic,.nb.ok>.tx>b{color:var(--fine)}
/* 작업 목록 카드 — 방영 전(기다림) · 진행 단계의 끝난 단계 */
.job-folder .air-chip{padding:1px 7px;border-radius:999px;background:var(--wait-bg);color:var(--wait)}
.jp-steps li.done .jp-dot{color:var(--fine)}

/* 색 옮기기 2차(2026-10-13) — 발행 일정 · 작품 관리 */
/* 발행 일정: 공개됨은 끝난 것(회색) · 연기는 기다림(청록) · 늦은 원본은 문제(코랄) · 받을 회차 수는 챙길 것(연두 바탕) */
[data-status="released"]{--rs:var(--status-neutral)}
[data-status="delayed"]{--rs:var(--status-neutral)}
.rs-status[data-status="delayed"],[data-status="delayed"] .rs-status{background:var(--wait-bg);color:var(--wait)}
.ws-st.late{color:var(--fix)}
.st-src b{padding:0 5px;border-radius:6px;background:var(--care);color:var(--care-ink)}
/* 작품 관리: 방영 전 · 원본 기다림은 기다림(청록) · 소스가 얼마 안 남음은 챙길 것(연두) · 안내 상자는 보라 */
.wr-air small.warn,.wr-air-in.warn{display:inline-block;padding:0 6px;border-radius:6px;background:var(--wait-bg);color:var(--wait)}
.sr-node-note.warn{color:var(--secondary)}
.wr-st.wait svg{color:var(--wait-dot)}
.src-chip.warn{background:var(--care);color:var(--care-ink)}
.sr-dlg .sr-from{background:var(--fine-bg)}
.sr-listbad{color:var(--fix)}
/* 안내 상자 제목 옆 물음표 — 긴 설명은 올렸을 때만(2026-10-13) */
.nb-q{display:inline-grid;place-items:center;width:16px;height:16px;margin-left:6px;border-radius:50%;background:color-mix(in srgb,var(--ink) 10%,transparent);color:var(--secondary);font-size:10px;font-weight:700;line-height:1;vertical-align:.5px;cursor:help}
/* '유튜브에 올릴 정보' 제목 줄은 이미 6px 간격이 있어서 물음표의 왼쪽 여백을 뺀다(다른 물음표와 같은 6px 로) */
.tr-card .tr-meta summary .nb-q{margin-left:0}
.nb.nb-check{align-items:center}
/* 설명 없이 제목 한 줄뿐인 안내 상자는 아이콘 · 제목 · 버튼을 세로 가운데로 맞춘다 */
.nb:has(>.tx>b:only-child){align-items:center}
.nb:has(>.tx>b:only-child)>.nb-ic{margin-top:0}
.nb:has(>.tx>b:only-child)>.tx>b{margin-bottom:0}

/* 색 옮기기 3차(2026-10-13) — 작업 이력 · 맥·배포 · 알림. 보라를 넉넉히 쓴다(강조색): 도는 중은 꽉 찬 보라, 기다림은 연한 보라, 끝난 것은 회색 */
.hist-st.info{background:var(--fine-dot);color:#fff}                         /* 실행 — 지금 도는 중 */
.hist-st.warn{background:var(--wait-bg);color:var(--wait)}                    /* 보류 — 앞 단계를 기다리는 중 */
.hist-st.good{background:var(--inset);color:var(--secondary)}                 /* 완료 — 끝난 것 */
.home-node-state.warning i,.nodes-health.warning i{background:var(--dot-error)}   /* 응답 확인 필요 */
.nodes-sha.different{color:var(--wait)}
.nodes-sha.different i,.nodes-legend i{background:var(--wait-dot)}             /* 새 버전을 아직 안 받은 맥미니 */
.alerts-k.ok{background:var(--fine-bg);color:var(--fine)}
.alerts-k.wait,.alerts-k.warn{background:var(--wait-bg);color:var(--wait)}
.alerts-done{color:var(--secondary)}

/* 색 옮기기 4차(2026-10-13) — 성과 · 트렌드 · 로컬 영상 */
.perf-page .sub{background:var(--inset);color:var(--secondary)}                 /* † 내려간 영상 — 끝난 것 */
.perf-page .pf-warnbar{background:var(--wait-bg);color:var(--wait)}              /* 지표를 채우는 중 — 기다림 */
.perf-page .pf-new{background:var(--fine-bg);color:var(--fine)}                  /* 신규 */
.trx{--tok:var(--fine)}                                                          /* 정상 숫자 · '전부 정상' */
.trx .trx-v.warn{color:var(--secondary);border-color:var(--muted)}               /* 낮은 순위 주의 — 색 없이(높은 순위만 코랄) */
.trx .trx-note{background:var(--care-soft);color:var(--ink)}                     /* 챙길 것 — 상수 제안이 현행과 다름 */
/* 트렌드 그림의 '시장' 막대(호박색)는 신호가 아니라 그림 색이라 그대로 둔다 */
.lv-badge.busy{background:var(--fine-dot);color:#fff}                            /* 렌더 중 — 지금 도는 중(작업 이력의 실행과 같은 꽉 찬 보라) */
.lv-badge.ok{background:var(--care);color:var(--care-ink)}                       /* 새 판 완성 — 볼 차례(챙길 일의 '다시 렌더 완료'와 같은 연두) */
/* 홈 목차의 건수 — 챙길 일과 같은 연두(2026-10-13). 문제가 섞여 있으면 코랄 그대로 */
.toc-name b.warn{background:var(--care);color:var(--care-ink)}
/* 홈 — 채널별 할 일의 '며칠째' · 남은 목표는 보라(2026-10-13 사용자). 알약의 건수는 home-dashboard.css 에서(그 파일이 뒤에 읽힌다) */
.hc-old em.late,.hc-week em{color:var(--fine)}
