/* battle 메뉴 하위 화면 전용 스타일(app.css 토큰만 사용). ui-battle 2026-09-26.
   새 스타일(결정 CN·CQ·CR): 바탕 없음·외곽선, 줄 사이 가는 줄. 상자는 진행 중 패널·결과에만(박스 남발 금지).
   아래 앞부분(battle.js 공용 부품: 등급 색·효과 줄·서든데스·사냥 부가 줄)은 사냥 화면(app.js)에서도 쓰인다.
   결정 BS② 2단계(2026-09-29): 글자 = --fs-*, 간격 = --sp-*(4px 격자), 줄 간격 = --lh-*(직접 px는 테두리·크기·그림자에만). 규칙 상자(.twb-rules)·꼬리표(.twb-tag)는
   제목 옆 ⓘ 팝오버로 옮겨 지웠다(결정 BS5). 작은 배지는 상태 태그 모양(테두리 없음 — 결정 BU3·BT4). */

/* ---------- 등급 색 이름(흰 · 녹 · 파 · 황금 · 빨강+불씨 · 흰 굵은+광휘). 강화 +N은 같은 span 안이라 이름 색을 상속한다 ---------- */
.twb-item { color: var(--text); font-weight: 700; overflow-wrap: anywhere; }
/* 색은 app.css 공통 등급 토큰(--grade-*)만 쓴다 */
.twb-item.is-common { color: var(--grade-common); }
.twb-item.is-uncommon { color: var(--grade-uncommon); }
.twb-item.is-rare { color: var(--grade-rare); }
.twb-item.is-heroic { color: var(--grade-heroic); }
.twb-item.is-legendary { color: var(--grade-legendary); text-shadow: 0 0 4px color-mix(in srgb, var(--fx-burn) 70%, transparent), 0 -1px 6px color-mix(in srgb, var(--gold) 45%, transparent); }
.twb-item.is-relic { color: var(--grade-relic); font-weight: var(--grade-relic-weight); text-shadow: 0 0 6px color-mix(in srgb, var(--strong) 60%, transparent), 0 0 12px color-mix(in srgb, var(--fx-holy) 55%, transparent); }
.twb-item.is-replica { color: var(--grade-replica); }
/* 획득 아이템 빛 알약의 등급 색은 app.css(.tw-loot.is-*, 공통 토큰). 여기서는 연출만 더한다 */
.tw-loot.is-legendary span { animation: twb-ember 1.4s ease-in-out infinite alternate; }
.tw-loot.is-relic span { text-shadow: 0 0 6px var(--loot), 0 0 14px color-mix(in srgb, var(--fx-holy) 70%, transparent); }
@keyframes twb-ember { from { text-shadow: 0 0 4px color-mix(in srgb, var(--fx-burn) 80%, transparent); } to { text-shadow: 0 -2px 8px color-mix(in srgb, var(--gold) 70%, transparent), 0 0 3px var(--loss); } }
.tw-loot { max-width: 100%; overflow-wrap: anywhere; text-align: center; }

/* ---------- 결과 부가 줄 ---------- */
.tw-outcome__sub { font-size: var(--fs-sub); color: var(--muted); overflow-wrap: anywhere; }
.tw-outcome__sub.is-warn { color: var(--warn); }
.tw-outcome__sub b { color: var(--strong); }
/* 스폰 표지(정예·희귀·보물 몬스터): 바탕 없음·글자 색만(결정 CN2·CN3, 2026-09-30 — 옛 옅은 덧칠 바탕 삭제). 결과 줄 아래 왼쪽 */
.twb-spawn { justify-self: start; display: inline-flex; align-items: center; min-height: 22px; font-size: var(--fs-cap); font-weight: 700; padding: 0; color: var(--count);
  background: transparent; border: 1px solid transparent; border-radius: var(--radius-chip); }   /* 상태 태그 모양(결정 BT4 색 테두리 없음 — CN3 강조는 글자 색만) */
