/* 게임·카테고리 섹션 (slice B) — 클래스 접두사 ca-categories- · 골격은 layout.js(flow·bento·card2·kpis2·subhead·foot) */
.ca-categories{min-width:0}

/* 카테고리별 성과 목록(2줄 행 + 비중 막대) */
.ca-categories-list{list-style:none;margin:0;padding:0;display:grid;min-width:0}
.ca-categories-li{position:relative;display:grid;gap:3px;padding:9px 2px 11px;border-top:1px solid var(--ca-hair);min-width:0}
.ca-categories-li:first-child{border-top:0;padding-top:2px}
.ca-categories-li-top{display:flex;align-items:center;gap:8px;min-width:0}
.ca-categories-sw{flex:none;width:9px;height:9px;border-radius:3px}
.ca-categories-li-name{flex:1 1 auto;min-width:0;font-size:13px;font-weight:650;color:var(--ca-txt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ca-categories-li-type{flex:none;font-size:10.5px;color:var(--ca-mut);background:rgba(255,255,255,.05);border-radius:4px;padding:1px 5px}
.ca-categories-li-top > .ca-badge,.ca-categories-perf-na{flex:none;font-size:11px;padding:2px 7px}
.ca-categories-perf-na{color:var(--ca-mut2)}
.ca-categories-li-sub{display:flex;justify-content:space-between;gap:10px;padding-left:17px;font-size:11.8px;color:var(--ca-mut);min-width:0;font-variant-numeric:tabular-nums}
.ca-categories-li-sub > span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ca-categories-li-sub b{color:var(--ca-txt2);font-weight:700}
.ca-categories-li-r{flex:none}
.ca-categories-li-track{display:block;margin-left:17px;height:3px;border-radius:2px;background:rgba(255,255,255,.05);overflow:hidden}
.ca-categories-li-track > span{display:block;height:100%;border-radius:2px;opacity:.85}
.ca-categories-lowsample{opacity:.6}

/* 인사이트 */
.ca-categories-insights{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ca-categories-insights li{position:relative;padding:10px 12px 10px 30px;border-radius:9px;background:rgba(255,255,255,.022);border:1px solid var(--ca-hair);font-size:13px;line-height:1.6;color:var(--ca-txt2);word-break:keep-all;overflow-wrap:anywhere}
.ca-categories-insights li::before{content:"";position:absolute;left:13px;top:17px;width:7px;height:7px;border-radius:50%;background:var(--ca-green)}
.ca-categories-insights li[data-tone="bad"]::before{background:var(--ca-bad)}
.ca-categories-insights li[data-tone="warn"]::before{background:var(--ca-amber)}
.ca-categories-insights li[data-tone="pur"]::before{background:#9b5cff}
.ca-categories-insights li[data-tone="cyan"]::before{background:var(--ca-cyan)}

/* 경쟁도 카드 */
.ca-categories-comp.is-loading .ca-ph-box{animation:ca-shimmer 1.3s linear infinite;border-color:transparent}
.ca-categories-comp .ca-card2-title > .ca-badge{flex:none}
.ca-categories-comp > .ca-card2-body{container-type:inline-size}
.ca-categories-cbody{display:flex;flex-direction:column;gap:14px;min-width:0;flex:1 1 auto}
.ca-categories-cmain,.ca-categories-cside{display:flex;flex-direction:column;gap:12px;min-width:0}
.ca-categories-cside{flex:1 1 auto}
.ca-categories-ctop{display:flex;align-items:stretch;gap:10px;min-width:0}
.ca-categories-ctop > .ca-grid2{flex:1 1 auto}
.ca-categories-poster{flex:none;width:46px;height:auto;min-height:58px;align-self:stretch;border-radius:8px;object-fit:cover;background:var(--ca-panel3)}
.ca-categories-stat{padding:8px 10px;display:flex;flex-direction:column;justify-content:center}
.ca-categories-stat small{display:block;font-size:11px;color:var(--ca-mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ca-categories-stat b{display:block;margin-top:2px;font-size:16px;font-weight:800;letter-spacing:-.3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
@media (max-width:374px){ .ca-categories-stat{padding:8px 8px} .ca-categories-stat small{font-size:10.5px;letter-spacing:-.2px} }
.ca-categories-share{display:grid;gap:8px}
.ca-categories-dist{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:12px;color:var(--ca-mut)}
.ca-categories-dist b{color:var(--ca-txt2);font-weight:700}
.ca-categories-nolives{margin:0;font-size:12.3px;line-height:1.55;color:var(--ca-mut);padding:10px 12px;border-radius:9px;background:rgba(255,255,255,.02);border:1px dashed var(--ca-line2)}
.ca-categories-hist{display:grid;gap:6px;min-width:0}
.ca-categories-hl{font-weight:500;color:var(--ca-mut2)}
/* 분포 자리를 카드마다 같은 높이로(그래프가 없을 때 안내) */
.ca-categories-hist-empty{display:flex;align-items:center;justify-content:center;text-align:center;height:112px;padding:0 14px;border-radius:9px;border:1px dashed var(--ca-line2);background:rgba(255,255,255,.015);font-size:12.3px;line-height:1.5;color:var(--ca-mut);word-break:keep-all}
.ca-categories-cap{margin:0;font-size:11.8px;line-height:1.5;color:var(--ca-mut)}
.ca-categories-sublabel{font-size:11.5px;font-weight:650;color:var(--ca-mut)}

.ca-categories-top{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;flex:1 1 auto}
.ca-categories-top li.is-fill{flex:1 1 auto;display:flex;align-items:center;justify-content:center;text-align:center;min-height:42px;background:transparent;border:1px dashed var(--ca-line2);font-size:12px;color:var(--ca-mut);word-break:keep-all}
.ca-categories-top li{display:grid;grid-template-columns:18px 28px minmax(0,1fr) auto;align-items:center;gap:9px;padding:6px 8px;border-radius:8px;background:rgba(255,255,255,.02);min-height:42px}
.ca-categories-top li.is-me{background:var(--ca-green-soft);outline:1px solid rgba(0,255,163,.35)}
.ca-categories-top-rank{font-weight:800;font-size:12px;color:var(--ca-mut);text-align:center}
.ca-categories-top li:nth-child(1) .ca-categories-top-rank{color:#ffd56b}
.ca-categories-top li:nth-child(2) .ca-categories-top-rank{color:#d8dbe6}
.ca-categories-top li:nth-child(3) .ca-categories-top-rank{color:#e0a46b}
.ca-categories-top-name{min-width:0;display:grid;gap:1px}
.ca-categories-top-name > a,.ca-categories-top-name > span{font-size:13px;font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ca .ca-categories-top-link{color:var(--ca-txt);text-decoration:none}
.ca .ca-categories-top-link:hover{color:var(--ca-green);text-decoration:underline}
.ca-categories-top-name small{font-size:11px;color:var(--ca-mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ca-categories-top-v{font-size:12.5px;font-weight:750;white-space:nowrap}

.ca-categories-rank{padding:9px 12px;border-radius:9px;background:var(--ca-green-soft);border:1px solid rgba(0,255,163,.3);color:var(--ca-green);font-size:13px;font-weight:700}
.ca-categories-rank small{font-weight:500;color:rgba(0,255,163,.75)}
.ca-categories-rank.is-out{background:rgba(255,255,255,.03);border-color:var(--ca-line2);color:var(--ca-txt2);font-weight:600}
.ca-categories-own{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:12.5px;color:var(--ca-txt2);padding-top:10px;border-top:1px dashed var(--ca-line2)}
.ca-categories-own small{font-size:11px;color:var(--ca-mut);font-weight:650}
.ca-categories-comp .ca-card2-foot{justify-content:space-between}
.ca-categories-reason{min-width:0;flex:1 1 160px}

/* 넓은 경쟁 카드(카테고리 1개·12칸): 지표 | 상위 채널 두 열 */
@container (min-width:720px){
  .ca-categories-cbody:has(> .ca-categories-cside){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:stretch}
}

@media (max-width:760px){
  .ca-categories-stat b{font-size:14.5px}
  .ca-categories-li-sub{flex-direction:column;gap:1px}
  .ca-categories-li-r{flex:initial}
}

/* 경쟁 카드 부분 자리(같은 행 카드끼리 높이 맞춤 — sec-categories alignParts). 빈 자리는 높이 0(간격도 없음) */
.ca-categories-cmain{gap:0}
.ca-cc-slot{display:flex;flex-direction:column;justify-content:flex-start;min-width:0}
.ca-cc-slot:not(:first-child):not(:empty){padding-top:12px}
.ca-cc-c .ca-categories-hist .ca-plot{min-height:112px}
.ca-categories-hist-empty{flex-direction:column;gap:4px}
.ca-categories-hist-empty small{font-size:11.5px;color:var(--ca-mut2)}
.ca-categories-rank.is-none{background:transparent;border:1px dashed var(--ca-line2);color:var(--ca-mut);font-weight:500;font-size:12.5px}
