/*
 * 주제별 탑3 서브 화면 머리 칸(히어로) — Claude, v1.50 (2026-10-30 이상준님)
 * 「우선 모든 주제별 탑3 서브 메인의 헤더(히어로) 부분은 네가 주도한대로 디자인해.」
 *
 * - 머리 칸(.topic-head.th-v2) 안에서만 바꾼다. 원탑·탑3·탑3 후보 막대와 그 아래 카드·단추·게시판은
 *   ChatGPT 원본(view-v48·special-v48~v50·step-numbers-v1) 그대로 — 영역별 색 묶음과 경계를 지킨다
 * - 정원 그림(제미나이) 위에 제목, 오른쪽에 화면 종류마다 다른 챔순이(ChatGPT)
 *     th-kind-normal 보통 주제 · th-kind-question 탑3 책 질문 · th-kind-proposal 탑3 책 제안 · th-kind-special 특별판·특별이벤트
 * - 앞선 꾸밈 파일이 :has(#candidates)·!important를 써서, 앞머리 H를 붙여 이긴다
 *     H = body:not(#th-a):not(#th-b) .topic-head.th-v2
 * - v1.45~v1.47의 머리 칸 규칙을 그대로 옮겼다(그때 이름표 ts-kind-* → 지금 th-kind-*)
 */
body:not(#th-a):not(#th-b) .topic-head.th-v2{
  --th-ink:#2e2633;--th-soft:#857a86;--th-rose:#c94d7c;
  --th-mascot:url("/assets/img/topic-mascot-normal.webp?v=20261030-g1");
  position:relative;overflow:hidden;min-height:228px;box-sizing:border-box;
  padding:26px 30% 24px 30px;margin-bottom:20px;
  border:0;border-radius:24px;
  background:
    linear-gradient(90deg,rgba(255,252,248,.94) 0%,rgba(255,252,248,.86) 46%,rgba(255,252,248,.18) 74%,rgba(255,252,248,0) 100%),
    url("/assets/img/topic-sub-head.webp?v=20261030-g1") center bottom/cover no-repeat,#fdf3ea;
  box-shadow:0 10px 26px rgba(214,140,160,.18);
}
body:not(#th-a):not(#th-b) .topic-head.th-v2.th-kind-question{--th-mascot:url("/assets/img/topic-mascot-question.webp?v=20261030-g1")}
body:not(#th-a):not(#th-b) .topic-head.th-v2.th-kind-proposal{--th-mascot:url("/assets/img/topic-mascot-proposal.webp?v=20261030-g1")}
body:not(#th-a):not(#th-b) .topic-head.th-v2.th-kind-special{--th-mascot:url("/assets/img/topic-mascot-special.webp?v=20261030-g1")}
body:not(#th-a):not(#th-b) .topic-head.th-v2::before{content:none}
body:not(#th-a):not(#th-b) .topic-head.th-v2::after{
  content:"";position:absolute;right:3%;bottom:6px;top:auto;width:24%;height:88%;
  background:var(--th-mascot) right bottom/contain no-repeat;
  filter:drop-shadow(0 8px 10px rgba(160,90,110,.16));opacity:1;
}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .trail{
  display:flex;flex-wrap:wrap;gap:4px 6px;margin:0 0 10px;font-size:12px;color:var(--th-soft);
}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .trail a{color:var(--th-rose);font-weight:700}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .sp-kind{
  display:inline-block;margin:0 0 8px;padding:4px 12px;border:0;border-radius:999px;
  background:linear-gradient(135deg,#f58bb0,#b48ae0);color:#fff;font-size:12px;font-weight:800;
  box-shadow:0 3px 8px rgba(200,90,140,.22);
}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .topic-title{
  margin:0 0 8px;font-family:var(--font-serif);font-size:clamp(26px,3.4vw,36px);font-weight:700;
  line-height:1.25;letter-spacing:-.03em;color:var(--th-ink);
}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .topic-sum{max-width:none;color:#5d5360}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .topic-note-big{color:#4b3f4e}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .topic-kind{
  display:inline-block;margin:0 0 10px;padding:3px 11px;border-radius:999px;
  background:#fff;border:1.5px solid #f3bfd2;color:var(--th-rose);font-size:12.5px;font-weight:700;
}
/* 질문 내용 — 말풍선 */
body:not(#th-a):not(#th-b) .topic-head.th-v2 .question-body{
  position:relative;margin:4px 0 14px;padding:14px 18px;border:1.5px solid #f3bfd2;border-radius:18px 18px 18px 6px;
  background:#fff;color:#4b3f4e;font-size:15px;line-height:1.7;white-space:pre-line;
  box-shadow:0 4px 12px rgba(214,120,160,.12);
}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .topic-stats{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 8px}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .topic-stats span{
  padding:4px 11px;border:1px solid rgba(232,112,154,.28);border-radius:999px;
  background:rgba(255,255,255,.9);color:#6b5f6d;font-size:12.5px;box-shadow:none;
}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .topic-stats b{color:var(--th-rose)}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .who{color:var(--th-soft);font-size:12.5px;margin:0}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .who a{color:var(--th-rose)}

/* v1.55 질문·제안 주제 — 「탑3 책 질문 / 탑3 책 제안」을 제목 위로, 제목만큼 크게, 뒤에 물음표·제안 그림 (2026-10-30 이상준님)
 * 「'탑3 책 질문'이 글자를 가령 '수학을 쉽게 배우는 책' 제목 위로 글자를 못지않게 크게 키워서 그 글자 앞이나 뒤에 붙여. '탑3 책 제안'도 마찬가지.」
 * 올린 사람은 원래 작은 알약(.topic-kind)에 남는다 */
body:not(#th-a):not(#th-b) .topic-head.th-v2 .th-side-label{
  display:flex;align-items:center;gap:8px;margin:2px 0 6px;
  font-family:var(--font-serif);font-size:clamp(26px,3.4vw,36px);font-weight:700;line-height:1.2;letter-spacing:-.03em;
  color:var(--th-rose);
}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .th-side-label::after{
  content:"";flex:none;width:1.9em;height:1.9em;margin:-.35em 0;
  background:url("/assets/img/topic-sub-question.webp?v=20261030-g1") center/contain no-repeat;
  filter:drop-shadow(0 3px 5px rgba(160,90,110,.22));
}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .th-side-label.th-side-proposal{color:#2f8a63}
body:not(#th-a):not(#th-b) .topic-head.th-v2 .th-side-label.th-side-proposal::after{
  background-image:url("/assets/img/topic-sub-proposal.webp?v=20261030-g1");
}
@media (max-width:759px){
  body:not(#th-a):not(#th-b) .topic-head.th-v2{min-height:0;padding:18px 34% 18px 16px;border-radius:18px;background-position:22% bottom}
  body:not(#th-a):not(#th-b) .topic-head.th-v2::after{right:2px;width:33%;height:auto;top:auto;bottom:4px;aspect-ratio:3/4}
  body:not(#th-a):not(#th-b) .topic-head.th-v2 .topic-title{font-size:23px}
  body:not(#th-a):not(#th-b) .topic-head.th-v2 .question-body{font-size:13.5px;padding:11px 13px}
  body:not(#th-a):not(#th-b) .topic-head.th-v2 .th-side-label{font-size:23px}
}