.twb-spawn.is-rare { color: var(--career); } .twb-spawn.is-money { color: var(--gold); }
.twb-hidden { font-size: var(--fs-sub); color: var(--fx-holy); overflow-wrap: anywhere; }
.twb-hidden b { color: inherit; }
.twb-grant { display: grid; gap: var(--sp-2); padding: var(--sp-2) 0 var(--sp-1); border-top: 1px solid var(--rule); text-align: left; }
.twb-grant__h { font-size: var(--fs-cap); color: var(--muted); font-weight: 700; }
.twb-grant .twb-list { text-align: left; }

/* ---------- 전투 기록 확장 ---------- */
.tw-skill { color: var(--strong); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.tw-skill.is-boss { color: var(--foe); }
.tw-sd { color: var(--loss) !important; opacity: 1 !important; font-weight: 700; }
.tw-turn.is-sudden { border-color: color-mix(in srgb, var(--loss) 55%, var(--phos-edge)); }
.tw-fx.is-heal { color: var(--win); } .tw-fx.is-mp { color: var(--mp); } .tw-fx.is-buff { color: var(--count); }
.tw-fx.is-debuff { color: var(--fx-bleed); } .tw-fx.is-counter { color: var(--strong); } .tw-fx.is-exec { color: var(--loss); font-weight: 700; }
.tw-fx.is-equip { color: var(--grade-heroic); }   /* 장비 효과 발동(EQUIP_EFFECT) */
.tw-line { overflow-wrap: anywhere; }

/* ---------- 사냥 화면 보조(app.js) ---------- */
.twb-huntmeta { font-size: var(--fs-sub); color: var(--muted); overflow-wrap: anywhere; }
.twb-huntmeta b { color: var(--strong); }
.twb-sep { color: var(--faint); }
.twb-huntmeta.is-note { font-size: var(--fs-cap); color: var(--muted); border-left: 2px solid var(--info); padding-left: var(--sp-2); }
/* UI 개편 묶음 1(결정 AP1 D3): 주 버튼 '{사냥터} 사냥 1회' 전폭, '10회 연속'은 바로 아래 전폭 보조. 비활성이면 이유 글자 */
.tw-hunt-acts { display: grid; gap: var(--sp-2); margin-top: var(--sp-2); }
.tw-hunt-why:empty { display: none; }
.tw-hunt-why { display: flex; align-items: center; justify-content: center; gap: var(--sp-2); flex-wrap: wrap; text-align: center; }
.tw-back { margin: 0 0 calc(-1 * var(--sp-2)); }
.tw-back .tw-btn { padding-left: 0; }
.twb-huntpick { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.twb-huntpick .tw-btn[aria-pressed="true"] { background: var(--inv-bg); color: var(--inv-fg); border-color: var(--inv-bg); }

/* ---------- 전투 메뉴 화면 틀 ---------- */
/* 결정 CN·CQ·CR(갈래 C, 2026-09-30 — 모드 화면 공용 틀: 던전·보스·파티원정·길드보스·훈련·아레나·토너먼트): 옛 ═ 머리 장식·+/− 글자·점선·직각 입력·반전 없음,
   구역 제목 = 카드 제목(S4 13px 굵게 자간 .04em), 접힘 = 공용 화살표(오른쪽, 열면 위), 목록 줄 사이 = 가는 줄(--rule), 입력 칸 44px·모서리 8 */
.twb { display: grid; gap: var(--sp-4); min-width: 0; }
.twb > *, .twb-sec > *, .twb-panel > * { min-width: 0; }
.twb-h { font-size: var(--fs-card); font-weight: var(--fw-card); letter-spacing: var(--ls-card); color: var(--fg-2); display: flex; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap; margin: 0; }
.twb-h small { font-weight: 400; }
/* 결정 BS② 2단계: 구역 제목 + 옆 ⓘ(helpTip은 h2 밖 형제 — 제목 이름에 버튼 이름이 섞이지 않게). 누름 영역 44px은 세로 여백을 먹지 않게 겹친다 */
.twb-hrow { display: flex; align-items: center; gap: var(--sp-1); flex-wrap: wrap; min-width: 0; }
.twb-hrow > .twb-h { flex: 0 1 auto; min-width: 0; }
.twb-hrow > .tw-tip { margin-block: calc(-1 * var(--sp-3)); }
.twb-sec { display: grid; gap: var(--sp-2); padding-top: var(--sp-3); border-top: 1px solid var(--rule); }
.twb-sec.twb-last { border-top: 0; padding-top: 0; }
.twb-panel { border: 1px solid var(--line); border-radius: var(--radius); background: transparent; padding: var(--sp-3); display: grid; gap: var(--sp-2); }
.twb-panel .twb-sec { padding-top: var(--sp-3); }
.twb-note { font-size: var(--fs-sub); color: var(--muted); border-left: 2px solid var(--rule-v); padding: var(--sp-1) 0 var(--sp-1) var(--sp-3); overflow-wrap: anywhere; }
.twb-note b { color: var(--strong); }
.twb-note .tw-links { margin-top: var(--sp-1); }
.twb-label { font-size: var(--fs-cap); color: var(--muted); font-weight: 700; margin-bottom: calc(-1 * var(--sp-1)); }
.twb-chips { display: flex; flex-wrap: wrap; gap: var(--sp-2); }
.twb-msg:empty { display: none; }
.twb-foe { color: var(--foe); }
.twb-me { color: var(--me) !important; }
.twb-win { font-weight: 700; color: var(--strong); text-decoration: underline; text-underline-offset: 3px; }
.twb-vs { color: var(--faint); font-size: var(--fs-cap); margin: 0 var(--sp-1); }
.twb-num { font-weight: 700; color: var(--strong); font-variant-numeric: tabular-nums; }
.twb-star { color: var(--count); font-weight: 800; letter-spacing: .08em; }
.twb-kv dd { min-width: 0; overflow-wrap: anywhere; }
.twb-kv > div { flex-wrap: wrap; }

/* 목록: 줄 사이 가는 줄(상자 없음) */
.twb-list { display: grid; }
.twb-row { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2) var(--sp-2); padding: var(--sp-2) 0; border-bottom: 1px solid var(--rule); flex-wrap: wrap; font-size: var(--fs-body); }
.twb-row:last-child { border-bottom: 0; }
.twb-row__main { display: grid; gap: var(--sp-1); min-width: 0; flex: 1 1 180px; }
.twb-row__main b, .twb-row__main p { overflow-wrap: anywhere; }
.twb-row__main small { color: var(--muted); font-size: var(--fs-cap); overflow-wrap: anywhere; }
.twb-row .tw-btn { min-height: 44px; padding: var(--sp-2) var(--sp-3); font-size: var(--fs-body); flex: none; }   /* 결정 DF1: 40 → 44 */
.twb-row .tw-btn[aria-pressed="true"] { background: var(--inv-bg); color: var(--inv-fg); border-color: var(--inv-bg); }
.twb-offers .twb-row__main b { color: var(--count); }
/* 결정 AR2(2026-09-28): 던전 상점 선택지는 세로 3줄이 아니라 가로 3칸. 칸 안 = 이름 · 설명 · 사기 버튼(아래 붙음) */
.twb-offers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-2); }
.twb-offer { display: flex; flex-direction: column; gap: var(--sp-1); padding: var(--sp-3); border: 1px solid var(--line-2); background: var(--surface); min-width: 0; font-size: var(--fs-body); }
.twb-offer b { color: var(--count); overflow-wrap: anywhere; }
.twb-offer small { color: var(--muted); font-size: var(--fs-cap); overflow-wrap: anywhere; flex: 1; }
.twb-offer .tw-btn { width: 100%; min-height: 38px; padding: var(--sp-2) var(--sp-2); font-size: var(--fs-sub); margin-top: var(--sp-1); }
@media (max-width: 420px) { .twb-offers { gap: var(--sp-2); } .twb-offer { padding: var(--sp-2) var(--sp-2); } .twb-offer .tw-btn { font-size: var(--fs-cap); padding: var(--sp-2) var(--sp-1); } }
/* 결정 AR1: 던전 전투 기록 화면 맨 위 이동 버튼 */
.twb-dg-nav { justify-content: space-between; }
.twb-dg-nav .tw-btn { flex: 1 1 0; }
.twb-oc { font-weight: 700; }
.twb-oc.is-win { color: var(--win); } .twb-oc.is-loss { color: var(--loss); } .twb-oc.is-draw { color: var(--draw); }

