/* 품질 통계(video-ratings.js) — 목업 mockup-video-ratings.html. 칸은 면의 밝기로만 나눈다(테두리 없음) */
.rt-page{display:flex;flex-direction:column;gap:16px;padding-bottom:40px}
.rt-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-start;gap:12px}
.rt-head h2{margin:0;font-size:20px}
.rt-filters{display:flex;flex-wrap:wrap;gap:8px}
.rt-grid{display:grid;gap:12px}
.rt-top{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}
.rt-mid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.rt-bot{grid-template-columns:minmax(0,.7fr) minmax(0,1.6fr)}
@media(max-width:1100px){.rt-top,.rt-mid,.rt-bot{grid-template-columns:minmax(0,1fr)}}
.rt-card{background:var(--surface);border-radius:16px;padding:18px 20px;min-width:0}
.rt-card h3{font-size:15px;margin:0 0 4px}
.rt-s{font-size:12px;color:var(--muted);margin:0 0 14px;line-height:1.5}
.rt-empty{font-size:13px;color:var(--muted);margin:8px 0}
.rt-mut{color:var(--muted)}
.rt-page .h{color:#e0447b}.rt-page .d{color:#5b5b66}
:root[data-theme="dark"] .rt-page .d{color:#b4b4bd}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .rt-page .d{color:#b4b4bd}}

/* 도넛 */
.rt-donutcard{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.rt-dwrap{position:relative;width:250px;height:250px}
.rt-donut{width:250px;height:250px;overflow:visible}
.rt-donut path{stroke:none;cursor:pointer;transform-box:view-box;transform-origin:60px 60px;transition:transform .15s}
.rt-donut path:hover{transform:scale(1.04)}
.rt-donut .rt-cut{stroke:var(--surface);pointer-events:none}
.rt-dlab{position:absolute;transform:translate(-50%,-50%);font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;pointer-events:none;line-height:1}
.rt-dc{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}
.rt-dc b{font-size:34px;font-variant-numeric:tabular-nums}.rt-dc small{font-size:12px;color:var(--secondary)}
.rt-tip{position:absolute;z-index:3;background:var(--surface);color:var(--ink);font-size:12px;border-radius:10px;padding:8px 11px;white-space:nowrap;box-shadow:0 6px 22px #0000002a;pointer-events:none;line-height:1.45}
.rt-tip b{display:flex;align-items:center;gap:5px;font-size:12.5px}.rt-tip b svg{width:13px;height:13px;flex:none}.rt-tip span{color:var(--secondary)}
.rt-tip.rt{border-bottom-left-radius:2px}.rt-tip.rb{border-top-left-radius:2px}.rt-tip.lt{border-bottom-right-radius:2px}.rt-tip.lb{border-top-right-radius:2px}
.rt-dleg{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px}
.rt-dleg li{display:inline-flex;gap:10px;align-items:center;font-size:13.5px}
.rt-dleg i{width:12px;height:12px;border-radius:4px}
.rt-dleg b{font-variant-numeric:tabular-nums}
.rt-dnote{margin:0;font-size:12px;color:var(--muted);text-align:center}

/* 막대 */
.rt-bars{display:flex;flex-direction:column;gap:9px}
.rt-bar{display:grid;grid-template-columns:150px 1fr 70px;gap:10px;align-items:center;font-size:12.5px}
.rt-bar>span:first-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-bar .tr{height:14px;border-radius:0 4px 4px 0;background:var(--inset);position:relative}
.rt-bar .fill{position:absolute;left:0;top:0;bottom:0;border-radius:0 4px 4px 0;background:#5b5b66}
.rt-bar .v{text-align:right;color:var(--secondary);font-variant-numeric:tabular-nums;white-space:nowrap}
.rt-bar .v b{color:var(--ink)}
.rt-memo{margin-top:14px;padding-top:12px;box-shadow:0 -1px 0 var(--inset)}
.rt-memo>b{font-size:12px;color:var(--secondary)}
.rt-mgrid{margin:8px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px}
.rt-mgrid li{background:var(--inset);border-radius:8px;padding:7px 10px;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-more{display:block;margin:8px 0 0 auto;border:0;background:none;padding:0;font:inherit;font-size:12px;font-weight:650;color:var(--secondary);cursor:pointer}
.rt-memos ul{list-style:none;margin:0 0 4px;padding:0;display:flex;flex-direction:column;gap:6px;max-height:50vh;overflow:auto}
.rt-memos li{display:flex;justify-content:space-between;gap:12px;background:var(--inset);border-radius:8px;padding:8px 10px;font-size:13px}
.rt-memos li small{color:var(--muted);white-space:nowrap}

/* 표 */
.rt-tablewrap{overflow-x:auto}
.rt-table{width:100%;border-collapse:collapse;font-size:12.5px}
.rt-table th{text-align:left;font-weight:600;color:var(--muted);font-size:11.5px;padding:0 6px 8px;white-space:nowrap}
.rt-table td{padding:9px 6px;box-shadow:0 -1px 0 var(--inset);font-variant-numeric:tabular-nums;white-space:nowrap}
.rt-table tr.sub td{padding-top:6px;padding-bottom:6px;color:var(--secondary);font-size:12px}
.rt-table td.rt-name{max-width:130px;overflow:hidden;text-overflow:ellipsis}
.rt-indent{display:inline-block;width:18px}
.rt-who{cursor:pointer}.rt-who:hover td{background:var(--inset)}.rt-who:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.rt-table .rt-chev{display:inline-block;width:12px;height:12px;margin-right:6px;vertical-align:-1px;fill:none;stroke:var(--muted);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transform-origin:50% 50%;transition:transform .15s}.rt-who.open .rt-chev{transform:rotate(90deg)}
.rt-mini{display:inline-flex;height:8px;width:90px;border-radius:4px;overflow:hidden;background:var(--inset);vertical-align:middle}
.rt-mini i{display:block;height:100%}.rt-mini i.gap{width:3px;background:var(--surface)}
.rt-tag{display:inline-block;font-size:11px;font-weight:650;color:var(--secondary);background:var(--inset);border-radius:999px;padding:2px 8px;white-space:nowrap}
.rt-seg{display:inline-flex;gap:3px;padding:3px;border-radius:999px;background:var(--inset);margin-bottom:12px}
.rt-seg button{border:0;background:none;font:inherit;font-size:12px;padding:5px 12px;border-radius:999px;color:var(--secondary);cursor:pointer}
.rt-seg button[aria-pressed="true"]{background:var(--surface);color:var(--ink);font-weight:650}

/* 하트가 실제로 쓰였나 */
.rt-hu-head{display:flex;align-items:baseline;margin:2px 0 8px;font-size:13px;color:var(--secondary)}
.rt-hu-head b{font-size:22px;margin-right:6px}
.rt-hu-bar{display:flex;gap:2px;height:30px}
.rt-hu-bar span{display:flex;align-items:center;padding:0 10px;font-size:12px;font-weight:700;white-space:nowrap;overflow:hidden;min-width:0}
.rt-hu-bar .up{background:#e0447b;color:#fff;border-radius:6px 0 0 6px}
.rt-hu-bar .wait{background:#f6c9d9;color:#8a2a4d;border-radius:0 6px 6px 0}
.rt-hu-bar .up:last-child{border-radius:6px}.rt-hu-bar .wait.solo{border-radius:6px}
.rt-hu-lt{font-size:12.5px;font-weight:650;margin:16px 0 6px}
.rt-recent{display:flex;flex-direction:column;gap:6px;margin-top:12px}
.rt-rc{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:9px 12px;border-radius:10px;background:var(--inset);font-size:12.5px;color:inherit;text-decoration:none}
.rt-rc>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rt-rc small{color:var(--muted)}.rt-rc .go{font-weight:700;font-size:12px;color:var(--secondary)}

/* 편집실에서 고친 것 */
.rt-asis{display:flex;align-items:baseline;gap:8px;margin:0 0 12px}.rt-asis b{font-size:26px;font-weight:800}.rt-asis span{font-size:12.5px;color:var(--muted)}
.rt-edits{position:relative}
.rt-ebar,.rt-ehead{grid-template-columns:185px 1fr 40px 80px 150px;gap:12px}
.rt-ehead{display:grid;font-size:11px;color:var(--muted);margin-bottom:-2px}.rt-ehead span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rt-ebar .fill{background:#8a8a94}
.rt-ebar .pc{margin-right:6px;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.rt-ebar .cnt{display:grid;grid-template-columns:3ch auto 1fr;gap:4px;font-variant-numeric:tabular-nums;color:var(--secondary)}
.rt-ebar .cnt b{text-align:right;font-weight:600;color:var(--ink)}.rt-ebar .cnt i,.rt-ebar .cnt em{font-style:normal;color:var(--muted)}
.rt-ebar .sh{display:grid;grid-template-columns:1fr 34px;gap:8px;align-items:center;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}
.rt-ebar .sh u{text-decoration:none;text-align:right}
.rt-ebar .mb{display:flex;gap:1px;width:100%;height:8px;background:var(--inset);border-radius:2px;overflow:hidden}
.rt-ebar .mb i{display:block;height:8px}
.rt-mlg{display:flex;flex-wrap:wrap;gap:12px;font-size:11.5px;color:var(--secondary);margin:10px 0 0}
.rt-mlg i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:5px;vertical-align:middle}
@media(max-width:700px){.rt-ebar,.rt-ehead{grid-template-columns:110px 1fr 36px 64px 90px;gap:8px}.rt-bar{grid-template-columns:120px 1fr 64px}}

/* 빈 칸 로봇 + 물음표 — 카드 남은 자리 정가운데 */
.rt-reasons,.rt-editcard{display:flex;flex-direction:column}
.rt-robot{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:180px;text-align:center}
.rt-robot p{margin:0;font-size:13px;color:var(--muted)}
.rt-robot-art{position:relative;display:block;margin-top:22px}
.rt-robot .node-robot{display:block;width:64px;height:64px}
.rt-q{position:absolute;left:44px;top:-22px;fill:var(--accent);stroke:none}

/* 펼친 작품 이름이 길어도 표가 옆으로 늘지 않게 — 이름 칸 폭을 고정하고 넘치면 말줄임 */
.rt-table td.rt-pname{max-width:150px;overflow:hidden;text-overflow:ellipsis}

/* 사람 표는 칸이 많아 좁은 카드에서 옆으로 넘치지 않게 막대를 줄인다 */
.rt-table .rt-mini{width:56px}
.rt-table td,.rt-table th{padding-left:5px;padding-right:5px}
.rt-table td.rt-pname{max-width:120px}

/* 말풍선 아이콘 — 대시보드 공통 svg 규칙(빈 속 · 검은 선)을 이긴다. 하트는 작업 화면 하트처럼 꽉 찬 분홍 */
.rt-tip b svg.rt-ic-h{fill:#e0447b;stroke:none}
.rt-tip b svg.rt-ic-d{fill:none;stroke:#5b5b66;stroke-width:2.2;stroke-linejoin:round;stroke-linecap:round}