/* 층·구간 진행 줄(옛 ■■■··· 글자 막대는 결정 CN 으로 가는 둥근 막대 — screens_boss.css progress.tw-mbar) */
.twb-floors { display: flex; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap; font-size: var(--fs-sub); color: var(--muted); }
.twb-dosbar { font-variant-numeric: tabular-nums; letter-spacing: 1px; overflow-wrap: anywhere; word-break: break-all; }
.twb-dosbar .is-on { color: var(--fg-2); } .twb-dosbar .is-off { color: var(--faint); }

/* 보스 */
.twb-boss { display: flex; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap; font-size: var(--fs-strong); }
.twb-boss small { font-size: var(--fs-cap); }
.twb-patterns { display: grid; gap: var(--sp-1); font-size: var(--fs-sub); }
.twb-patterns li { overflow-wrap: anywhere; }
.twb-patterns li::before { content: "· "; color: var(--faint); }   /* 결정 BS② 2단계: 글자 기호 ▸ 대신 가운데 점 */
.twb-patterns small { color: var(--muted); }

/* 파티원정 */
.twb-code { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; font-size: var(--fs-body); }
.twb-code b { font-size: var(--fs-title); letter-spacing: .18em; padding: var(--sp-1) var(--sp-3); background: var(--inv-bg); color: var(--inv-fg); font-variant-numeric: tabular-nums; user-select: all; }
.twb-parts { gap: var(--sp-2); }
.twb-part { display: grid; gap: var(--sp-1); padding: var(--sp-2) 0; border-bottom: 1px dotted var(--line-2); }
.twb-part:last-child { border-bottom: 0; }
.twb-part p { display: flex; align-items: baseline; gap: var(--sp-2); flex-wrap: wrap; font-size: var(--fs-body); }
.twb-part.is-dead b { text-decoration: line-through; opacity: .7; }

/* 토너먼트 대진 */
.twb-round { display: grid; gap: var(--sp-1); }
.twb-round + .twb-round { margin-top: var(--sp-2); }
.twb-round__h { font-size: var(--fs-sub); color: var(--muted); }
.twb-match p { font-size: var(--fs-body); }

/* 입력(시스템 글꼴 그대로 — 결정 CN: 선 --line-strong · 모서리 8 · 초점 인디고) */
.twb-form { display: grid; gap: var(--sp-2); }
.twb-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: var(--sp-2); }
.twb-fields[hidden] { display: none; }
.twb-form label { display: grid; gap: var(--sp-1); font-size: var(--fs-sub); color: var(--muted); min-width: 0; }
.twb select, .twb input[type="text"] { font: inherit; font-size: var(--fs-body); width: 100%; min-width: 0; min-height: 44px; padding: var(--sp-2) var(--sp-3); border: 1px solid var(--line-strong); border-radius: var(--radius-btn);
  background: transparent; color: var(--fg-2); }
.twb select:focus, .twb input[type="text"]:focus { border-color: var(--accent); outline: 0; }
.twb-fieldset { border: 0; padding: 0; margin: 0; display: grid; gap: var(--sp-2); min-width: 0; }
.twb-fieldset legend { font-size: var(--fs-sub); color: var(--muted); padding: 0; margin-bottom: var(--sp-1); }

/* 탭(screens.js bindTabs 형식): 모양은 공통 .tw-tabs(묶음 0 — 균등 폭·44px·선택 3px 밑줄)를 그대로 쓴다(묶음 1에서 옛 덮어쓰기 제거) */
.twb [role="tabpanel"] { display: grid; gap: var(--sp-4); min-width: 0; }
.twb [role="tabpanel"][hidden] { display: none; }

/* UI 개편 묶음 1: 요약 상자 두 개(아레나 내 기록 · 순위), 승·패·무 값 색, 큰 수치 */
.twb-boxes { display: grid; gap: var(--sp-2); min-width: 0; }
/* 결정 DF1 검토(2026-09-30): 카드 끝 링크 줄(아레나 '전투기록 보기')의 투명 ::before(위로 12px)가 바로 위 버튼 아래 2px 를 가로챘다(카드 간격 10) → 한 칸(--sp-1) 더 띄움(통합 확인: 결정 BU1 역할 토큰만 — 3px 대신 토큰) */
.twb .tw-card > .tw-links { margin-top: var(--sp-1); }
.twb-w { color: var(--win); } .twb-l { color: var(--loss); } .twb-d { color: var(--draw); }
.twb-big { font-size: var(--fs-strong); }
.twb-gb-tags { display: inline-flex; flex-wrap: wrap; gap: var(--sp-1); }
.twb-def small { overflow-wrap: anywhere; }
.twb .tw-table small { font-size: var(--fs-cap); }
.twb .tw-rowlist .tw-row__foot .tw-btn { min-height: 36px; padding: var(--sp-1) var(--sp-3); }

/* 접는 상자: 하위 목록 · 전투 기록(데이터 펼침 — 설명이 아님). 펼침 표시는 공용 접힘 알림(details.tw-note)과 같은 +/−(결정 BS② 2단계: 글자 기호 ▸▾ 제거).
   옛 규칙 상자(.twb-rules)·꼬리표(.twb-tag)는 제목 옆 ⓘ 팝오버로 옮겨 지웠다(결정 BS5). */
.twb-sub > summary, .twb-log > summary { cursor: pointer; list-style: none; display: flex; align-items: baseline; gap: var(--sp-2); min-height: 44px; padding: var(--sp-2) var(--sp-3); font-size: var(--fs-sub); color: var(--muted); }
.twb-sub > summary::-webkit-details-marker, .twb-log > summary::-webkit-details-marker { display: none; }
.twb-sub > summary::after, .twb-log > summary::after { content: ""; flex: none; width: 7px; height: 7px; margin-left: auto; align-self: center; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: translateY(-2px) rotate(45deg); }
.twb-sub[open] > summary::after, .twb-log[open] > summary::after { transform: translateY(2px) rotate(-135deg); }
.twb-sub > summary { padding-left: 0; padding-right: var(--sp-1); }
.twb-log { border-top: 1px solid var(--rule); }
.twb-log > summary { padding-left: 0; padding-right: var(--sp-1); color: var(--fg-2); font-weight: 700; }
.twb-log > div { display: grid; gap: var(--sp-2); }

/* 결과 묶음 */
.twb-result { display: grid; gap: var(--sp-2); min-width: 0; }
.twb-result__h { font-size: var(--fs-sub); color: var(--muted); font-weight: 700; overflow-wrap: anywhere; }
.twb-result__outcome { border: 1px solid var(--line-2); background: var(--surface); padding: var(--sp-2) var(--sp-3); }

@media (max-width: 420px) {
  .twb-row .tw-btn { min-height: 44px; padding: var(--sp-2) var(--sp-3); }
  .twb-code b { font-size: var(--fs-section); letter-spacing: .12em; }
  .twb-fields { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); }
}
@media (max-width: 370px) {
  .twb-row__main { flex-basis: 100%; }
  .twb-fields { grid-template-columns: 1fr; }
  .twb .tw-tabs button { padding: var(--sp-2) var(--sp-3); }
}
@media (prefers-reduced-motion: reduce) { .tw-loot.is-legendary span { animation: none; } }
/* [확정 AG5] 대진표 한 칸의 '전직명 · N시드'가 좁은 화면에서 '시/드'처럼 끊기지 않게 */
.twb-match .twb-seed { white-space: nowrap; }

/* ==================== 결정 CK·CL — 갈래 G2(2026-09-29): 사냥 화면·전투 기록 기능 구조 ====================
   → 결정 CN·CQ·CR 새 스타일 2단계 갈래 B(2026-09-30): 모양을 새 스타일로 옮겼다. 전투 카드 틀(초상·머리·HP/MP·스펙 칸)은 app.css '영역: 전투',
   공용 칸·'더 보기' 단추·결과 줄·속성 표지는 app.css 공용 부품(.tw-kvg·.tw-more·.tw-result·.tw-attr)을 쓴다.
   속성 색 8종 토큰(--attr-*)은 공용 기반(1단계)이 app.css 에 --el-* 별칭으로 옮겨 이 파일의 옛 값 덮어쓰기(CK17 [임시] 값)를 지웠다. */

/* 결정 CK16·CN2·CM10 B3: 참가자 초상 바탕 = 화면 바탕색 한 가지(격자·나/상대 편 색 없음). CK21: 도트 원본 128px 까지 — 새 스타일은 56px(휴대폰)·64px */
.tw-fighter .tw-fighter__portrait, .tw-fighter.is-me .tw-fighter__portrait, .tw-fighter.is-foe .tw-fighter__portrait { background: var(--bg); }
/* 결정 CK17·CK18 → CQ5·CQ6: 머리 한 줄 = '전직명 [속성 아이콘 + 글자]' 또는 '[속성] 등급'(점 구분자 없이 간격만) */
.tw-fighter__meta { display: flex; align-items: center; gap: var(--sp-2); min-width: 0; white-space: nowrap; font-size: var(--fs-sub); line-height: var(--lh-tight); color: var(--fg); }
.tw-fighter__meta .tw-fighter__job { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.tw-fighter__meta .tw-attr .tw-attr__i { width: 14px; height: 14px; }
.tw-fighter__rank { flex: none; font-weight: var(--fw-strong); color: var(--fg); }
.tw-fighter__rank.is-elite { color: var(--career); } .tw-fighter__rank.is-rare, .tw-fighter__rank.is-money { color: var(--gold); } .tw-fighter__rank.is-boss { color: var(--bad); }
/* 결정 CR5·CR13: '전투 스펙 더 보기' = 글자 없는 단추(공용 details.tw-more, 오른쪽) — 열면 나머지 스펙(3칸 격자) + 전투 당시 장비 목록 */
.tw-fighter__more > .tw-more__body { margin-top: var(--sp-1); gap: var(--sp-2); }
.tw-fighter__stats.is-sub .tw-kvg__k { font-size: var(--fs-cap); }
/* 결정 CM6·CR3·CR10·CR14: 전투 당시 장비 = 부위 이름 열 + [부위 선 아이콘 + 장비 이름(등급 색) + 강화(이름 바로 옆)], ':' 없음, 줄 사이 가로 줄 없음 */
.tw-fighter__gear { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--sp-3); row-gap: var(--sp-1); margin: 0; font-size: var(--fs-sub); line-height: var(--lh-tight); }
.tw-fighter__gear > div { display: contents; }
.tw-fighter__gear dt { color: var(--muted); font-size: var(--fs-cap); white-space: nowrap; align-self: center; }
.tw-fighter__gear dd { margin: 0; min-width: 0; display: flex; align-items: center; gap: var(--sp-1); overflow-wrap: anywhere; word-break: keep-all; }
.tw-fighter__gear .tw-fighter__slot-i { width: 14px; height: 14px; flex: none; color: var(--muted); }
.tw-fighter__gear small { color: var(--muted); font-weight: var(--fw-regular); }
.tw-fighter__nogear { font-size: var(--fs-cap); color: var(--muted); }

/* 결정 CK26: 턴 끝 글자 없는 작은 단추(물음표 선 아이콘) — 누르면 그 턴의 내 기술 미발동 사유(나만 보임).
   새 스타일: 보이는 28px 칩 모서리(3px) 선 단추, 누름 영역 44px(투명 ::before), 열리거나 올리면 인디고. 펼친 사유 = 바탕 없는 선 상자(8px) */
.tw-why { display: grid; justify-items: end; min-width: 0; }
.tw-why > summary { position: relative; list-style: none; cursor: pointer; display: inline-grid; place-items: center; width: 28px; height: 28px; color: var(--muted);
  border: var(--bw) solid var(--line-strong); border-radius: var(--radius-chip); }
.tw-why > summary::before { content: ''; position: absolute; inset: -9px; }   /* 결정 DF1: 테두리 안쪽 26 + 18 = 44 */
.tw-why > summary::-webkit-details-marker { display: none; }
.tw-why > summary .tw-li { width: 15px; height: 15px; }
.tw-why[open] > summary, .tw-why > summary:hover { color: var(--accent); border-color: var(--accent); }
.tw-why__body { justify-self: stretch; margin-top: var(--sp-2); padding: var(--sp-2) var(--sp-3); font-size: var(--fs-cap); line-height: var(--lh-base); color: var(--fg); background: transparent;
  border: var(--bw) solid var(--line); border-radius: var(--radius-sm); text-align: left; overflow-wrap: anywhere; }
.tw-why__body ol { margin: 0; padding-left: var(--sp-4); display: grid; gap: var(--sp-1); }
.tw-why__h { color: var(--fg-2); font-weight: var(--fw-strong); }
.tw-why__h small { color: var(--muted); font-weight: var(--fw-regular); }
.tw-why.is-rest > summary { width: auto; height: auto; min-height: 44px; padding: var(--sp-1) var(--sp-3); font-size: var(--fs-cap); }
.tw-why.is-rest > summary::before { content: none; }

/* 결정 CK25: 연속 사냥 결과 = 회차별 한 줄(작은 글자). 줄을 누르면 그 판 기록(#pick).
   새 스타일: 줄 사이 가로 줄 없음, 누름 높이 44px, 누른 줄만 인디고 글자 + 왼쪽 선 하나(CR15 — 묶음 안 색 세로선 최대 1개) */
.tw-blines { list-style: none; margin: 0; padding: 0; display: grid; }
.tw-bline { all: unset; box-sizing: border-box; display: flex; align-items: center; width: 100%; min-height: 44px; padding: var(--sp-1) var(--sp-2); font-size: var(--fs-cap); line-height: var(--lh-base);
  color: var(--fg); border-left: 2px solid transparent; cursor: pointer; overflow-wrap: anywhere; }
.tw-bline__t { min-width: 0; }   /* 줄 글자 한 덩어리(가운데 세로 맞춤 안에서 '1회'와 보상 글자 사이 띄어쓰기 유지) */
.tw-bline:hover:not(:disabled) { color: var(--fg-2); }
.tw-bline[aria-pressed="true"] { color: var(--accent); border-left-color: var(--accent); }
.tw-bline[aria-pressed="true"] .tw-bline__n { color: var(--accent); }
.tw-bline:disabled { cursor: default; color: var(--muted); }
.tw-bline:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.tw-bline__n { color: var(--fg-2); margin-right: var(--sp-1); }
.tw-bline__oc.is-loss { color: var(--loss); } .tw-bline__oc.is-timeout { color: var(--draw); } .tw-bline__oc.is-voided { color: var(--muted); }
.tw-batch .tw-card__aside { font-size: var(--fs-cap); }

/* 결정 CK10: 50회 연속 이용권 한 줄(버튼 아래, 이용권이 있을 때만) */
.tw-hunt-perk { display: flex; align-items: center; justify-content: center; gap: var(--sp-1); margin: var(--sp-1) 0 0; font-size: var(--fs-cap); color: var(--muted); }
/* 결정 CK14: 패배 원인 낱말(예: '강제이동')은 기존 위험 색 토큰 */
.tw-ca-cause__t .tw-ca-cause__w { color: var(--bad); }
/* 결정 CK11: 사냥터 ⓘ '배울 것' 번호 목록('1. 사거리' 줄 + '- 설명' 줄). 팝오버 안을 끝까지 내려도 바깥 화면이 따라 스크롤되지 않게
   (안쪽 스크롤이 0 으로 되돌아가던 문제는 공용 팝오버 core.js 가 고쳤다 — 결정 DF10 으로 ca_record.js 의 따로 막음은 지움) */
[data-ca-intro-pop] { overscroll-behavior: contain; }
.tw-ca-lessons.is-num { list-style: none; padding-left: 0; }
.tw-ca-lessons.is-num .tw-ca-lesson__d { display: block; color: var(--text); }
.tw-ca-lessons.is-num .tw-ca-lesson__n { display: block; color: var(--muted); font-size: var(--fs-cap); }
