/* core/presets/shell/_shared/shell-set-base.css */
/*
  core/presets/shell/_shared/shell-set-base.css — 셸 세트 공통 골격(2026-09-04 · 시공 조 · 완성형세트확정)
  ────────────────────────────────────────────────────────────────────────────
  두 세트(full-width · sidebar)가 공유하는 규칙만 담는다. 세트별 차등(사이드바
  있음/없음)은 core/presets/shell/{set}/shell-set.css 쪽에 있다. 이 파일은 세트 이름과 무관하게
  «상시» 로드된다(assemble-bundle.mjs loadShellSetCss()) — 중복 선언 0.

  🔒 이 파일이 core/ 인 이유(P2 판정 근거) — 사이트가 지금 이 규칙을 «쓰든 안 쓰든» 정당하다.
  선택은 sites/{site}/shell/shell-set.jsonc 「set 이름 1개」뿐이고, 규칙 자체는 사이트 파일에
  없다.

  출처(발명 0 — 전부 실측, _강화/_라이브정본/page-bundle.css 재확인 2026-09-04) ───────────────
    본문 폭 상한   L25895 `.grid-container { margin-left:auto; margin-right:auto; max-width: var(--site-w, 1300px) }`
    본문 사슬 flex  L1064-1082 `@media(min-width:769px){ body .site-content{display:flex;...}
                  body .site-content #primary,.content-area{display:flex;flex-direction:column}
                  body .site-content #primary>.site-main,.content-area>.site-main{flex:1 0 auto;...}
                  body .site-content article{flex:1 0 auto} }`
    사이드바 없음 채움  L11725 `body.no-sidebar .site-content .content-area{flex:1 1 auto;width:auto;min-width:0;overflow-x:hidden}`
    검색영역 옵션 스위치  2026-09-04 토큰배관 조 판단분(§ⓒ) — `.search-pill{display:var(--search-display, flex)}`.
                  시공 = 이 회차(완성형세트확정 조). sites/sise/shell/shell.css 쪽의 기존
                  `.chrome .search-pill{display:flex;...}` 규칙에서 `display:flex;` 리터럴을 제거해
                  이 스위치가 실제로 값을 결정하도록 짝을 맞췄다(그 편집은 shell.css 파일 쪽 —
                  값 1개 삭제일 뿐 골격 신설이 아니다).
    동의 팝업 «칸»   2026-09-05 잔여묶음 조 — 세트 «구성 목록»(README.md 신설분) §6 항목. 사용자
                  확정("개인정보·쿠키 팝업도 세트 상시 구성 요소 · 모든 사이트 적용 · 기본 켜짐 ·
                  끌 수 있는 옵션") 이행. --search-display 선례를 «그대로» 따른 «하나»의 스위치
                  (3단계 0 · KISS). 🔴 지금은 core/compliance 자산(consent-self.js/css)이 이
                  세트에 배선돼 있지 않아(읽기만·시공 0) 아래 두 셀렉터에 일치하는 마크업이
                  «어디에도 없다» — 그래서 이 규칙은 지금 아무것도 렌더하지 않는다(무해·자산 0).
                  배선(애드센스 승인 뒤 별건)이 되는 순간 이 스위치가 «이미 있어» 그 조가 새로
                  설정을 만들 필요가 없다. 재호출 버튼은 «이 스위치»가 아니라 «자산 배선 여부»로만
                  나온다(설정 하나로 둘을 겸하지 않는다 — 배선 조가 버튼 마크업을 낼 때만 뜻이
                  생기는 별도 규칙 · display:revert 는 "이 스위치가 안 건드린다"는 뜻의 명시).
*/
.grid-container{margin-left:auto;margin-right:auto;max-width:var(--site-w, 1300px)}
@media(min-width:769px){
  /* 🔴 2026-09-05 사용자 확정 — «본문과 사이드바의 시작 위치는 불변»이다.
   사이트가 바꿀 수 있는 것은 «메뉴 하단으로부터의 거리»(--gap-below-menubar)뿐이고,
   🔴 «두 칸이 어긋나게» 만들 수 있는 구조는 그 자체가 결함이다.
   🔴 기준선 = «메뉴바가 끝나는 선(헤더 하단)». 그 선에서 «같은 거리»만큼 떨어져 본문과 사이드바가 둘 다 시작한다.
   그래서 상단 간격을 «두 칸의 공통 부모»(.site-content)에 «한 번만» 둔다 — 한 칸에만 주면 어긋나고,
   두 곳에 주면 기준선이 흐려진다. 🔴 헤더·메뉴 높이가 달라져도 정렬은 영향받지 않는다(기준이 헤더 아래다).
   ⚠️ .inside-article 의 위쪽 여백과 .info-sidebar 의 margin-top 은 «0»이어야 한다
      (두 번 걸리면 또 어긋난다). 기본값 30px = 원본(라이브 캡처) 값. */
body .site-content{display:flex;align-items:stretch}
/* 🔴 2026-09-05 사용자 확정 — «본문은 회색 바탕 위의 «흰 상자»»다. 구분을 만드는 것은 «여백»이 아니라
   «배경 대비»다(사용자: 「회색 배경에 본문 영역 화이트 배경으로 감싸서 구분되는 방식」).
   원본(모두의카드 라이브) = .separate-containers .inside-article{background-color:#ffffff}
   🔴 «배경만»이다 — 테두리 «없음» · 모서리 «없음» · 그림자 «없음»(사용자 「모서리 둥글기 없이」와 일치)
   ⚠️ 사이드바 패널은 «다른 물건»이다(테두리·모서리 10px·그림자를 «가진다») — 한 벌로 맞추지 마라.
      원본이 그렇게 생겼다. 「통일하면 나아 보인다」는 «우리 미감»이지 원본도 사용자 요구도 아니다.
   🔴 «미이식»이었다 — 프리셋·백업 15개·시세 셸 «어디에도 없었다»(한 번도 온 적 없음).
   🚫 원본 선택자군에 있는 «.page-header 는 뺐다» — 🔴 «우리 모듈»과 이름이 겹친다.
      우리 page-header 는 «자기 배경(파랑)»을 가진 모듈이라 흰색이 덮으면 깨진다.
      같은 이유로 «여백 규칙»에서도 뺐다(2026-09-05 · 같은 함정에 하루 두 번). */
/* ⚠ 10-06 JWHUBAD10: 이 자리에 있던 배경 줄은 전체 폭으로 옮겼다(아래 @media 닫는 괄호 바로 뒤). */
  body .site-content #primary,body .site-content .content-area{display:flex;flex-direction:column}
  body .site-content #primary>.site-main,body .site-content .content-area>.site-main{flex:1 0 auto;display:flex;flex-direction:column}
  body .site-content article{flex:1 0 auto}
}
/* 10-06 JWHUBAD10(사용자 «F7F8F9 = 전체 바탕 · FFFFFF = 본문 상자 · 휴대폰에서 본문이 회색으로 구분 안 됨»): 본문 흰 바탕 줄 = 폭과 무관한 «배경 대비»라 @media(min-width:769px) 밖(전체 폭). 원인 = 2026-09-05 커밋 14f959a2 가 이 줄을 라이브 L1064-1082 의 flex 배치 미디어 블록 «안»에 함께 넣었다(flex 배치는 ≥769px 한정이 맞지만 배경은 아님). flex 배치 등 나머지는 그대로. */
.separate-containers .inside-article,
.separate-containers .comments-area,
.separate-containers .paging-navigation,
.inside-page-header{background-color:var(--fill-surface, #ffffff)}
body.no-sidebar .site-content .content-area{flex:1 1 auto;width:auto;min-width:0;overflow-x:hidden}
.chrome .search-pill{display:var(--search-display, flex)}
.cmp-bar,[data-core-compliance="cookie-banner"]{display:var(--consent-popup-display, block)}
[data-core-compliance="cookie-settings"],#core-compliance-cookie-settings{display:revert}

/* 헤더 오른쪽 위젯(2026-09-05 잔여묶음 조 §3-e — tcggrail body-prefix.html:43-47 .hdr-switch
   CSS 그대로·값만 sise 토큰으로) — 「전환(아이템 사이 이동)」과 메뉴바(「아이템 안 이동」)는
   다른 축이라 별개 컨테이너다(§3 사용자 확정 — 중복 아님). 토글 3종은 --search-display 와
   같은 계열: 기본값 — 아이템·언어 «켜짐»(판정 뒤집힘 반영), 커스텀 링크는 채울 값이 아직
   없어 «꺼짐»(자산 0 과 같은 이유 — §0-23 참고).
   🔴 아이콘 유무는 «의도»다 — 헤더는 붙박이라 항상 보여 간결하게(아이콘 0), 푸터는
   스크롤해야 보여 아이콘으로 눈에 띄게 한다. 🔴 통일시키지 마라. 불일치가 아니다.
   (2026-09-05 청약편입배선 조 — 아래 §푸터 로케일 위젯 주석에만 있던 문장을 이 헤더 자리에도
   병기 · 한쪽에만 적으면 다른 쪽을 보는 사람이 모른다.) */
/* 🔴 2026-09-05 조A — 정렬 원복 + 알약 + 글자색(지휘자 지시 §A9·S13). 지시서 §6-b 대조 결과
   ①margin-left:auto 는 우리가 손으로 .search-pill 쪽에 옮겨 걸었던 것 — 원본(tcggrail)대로
   이 규칙(hdr-switch)으로 되돌린다(아래 .search-pill 쪽 auto-margin 은 뺐다 — §6-b 요구대로
   "둘 다 걸어 두지 않는다"). ②🔴 알약 «단위» = 위젯 전체 하나가 아니라 «항목마다»(지휘자
   정정 — 사용자 원문 "(에너지) (한국어) 이런 식으로"가 각 항목에 괄호가 붙은 형태를 가리켜
   확정). 그래서 배경·테두리·둥근모서리·패딩 4개 선언은 이 컨테이너가 아니라 아래
   `.nav-item[data-hdr]`/`a[data-hdr="custom"]` 각각에 걸었다 — 값은 «새로 만들지 않고»
   바로 아래 .chrome .search-pill 규칙에서 문자 단위로 그대로 인용했다(tcggrail·모두의카드
   둘 다 hdr-switch 를 알약으로 감싼 선례가 없어 — 실측 grep 0건). ③글자색 — 이전 값
   #B2B2BE(--text-neutral-mute) 는 이 알약 배경(#f0f0f0)에서 대비 1.84:1 로 AA 미달이었다
   (지휘자 계산). 새 hex 를 고르지 않고 이 셸이 이미 갖고 있던 --mist(#575760 ·
   .search-pill 이 같은 배경 위에서 이미 쓰는 그 토큰)를 그대로 재사용했다 — #575760 on
   #f0f0f0 = 6.27:1 AA 통과(지휘자 계산). ④가운뎃점(.dot) — tcggrail 원본에도 두 항목
   "사이" 구분자로 있었을 뿐 알약 자체는 원본에 없어(위 ② 근거) 알약과 짝지어 본 선례가
   없다. 애매하면 지우지 않는다(오늘 규율)는 원칙에 따라 그대로 두었으나,
   2026-09-15 사용자 화면 검수로 «뺐다»(sites/sise/shell/body-prefix.html 의 hdr-switch
   안 `<span class="dot">·</span>` 마크업 제거). 🔴🔴 2026-09-15 CSS 규칙도 지휘자 승인으로
   제거 — 마크업 제거로 그릴 대상 0(전수 확인 = 활성 CSS 전체에서 `.dot` 선택자는 이 한 곳뿐이었다.
   core-locale--footer 의 가운뎃점은 `.dot` 클래스가 아니라 `::before` 의사요소로 만드는 별개
   메커니즘이라 애초에 이 규칙과 무관 — 무변경. 상세는 시공 보고서 참조). */
.chrome .hdr-switch{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:15px;color:var(--mist)}
.chrome .hdr-switch a{text-decoration:none;color:inherit}
.chrome .hdr-switch a:hover,.chrome .hdr-switch a:focus-visible{color:var(--fill-brand, #1e73be)}
/* 알약(항목마다) — .chrome .search-pill 문자 단위 인용(배경·테두리·반경·패딩) · 🔴 네 알약
   (아이템·언어·커스텀 링크·검색 — 지휘자 정정: 커스텀 링크도 ⓓ 에서 토글이 켜져 화면에
   보이므로 알약 대상이다)이 같은 높이로 나란히 서도록 패딩 값까지 그대로 맞췄다. */
.chrome .hdr-switch .nav-item[data-hdr="item"]{display:var(--item-select-display, flex);align-items:center;background:var(--fill-surface-weak, #f0f0f0);border:1px solid var(--line-dark);border-radius:999px;padding:7px 16px}
.chrome .hdr-switch .nav-item[data-hdr="lang"]{display:var(--lang-select-display, flex);align-items:center;background:var(--fill-surface-weak, #f0f0f0);border:1px solid var(--line-dark);border-radius:999px;padding:7px 16px}
.chrome .hdr-switch a[data-hdr="custom"]{display:var(--custom-link-display, none);align-items:center;background:var(--fill-surface-weak, #f0f0f0);border:1px solid var(--line-dark);border-radius:999px;padding:7px 16px}
.chrome .hdr-switch .nav-sub{left:auto;right:-10px}
/* 🔴 2026-09-05 지휘자 직접 — 드롭다운 항목 여백을 «원본에서 바꿨다». 기록해 둔다.
   원본(모두의카드)  .nav-sub a{ padding:9px 18px }  ·  .nav-sub-inner{ padding:8px 0 }
   우리              padding:10px 32px 10px 26px             ·  padding:10px 0
   사유 = 2026-09-05 «사용자 눈 검수 지시»(「여백을 조금 더 줘야겠어. 너무 좁아 보이는데?」).
   width:max-content 로 폭이 내용에 붙자 여백이 상대적으로 좁아 보인 것이라 «예상된 후속»이다.
   🔴 다음에 원본과 대조하는 조가 「어긋났다」로 오판할 자리다 — 원본 보존 규칙의 «예외»이고,
      예외인 이유는 «사용자가 화면을 보고 지시»했기 때문이다(사용자 지시 > 원본 보존).
   ⚠️ 현재 항목(a.nav-current)의 padding-left 도 «같이» 22px 로 올렸다 — 일반 항목과 글자
      시작 위치가 «같아야» 하기 때문이다. 한쪽만 바꾸면 선택했을 때 글자가 밀린다. */
/* 🔴 2026-09-05 — 오른쪽 여백만 «일부러 크게»(26 → 32). 값의 대칭이 아니라 «보이는 대칭»을 맞춘 것이다.
   사용자 지시 = 「오른쪽 여백을 조금 더 줘야 왼쪽 여백과 맞을 것 같아」(값은 이미 좌우 26 으로 같았다).
   왜 그렇게 보이는가 — «부분만» 갈랐다:
     ✅ 확인됨   현재 항목은 라벨 뒤에 « ✓» 가 붙는다(core/runtime/assemble/index.mjs — applyCurrentMenuItem).
                상자 폭은 width:max-content 라 «가장 긴 줄»이 정하므로, 그 줄의 오른쪽 끝은 여백에
                «딱 붙는다» — 왼쪽은 글자가 시작하는 자리라 여백이 그대로 보이고, 오른쪽은 글자가
                여백을 채우고 끝나 «좁아 보인다».
     🔴 미확인   그 줄이 «항상» 가장 긴 줄인지는 목록마다 다르다(예: 「부동산 통합시세」가 더 길다).
                글자 자체의 우측 여백·테두리 곡률 영향도 «픽셀을 재야» 갈린다 — 못 쟀다.
   → 그래서 +6 은 «눈 판단»이다. 근거가 절반만 있는 값이라고 여기 적어 둔다.
   🔴 왼쪽 26 은 «불변» — a.nav-current 의 padding-left 26 · ::before left 11((26-4)/2) 이 그대로 유효하다.
   🔴 세 배치(헤더 위젯 · 메뉴 2단 · 푸터 위젯)는 «같은 한 벌»을 쓴다 — 서로 달라지면 안 된다. */
.chrome .hdr-switch .nav-sub a{display:block;padding:10px 32px 10px 26px;font-size:15px;color:#1f2937;border-bottom:0}
.chrome .hdr-switch .nav-sub a:hover,.chrome .hdr-switch .nav-sub a:focus-visible{color:var(--fill-brand, #1e73be);background:#f7f8f9}
/* .nav-current(선택 표시) 시각 규칙은 아래 "위젯·메뉴 2단 공통" 블록 하나에 있다(§S18 —
   규칙을 두 벌 만들지 않는다) · nowrap 도 같은 공통 블록이 담당(원래 이 줄에는 없었다). */
/* 검색 뒤 오른쪽 밀기는 원래 search-pill 이 맡던 자리 — hdr-switch 가 헤더에서 검색보다
   앞서므로 margin-left:auto 는 hdr-switch 쪽으로 옮긴다(search-pill 은 그대로 뒤에 붙는다·
   중복 auto-margin 이 서로 상쇄되지 않도록 search-pill 의 margin-left:auto 는 손대지 않았다
   — 두 규칙이 공존해도 hdr-switch 가 먼저 소스오더상 앞이라 실제 밀기는 이 규칙이 담당). */

/* 푸터 로케일 위젯(2026-09-05 잔여묶음 조 §3-f — tcggrail body-suffix.html:47-67 CSS 문법
   «그대로»[헤더 .nav-item/.nav-sub/.nav-caret 과 완전히 같은 문법을 이 스코프 아래 재사용 ·
   신규 창작 0] · 값만 tcggrail 볼트블랙 리터럴 대신 sise 기존 토큰으로 교체 — 위로 열리는
   방향[bottom 앵커]과 아이콘 포함은 헤더와 «의도적으로 다르다»[통일 금지, 위 §3-f 주석]). */
.core-locale--footer{position:relative;display:var(--footer-locale-display, inline-flex);align-items:center;gap:10px;margin-left:16px}
.core-locale--footer .nav-item{position:relative}
/* 2026-09-05 조A — §반쪽 방지(지시서 §2): 컨테이너 토글(위 한 줄)만 있으면 두 항목(아이템
   선택 📊·언어 선택 🌐)을 따로 끌 수 없다 — 헤더(.chrome .hdr-switch)는 이미
   .nav-item[data-hdr="item"/"lang"] 로 개별 토글이 있는데 이 푸터 위젯만 없었다(같은
   문제 재확인). 새 토큰을 만들지 않고 헤더가 쓰던 --item-select-display/--lang-select-display
   를 그대로 재사용했다(위치가 아니라 "아이템 선택" 기능 단위 스위치 — 헤더·푸터 두 자리를
   한 값으로 겸용. 값을 바꾸면 두 자리가 함께 켜지고 꺼진다). 폴백 flex = 두 항목 다 기존
   기본 노출 그대로(회귀 0 — nav-item 자체 display 미선언이던 것을 flex 로 명시해도 두
   자식[.core-locale__trigger 는 inline-flex, .nav-sub 는 position:absolute]의 배치는
   바뀌지 않는다). 마크업 쪽 data-hdr 속성은 body-suffix.html 에서 추가. */
.core-locale--footer .nav-item[data-hdr="item"]{display:var(--item-select-display, flex)}
.core-locale--footer .nav-item[data-hdr="lang"]{display:var(--lang-select-display, flex)}
.core-locale__trigger{display:inline-flex;align-items:center;gap:7px;font-size:13px;color:var(--text-footer, #cbd5e1);font-weight:600;border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:4px 14px;text-decoration:none;cursor:pointer}
.core-locale__trigger:hover,.core-locale__trigger:focus-visible{border-color:var(--fill-brand, #1e73be)}
.core-locale--footer .nav-caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor;opacity:.55;transform:rotate(180deg)}
.core-locale--footer .nav-sub{position:absolute;bottom:100%;left:0;padding-bottom:12px;display:none;z-index:9;min-width:170px}
.core-locale--footer .nav-item:hover .nav-sub,.core-locale--footer .nav-item:focus-within .nav-sub{display:block}
.core-locale--footer .nav-sub-inner{background:#ffffff;border:2px solid var(--fill-brand, #1e73be);border-radius:12px;padding:10px 0;box-shadow:0 -18px 30px -12px rgba(0,0,0,.25)}
.core-locale--footer .nav-sub a{display:block;padding:10px 32px 10px 26px;font-size:14px;color:#1f2937;text-decoration:none}
.core-locale--footer .nav-sub a:hover,.core-locale--footer .nav-sub a:focus-visible{color:var(--fill-brand, #1e73be);background:#f7f8f9}
/* nowrap(원래 이 줄에 있었다)·.nav-current 시각 규칙 = 아래 "위젯·메뉴 2단 공통" 블록(§S18). */

/* ══ 셸 세트화 «영역 1: 푸터»(2026-09-04 시공 조 · «통째로 재이식» 재작업 2026-09-04) ══════════
   🔴 재이식 사유 — 직전 라운드는 출처를 page-bundle.css 단독(L12513-12725)으로 한정했다. 그
   파일은 모두의카드의 «볼트블랙» 팔레트(구 스타일시트 사본 — 흑배경 #09090b·금색 컬럼타이틀
   #d4af37)이고, 실제 렌더 승자는 그 뒤에 오는 «페이지 인라인 <style id="footer-native-css">»
   둘째 블록(원문 주석 "구조·여백은 세트 그대로 두고 색만 «라이브 실측값»으로 되돌린다")이다 —
   같은 선택자를 다시 선언해 소스오더로 이긴다(마지막 선언 승리). 그 결과 모두의카드가 실제로
   보여주는 값은 «네이비»(#1e293b 밴드/컬럼/하단줄 · #0f172a 3단바 · 흰색 컬럼타이틀 · #cbd5e1
   링크 · #94a3b8 카피/태그라인 · #64748b 구분자/법정고지)다. 직전 라운드는 번들만 보고 이 값을
   놓쳤다(「번들만 보고 인라인을 안 봄」 오판) — 이번에 «둘 다» 대조해 실제 렌더 값으로 바로잡았다.
   함께 발견된 세부 누락: ①`.brand a{display:inline-flex;align-items:center;gap:9px}` 규칙 자체가
   없어 로고+사이트명이 기본 인라인 흐름에 맡겨져 있었음(한 줄 자체는 우연히 유지됐으나 아이콘
   수직 중앙 정렬 안 됨) ②`.link:hover`·`.copy a:hover`·`.bottomrow .link:hover` 원문은 네
   선택자가 한 그룹으로 `text-underline-offset:3px` 를 공유하는데 셋으로 쪼개며 이 선언을
   전부 빠뜨렸음(`.copy a:hover` 는 밑줄 자체도 없었음) ③`.copy a` 가 실제로는 `.copy` 와 같은
   색(94a3b8)인데 다른 토큰(`--text-footer`)으로 배선돼 있었음 ④`.bottomrow` 배경이 실제로는
   `.band`·`.cols` 와 같은 층(--fill-footer)인데 3단바 전용 토큰(--fill-footer-strong)으로
   배선돼 있었음.

   출처 = _sandbox/창B1-시세-금융5분야-20260902/_강화/_라이브정본/page-bundle.css(구조·크기·
   정렬) + mc-home.html·mc-sidebar.html L3027-3131(둘째 인라인 블록 — 실제 렌더 값). 값 재작성
   0(문자 단위 이식) · 새 셀렉터·새 마크업 0개.

   사이트가 다를 만한 것만 var() 로 뽑았다(기존 12개 설정 이름 그대로 유지 — 이번 회차는 값·배선만
   교정, 설정 개수는 늘리지 않았다. height/min-height 류 선언은 이 영역에 원본부터 0건 —
   설정 후보 해당 없음):
     배경색   --fill-footer(밴드·컬럼·하단줄) · --fill-footer-strong(3단바)
     글자 색  --text-footer(링크) · --text-footer-mute(태그라인·카피) · --text-footer-faint(법정고지)
     글자 크기 --size-footer-bottomrow · --size-footer-legal · --size-footer-copy
              · --size-footer-link · --size-footer-col-title
     정렬     --align-footer-base(기본 left) · --align-footer-bottomrow(하단줄 — 모두의카드 =
              center)
   토큰화하지 않고 리터럴로 남긴 것(모두의카드 리터럴 그대로 — 실제로 다른 사이트가 다르게 할
   근거가 아직 없어 설정 후보 아님): 컬럼 타이틀·브랜드 이니셜(b) 흰색 #ffffff · 뱃지 색 #e2e8f0
   /배경 rgba(255,255,255,.04)/테두리 rgba(255,255,255,.18) · 하단줄 구분자 색 · 법정고지 강조
   (strong) 색 #94a3b8 · 링크 호버색 #ffffff · 브랜드 아이콘 배경 none(실물 로고 이미지라 배지
   배경 불필요 — 헤더와 동일 사유).

   🔴 이식 완료(판정 2026-09-05 뒤집힘 — 크롬세트화 조 §3에서 필요 확정 · 2026-09-05 잔여묶음
   조가 시공 · 2026-09-05 청약편입배선 조가 실재 재확인) — `.core-locale--footer`
   언어/아이템 스위처 일습(트리거·드롭업·서브메뉴)은 이 회차(2026-09-04)까지 "빠뜨려도 되는
   항목"으로 적었으나, 사용자 화면으로 tcggrail 라이브 푸터에 이 위젯이 «실재»함이 확정됐다
   (🃏 Pokémon · 🌐 English 두 항목, 실링크 1개 + 죽은 링크 1개). 그러니 이 주석의 처분은
   빼는 쪽이 아니라 «① 옮긴다»이다 — (참고로 모두의카드 원문은 이 위젯 자체를
   HTML 주석으로 비활성화해 뒀다 — 다국어 미사용 서비스라는 그 사이트만의 사정이지, 위젯
   자체의 정당성과는 무관하다.)
   🔴 실물 이식(마크업+CSS) = «이식 완료»(2026-09-05 잔여묶음 조 · 위치 병기 — 2026-09-05
   청약편입배선 조 grep 원문 재확인):
     CSS   이 파일(shell-set-base.css) 위 「푸터 로케일 위젯」 규칙 일습(.core-locale--footer 등)
     마크업  sites/sise/shell/body-suffix.html:92-96 (core-locale--footer 컨테이너 실재)
           sites/sise/shell/body-prefix.html:55 (헤더 쪽 대응물 hdr-switch 실재)

   🔴 아이콘 유무는 «의도»다 — 헤더는 붙박이라 항상 보여 간결하게(아이콘 0),
   푸터는 스크롤해야 보여 아이콘으로 눈에 띄게 한다. 헤더용과 푸터용을 통일시키지 마라 —
   그 차이는 결함이 아니라 설계 의도다. (같은 문장을 위 「헤더 오른쪽 위젯」 주석에도
   2026-09-05 청약편입배선 조가 병기했다 — 한쪽만 적으면 다른 쪽을 보는 사람이 모른다.)

   로드 순서 = 이 파일(밑판)이 세트별 shell-set.css 보다 먼저 실린다(loadShellSetCss 기존 순서 —
   코드 변경 0). !important 신규 0(모두의카드 원문엔 있으나 그건 두 소스 간 캐스케이드 승부용 —
   이 정적 번들엔 그 충돌이 없어 값만 이식하고 !important 는 붙이지 않았다). */
.site-footer:has(.site-footer-credit--v2){background-color:var(--fill-footer, #1e293b)}
.site-footer:has(.site-footer-credit--v2) .inside-site-info{padding:0;max-width:100%;display:block}
/* 🔴 2026-09-05 — 푸터가 «자기 위 바깥 여백»을 준다(margin-top).
   사유: 흰 상자와 푸터가 «맞붙어» 있었다(사용자 지적). 상단에서 세운 원칙과 «대칭»이다 —
   메뉴 아래 간격을 «헤더가 주듯이», 푸터 위 간격은 «푸터가 준다». 그러면 사이드바 유무·
   페이지 종류와 무관하게 «항상» 성립한다(앞서 site-content 에 걸려 있던 값은 사이드바 있는
   페이지에만 붙어 있었다).
   ⚠️ 🔴 푸터의 padding(28px)은 «간격이 아니다» — 그건 배경색 «안쪽»이라 눈에 보이는 틈이
      되지 않는다. 2026-09-05 에 그것을 간격으로 세어 상자 아래 여백을 걷었다가 붙었다.
      여백을 계산할 때 padding(배경 안)과 margin(배경 밖)을 «같은 자»로 세지 마라.
   값 = 상단 간격(--gap-below-menubar 20px)과 «같은 값»으로 대칭을 맞춘다. */
.site-footer-credit--v2{text-align:var(--align-footer-base, left);padding:0;margin:var(--gap-above-footer, 20px) 0 0;color:var(--text-footer, #cbd5e1);font-size:15px;line-height:1.6}
.site-footer-credit--v2 .site-footer-credit__band{background-color:var(--fill-footer, #1e293b);padding:28px max(26px,calc((100% - var(--site-w, 1300px))/2)) 22px;border-radius:0;border-top-color:rgba(255,255,255,.08)}
.site-footer-credit--v2 .site-footer-credit__brand{margin:0 0 6px;font-size:18px;line-height:1.35}
.site-footer-credit--v2 .site-footer-credit__brand a,.site-footer-credit--v2 .site-footer-credit__brand strong{color:#ffffff;text-decoration:none;font-weight:800}
.site-footer-credit--v2 .site-footer-credit__brand a{display:inline-flex;align-items:center;gap:9px}
.site-footer-credit--v2 .site-footer-credit__brand strong{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans KR","Malgun Gothic",sans-serif;letter-spacing:-0.01em;text-transform:none}
.site-footer-credit--v2 .site-footer-credit__brand b{color:#ffffff;font-weight:inherit}
.site-footer-credit--v2 .site-footer-credit__brand .brand-icon{width:22px;height:22px;font-size:22px;border-radius:22%;display:flex;align-items:center;justify-content:center;flex:0 0 auto;overflow:hidden;background:none}
.site-footer-credit--v2 .site-footer-credit__brand .brand-icon img{width:100%;height:100%;object-fit:contain;display:block}
.site-footer-credit--v2 .site-footer-credit__brand .brand-icon .tg{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans KR","Malgun Gothic",sans-serif;font-weight:900;line-height:1;color:#fff;font-size:.5em;letter-spacing:-0.04em}
.site-footer-credit--v2 .site-footer-credit__tagline{margin:0 0 14px;font-size:14px;color:var(--text-footer-mute, #94a3b8)}
.site-footer-credit--v2 .site-footer-credit__badges{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.site-footer-credit--v2 .site-footer-credit__badge{display:inline-block;padding:5px 12px;font-size:13px;/* CO-05 2026-10-09 · 글자 최소 13px (사용자 10-09 최소 글자 크기 규칙 · 이전 12.5px) */line-height:1.4;color:#e2e8f0;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.18);border-color:rgba(255,255,255,.18);border-radius:999px;white-space:nowrap}
.site-footer-credit--v2 .site-footer-credit__cols{background-color:var(--fill-footer, #1e293b);padding:24px max(26px,calc((100% - var(--site-w, 1300px))/2)) 28px;border-top:1px solid rgba(255,255,255,.08);border-top-color:rgba(255,255,255,.08);display:grid;grid-template-columns:repeat(4,1fr);gap:26px 30px}
.site-footer-credit--v2 .site-footer-credit__col{min-width:0}
/* 2026-09-05 조A — 컬럼 제목 색 토큰화(목적 = 제목과 목록 사이 구분 하나를 준다). 값은
   «세트»에 둔다(사이트 파일 선언 0 — 이 배경 프리셋[--fill-footer #1e293b]이 있는 이 묶음
   전용 값이라 사이트가 고를 이유가 없다. 사용자 확정: "사이트마다 설정할 필요 없다").
   금색이라서가 아니라 «이 배경(#1e293b)에서 대비 6.96:1 로 AA 를 통과해서» 고른 값이다
   (지휘자 계산 — 흰색 14.63:1 도 통과하지만 사용자가 제목/목록 구분을 요청해 다른 색을
   준다. tcggrail --gold #866A23 은 이 배경에서 2.86:1 로 AA 미달이라 채택하지 않았다).
   배경이 바뀌면 다시 계산한다 — 다른 배경(예: 블랙) 프리셋이 생기면 그때 그 프리셋에
   맞는 값을 그 프리셋 파일에 둔다(지금 신설하지 않는다). 크기·굵기·간격은 무변경. */
/* 🔴 2026-09-05 라벨 조 §S19 — "타이틀이 리스트보다 작다"(사용자 지적). 실측(occur.mjs ·
   이 파일·assembled :root 둘 다) — --size-footer-col-title 는 :root 선언이 «없어»(신규
   토큰 0) 폴백 리터럴이 곧 실제 값이었다: 제목 13px < 데스크톱 목록 14px(--size-footer-link
   폴백). 크기만 14px 로 올린다(굵기·색·간격 무변화 · 목록 쪽 무변경 · 이 토큰의 소비처는
   occur.mjs 로 «1곳뿐»임을 확인했다 — 함께 커지는 둘째 자리는 실재하지 않는다). */
.site-footer-credit--v2 .site-footer-credit__col-title{margin:0 0 12px;font-size:var(--size-footer-col-title, 14px);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-footer-col-title, #d4af37)}
.site-footer-credit--v2 .site-footer-credit__col-list{list-style:none;margin:0;padding:0}
.site-footer-credit--v2 .site-footer-credit__col-list li{margin:0 0 9px}
.site-footer-credit--v2 .site-footer-credit__link{color:var(--text-footer, #cbd5e1);text-decoration:none;font-size:var(--size-footer-link, 14px);transition:color .18s ease}
.site-footer-credit--v2 .site-footer-credit__link:hover,.site-footer-credit--v2 .site-footer-credit__link:focus,.site-footer-credit--v2 .site-footer-credit__copy a:hover,.site-footer-credit--v2 .site-footer-credit__bottomrow .site-footer-credit__link:hover{color:#ffffff;text-decoration:underline;text-underline-offset:3px}
.site-footer-credit--v2 .site-footer-credit__link--gold{color:#eecf5e;font-weight:700}
.site-footer-credit--v2 .site-footer-credit__link--gold:hover,.site-footer-credit--v2 .site-footer-credit__link--gold:focus{color:#eecf5e;text-decoration:underline}
.site-footer-credit--v2 .site-footer-credit__bottomrow{background-color:var(--fill-footer, #1e293b);padding:12px max(26px,calc((100% - var(--site-w, 1300px))/2));border-top:1px solid rgba(255,255,255,.08);border-top-color:rgba(255,255,255,.08);font-size:var(--size-footer-bottomrow, 13px);line-height:2;text-align:var(--align-footer-bottomrow, center)}
.site-footer-credit--v2 .site-footer-credit__bottomrow .site-footer-credit__link{color:var(--text-footer, #cbd5e1);text-decoration:none}
.site-footer-credit--v2 .site-footer-credit__bottomrow .site-footer-credit__sep{color:#475569;margin:0 6px}
.site-footer-credit--v2 .site-footer-credit__bottomrow button.site-footer-credit__link{background:none;border:0;padding:0;font:inherit;cursor:pointer}
.site-footer-credit--v2 .site-footer-credit__bar{background-color:var(--fill-footer-strong, #0f172a);padding:18px max(26px,calc((100% - var(--site-w, 1300px))/2)) 20px;border-radius:0;border-top:1px solid rgba(255,255,255,.06);border-top-color:rgba(255,255,255,.06)}
.site-footer-credit--v2 .site-footer-credit__barrow{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:flex-start;gap:4px 10px;margin:0 0 8px}
.site-footer-credit--v2 .site-footer-credit__barrow .site-footer-credit__copy{margin:0}
.site-footer-credit--v2 .site-footer-credit__copy{margin:0 0 8px;font-size:var(--size-footer-copy, 13.5px);color:var(--text-footer-mute, #94a3b8);text-decoration:none}
.site-footer-credit--v2 .site-footer-credit__copy a{color:var(--text-footer-mute, #94a3b8);text-decoration:none}
/* CO-05 2026-10-09 · 글자 최소 13px(사용자 10-09 «글자 최소 문장형 14 / 이름표 13») */
.site-footer-credit--v2 .site-footer-credit__legal{margin:0;font-size:var(--size-footer-legal, 13px);line-height:1.7;color:var(--text-footer-faint, #64748b)}
.site-footer-credit--v2 .site-footer-credit__legal strong{color:#94a3b8;font-weight:600}
@media(max-width:920px){.site-footer-credit--v2 .site-footer-credit__cols{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.site-footer-credit--v2 .site-footer-credit__cols{grid-template-columns:repeat(2,1fr);gap:22px 26px}}
@media(max-width:560px){
  .site-footer-credit--v2 .site-footer-credit__band,.site-footer-credit--v2 .site-footer-credit__cols,.site-footer-credit--v2 .site-footer-credit__bar{padding-left:16px;padding-right:16px}
  .site-footer-credit--v2 .site-footer-credit__band{padding-top:20px;padding-bottom:14px}
  .site-footer-credit--v2 .site-footer-credit__cols{grid-template-columns:repeat(2,1fr);gap:16px 18px;padding-top:16px;padding-bottom:18px}
  .site-footer-credit--v2 .site-footer-credit__cols a,.site-footer-credit--v2 .site-footer-credit__link{font-size:13.5px;line-height:1.5}
  /* CO-05 2026-10-09 · 글자 최소 13px(사용자 10-09 «글자 최소 문장형 14 / 이름표 13») */
  .site-footer-credit--v2 .site-footer-credit__legal{font-size:13px;line-height:1.55}
}

/* ══ 셸 세트화 «영역 2: 헤더·메뉴»(2026-09-05 크롬세트화 조 — 지휘자 지시서-크롬세트화-20260905 §1) ══
   🔴 사유 — 푸터(위 «영역 1»)는 이미 세트 층으로 올라와 있는데 헤더·메뉴(크롬) 골격은
   `sites/sise/shell/shell.css` 에 그대로 남아 있었다. 「신규 사이트 = 세트 선택 1회 · 그 뒤
   바꾸는 것은 사이트 고유값뿐」계약상 크롬이 사이트 층에 있으면 다음 사이트가 이 골격을 손으로
   다시 베낀다 — 그것이 이 이관의 존재 이유다.

   방식 = «영역 1(푸터)»과 완전히 같다(발명 0) — `sites/sise/shell/shell.css` 의 `.chrome` 계열
   규칙(헤더 컨테이너·브랜드·1단 메뉴·검색창·햄버거·모바일 패널·2단 드롭다운(데스크톱)·2단
   아코디언(모바일)·920px 중단점) 전체를 «문자 단위로»(값 재작성 0 · 선언 순서 보존) 그대로
   옮겼다. 원문에 이미 있던 인라인 주석(재이식 근거·오타 정정 이력 등)도 함께 옮겨 그 설명이
   가리키는 규칙과 붙어 있게 했다 — 주석 속 "이 파일"이라는 표현은 이 파일(shell-set-base.css)을
   가리키는 것으로 그대로 유효하다(P2 잔존-0 판정식도 이 파일을 포함해 전 CSS 를 훑기 때문).

   🔴 §2(강조색 토큰화, 같은 커밋에서 이어 시공) — 아래 리터럴 강조색 4가지(#1a73e8·#1557b0·
   #1e73be·#17588f)를 재census(15건 실측 — 선행 보고서 「15건/18건」 불일치를 이 조가 다시
   세어 15건으로 확정. 18건 쪽은 `.chrome-menubar{background:var(--fill-nav, #1a73e8)}` 의
   var() 폴백 리터럴까지 «이미 토큰화된 것」을 중복 셌던 것)한 뒤 var(--토큰, 기존값) 로
   감쌌다(폴백 = 기존 리터럴 그대로 · 회귀 0). 4색 중 3색(#1a73e8·#1557b0·#1e73be)은 «새
   토큰을 만들지 않았다» — 이 셸이 이미 갖고 있던 sites/sise/tokens.jsonc raw 값
   nav-bg(#1a73e8)·acc-i(#1557B0)·acc(#1E73BE)와 문자 그대로 같은 값이라 그 기존 semantic
   (fill-nav·fill-brand-strong·fill-brand)을 재사용했다(--fill-brand 는 바로 아래
   core/presets/shell/with-sidebar/shell-set.css 의 module-sidebar-links 도 이미 같은 값으로
   쓰고 있어 "사이트 전역 강조 블루" 축임이 재확인된다 — 새 계열 발명 0). 남은 1색(#17588f)만
   기존 raw 어디에도 없어 신규 토큰 text-nav-current(raw: nav-current-ink)를 추가했다.

   출처 = `sites/sise/shell/shell.css`(구 위치, 2026-09-03 F-22 조 신설 · 2026-09-04
   헤더검색재이식/토큰배관/완성형세트확정 조 · 2026-09-05 메뉴바재이식 조가 순차로 값을
   재정합해 온 그 파일 그대로) — 그 파일에는 이제 `.chrome` 규칙이 0 남는다(스킵링크 접근성
   규칙 2개와 문서 주석만 잔존). 로드 순서 = 이 파일(세트 CSS)이 사이트 shell.css 보다 먼저
   실린다(assemble-bundle.mjs:308, 코드 변경 0) — 선택자가 서로 겹치지 않아(사이트 파일에는
   이제 `.chrome` 선택자가 없다) 순서가 바뀌어도 캐스케이드 승자는 달라지지 않는다. */
/* 🔴 2026-09-14 셸3건 조 — 헤더·메뉴 고정 «해제»(사용자 확정: 「라이브에서는 헤드, 메뉴가
   고정되지 않고 스크롤 하단으로 내리면 헤드, 메뉴도 위로 올라가서 안 보이게 돼 있어. 고정시키지
   말고 동적으로 라이브처럼 해야 해」).
   진단 = ㉯(애초에 그런 설계가 없었다) — «스마트 고정»(스크롤 방향에 따라 CSS transform 으로
   숨김·복귀)은 tcggrail 자체 시안(_시안/디자인루프/tcggrail-볼트랜딩-시안-20260821.html)에서
   나온 tcggrail «고유» 설계이고, 그 시안의 주석 자체가 "숨김 자체는 CSS 에서 920px 이하로만
   산다"(즉 데스크톱에서는 애초에 무동작)라고 밝힌다 — 시세.com 실제 라이브의 설계가 아니다.
   🔴 실측(2026-09-14 · GET 4회 예산 안 · 시세.com 자체 라이브) — https://www.xn--vj4b13a.com/
   (홈)과 그 캐스케이드(generatepress_child/style.css·assets/css/{modules,components}.css)
   전체를 훑어 #masthead·.site-header 를 겨냥한 position:fixed/sticky 규칙이 «0건»임을 확인했다
   (fixed 는 유일하게 .generate-back-to-top 단추뿐). <html>·<body> 클래스에도 GP 의 sticky-nav
   계열 마커가 없다 — 헤더는 그냥 «문서 흐름 안의 보통 요소»라 스크롤하면 «본문과 함께» 위로
   밀려 올라가 사라진다(별도 JS 로 「숨긴다」가 아니라 «원래 고정 자체가 없다»).
   🔴 처방 = position:sticky·top·z-index·transition(transform) 를 뺀다 — 값 대체가 아니라
   «그 성질 자체를 없애는» 것이 라이브와 같아지는 길이다. chrome--hide 계열 두 규칙도 함께
   뺀다(전제인 sticky 가 없으면 transform:translateY(-100%) 는 «보통 흐름 요소를 화면 밖으로
   밀어 빈 구멍을 남기는» 새로운 결함이 된다 — 남겨두면 지금보다 더 나빠진다).
   ⚠️ 범위 밖 발견 — sites/sise/shell/body-prefix.html(site 파일·이번 회차 수정 대상 아님)의
   <script id="chrome-native-js"> 가 여전히 scroll 이벤트에서 chrome.classList.add/remove
   ('chrome--hide') 를 돌린다. 이 CSS 변경 뒤에는 그 class 토글이 «어떤 화면 규칙과도 안 걸리는»
   무해한 죽은 배선이 된다(회귀는 아니다 — 그냥 아무 효과가 없어진다). 정리는 site 파일 소관이라
   이번 회차 범위 밖으로 남긴다.
   💸 영향 사이트 = «sise 하나뿐» — assemble-bundle.mjs loadShellSetCss() 가 sites/{site}/shell/
   shell-set.jsonc 존재 여부로 이 파일을 실을지 정하는데, 그 파일은 저장소 전체에 sites/sise/
   shell/shell-set.jsonc «한 개»뿐이다(tcggrail·모두의카드·kimchi*·ramen* 는 이 프리셋을 아예
   안 쓴다 — 자기 body-prefix.html 안에 인라인 CSS 를 그대로 갖고 있다). */
/* ══ 크롬: 헤더(구조=tcggrail #chrome-native-css 그대로 · 값=시세 실측) ══
   🎨 팔레트 층 재편(2026-09-04 헤더검색재이식 조) — 구 "볼트(vault) 0~3" 계열 이름과 구
   "골드-하이(gold-hi)" 이름을 이 블록에서 걷어냈다(그 문자열 자체를 아래에도 남기지 않는다 —
   P2 잔존-0 판정식이 이 파일 전체를 문자열째 훑기 때문). 그 이름은 tcggrail·모두의카드 두 사이트가
   «같은 이름을 서로 다른 값»(검정 계열 배경 ↔ 흰색 계열 배경)으로 쓰고 있어, 번들을 나란히 읽을 때
   "값은 시세 것인데 다른 사이트 색으로 읽히는" 오해를 실제로 냈다(오늘 재발 — 결과보고서 참고).
   대체 원칙 = «새 이름을 더 만들지 않는다» — 이 셸이 이미 갖고 있던 raw→semantic 팔레트 층
   (sites/sise/tokens.jsonc)의 기존 이름(--fill-header·--fill-page·--fill-surface-weak — 전부
   core/presets/shell/with-sidebar/shell-set.css(2026-09-05 개명 조 — 옛 이름 sidebar 는 폐기)
   가 이미 실사용 중인 같은 계열)에 «직접» 연결했다(팔레트
   이름을 보면 무엇을 칠하는지 바로 안다 · 세 이름 모두 --fill-* 축 · 사이트 이름 0). 걷어낸 두
   이름 중 하나(0~3 중 셋째 단계)와 gold-hi 쪽은 어디서도 var() 로 읽히지 않는 죽은 선언이었다
   (전수 grep 확인) — "지금 실제 쓰이는 색만" 원칙에 따라 팔레트에 올리지 않고 그대로 삭제했다. */
/* 🔴 2026-09-05 사용자 확정 — 상단 간격은 «주는 쪽»(메뉴 하단)이 가진다.
   왜   «받는 쪽»이 여백을 가지면 아래에 무엇이 오든 «받는 쪽마다» 챙겨야 하고, 하나 빠지면 어긋난다.
        주는 쪽이 가지면 «무엇이 오든» 자동으로 그만큼 떨어진다 → 배치(사이드바 유무)가 달라도 같다.
   🔴 자리를 .chrome-menubar 가 아니라 «.chrome»(헤더 블록 전체)에 둔 이유 =
      .chrome 은 border-bottom 이 있어 마진 상쇄가 막힌다 → menubar 에 주면 그 여백이 «.chrome 안»에
      남아 «헤더 배경(흰색)»으로 칠해진다. .chrome 바깥에 주면 «페이지 배경(회색)»이 보인다 —
      「회색 바탕 위 흰 상자」라는 이 디자인의 전제와 맞는 쪽은 후자다.
   🔴 받는 쪽(.site-content)의 padding-top 은 «없앴다» — 두 곳에 있으면 두 배가 된다.
   ⚠️ 사이드바 sticky top 은 «별개»다(스크롤 중 멈추는 위치이지 시작 위치가 아니다). 여기서 처리하지 않는다. */
.chrome{--line-dark:#e5e7eb;--mist:#575760;--gold:#fbbf24;--serif:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans KR",sans-serif;--sans:var(--serif);--mono:var(--serif);background:var(--fill-header, #ffffff)/* 헤더 배경 · 기본값 출처=header-bg raw 실측 #ffffff(위 파일 머리 주석) */;color:#222222;font-family:var(--sans);line-height:1.6;border-bottom:1px solid var(--line-dark);margin-bottom:var(--gap-below-menubar, 30px)}
.chrome *{box-sizing:border-box;margin:0}
.chrome a{color:inherit}
.chrome details,.chrome summary{background:none;border:0;border-radius:0;margin:0;padding:0}
/* 🔴 2026-09-14 — 헤더 안쪽 위아래 패딩을 «한 단계 더» 키운다(사용자 재확정: 「헤드 높이를
   조금 더 키워 · 메뉴는 그대로 유지」). 09-14에 헤더 고정(sticky)을 풀어 스크롤하면 위로
   사라지므로 더 키워도 늘 화면을 누르지 않는다. 좌우 24px 은 그대로 · .menubar-inner 는
   이 회차에서 미수정(사용자 지시 — 메뉴는 그대로). 16px 14px → 22px 20px. 값 창작 아님 —
   지휘자 지정값. */
.chrome .chrome-inner{max-width:1300px;margin:0 auto;padding:22px 24px 20px;display:flex;align-items:center;gap:14px}
.chrome .brand-wrap{display:flex;align-items:center;gap:12px;text-decoration:none}
.chrome .brand-icon{width:36px;height:36px;border-radius:22%;display:flex;align-items:center;justify-content:center;flex:0 0 auto;overflow:hidden}
.chrome .brand-icon img{width:100%;height:100%;object-fit:contain;display:block}
/* 🔴 2026-09-14 — 사이트명 크기를 라이브 실측값으로 맞춘다(사용자 확정: 「시세.com 사이트명 사이즈도
   라이브 기준으로 키워」). 인라인 <style id="generate-style-inline-css">에는 .main-title 색상
   규칙만 있고 크기는 없어(그 값은 «main-title a,.main-title a:hover{color:var(--contrast)}»뿐),
   테마 코어 CSS(GET https://www.xn--vj4b13a.com/wp-content/themes/generatepress/assets/css/
   main.min.css?ver=3.6.1)에서 실측 — 원문:
   .main-title{margin:0;font-size:25px;line-height:1.2em;word-wrap:break-word;font-weight:700;
   text-transform:none}
   22px/800 → 25px/700(line-height:1.2em 추가 · letter-spacing 은 라이브에 없어 제거). 값 창작 0. */
.chrome .brand{font-family:var(--sans);font-size:25px;line-height:1.2em;font-weight:700;white-space:nowrap;color:#222222}
.chrome .brand b{color:var(--fill-nav, #1a73e8);font-weight:inherit}
.chrome .nav{display:flex;gap:22px/* 2026-09-04 지휘자 정정지시 — 통째 이식 재확인: 원본(모두의카드) gap 값을 그대로 이식(구 4px 는 손으로 넣은 값·근거 없음) */;row-gap:4px/* 🔴 2026-09-13 — gap 한 값은 «가로·세로 둘 다»에 걸린다. 원본은 세로를 따로 줬다:
   modoocard/content.css · page.css 「.main-navigation .main-nav ul { display:flex; flex-wrap:wrap; row-gap:4px !important }」
   (우리 수확물 core/presets/shell/_shared/_global.css 안에 원문 보존). 위 2026-09-04 이식은 가로 22px 만
   가져오고 이 세로 4px 을 빠뜨려, 메뉴가 줄바꿈되면 줄 간격까지 22px 이 됐다.
   🔴 드러난 조건 = 메뉴 항목 수. tcggrail 24개는 안 접혀 아무도 못 봤고, 시세 70개에서 2행이 되며 나타났다
   (2026-09-13 사용자 「메뉴 2행(줄바꿈)으로 나올 때 1행과 간격이 커」). 값 창작 0 — 원본 실측값 그대로. */;font-size:15px;color:#ffffff;flex-wrap:wrap}
.chrome .chrome-menubar{background:var(--fill-nav, #1a73e8);border-top:1px solid var(--line-dark)}
/* 🔴 2026-09-14 — 메뉴바 위아래 패딩도 키운다(사용자 확정 — 헤더와 같은 이유·같은 회차).
   2px → 9px(위아래 +7px씩). 좌우 24px 은 그대로. */
.chrome .menubar-inner{max-width:1300px;margin:0 auto;padding:9px 24px;display:flex;align-items:center;gap:26px}
.chrome .menubar-inner .search-pill{margin:5px 0}
/* 🔴 2026-09-05 메뉴바재이식 조 — 위 두 규칙(패딩 5px 10px·반투명 배경)은 «우리가 손으로 넣은
   값»이었다(지휘자 사전실측 §1). 모두의카드 인라인 <style id="chrome-native-css"> 안에는 같은
   선택자가 «두 번» 선언돼 있다 — 먼저 오는 죽은 스킴(index.html offset 54007·볼트블랙 팔레트
   var(--gold) 등, 화면엔 안 보임)과 뒤에 오는 승자(offset 64091·리터럴 hex, 소스오더로 이겨
   실제 렌더값이 된다). CSS 캐스케이드는 «속성 단위»로 이기므로 승자가 다시 선언하지 않은
   속성(text-decoration·border-bottom 골격)은 죽은 스킴 쪽이 그대로 남아 최종 렌더에 살아있다
   — 아래는 그 «병합된 최종값»을 문자 단위로 옮긴 것(값 재작성 0 · 새 속성 추가 0). */
.chrome .nav a{text-decoration:none;color:#ffffff;padding:4px 8px;border-radius:6px;border-bottom:2px solid transparent;transition:color .15s,border-color .15s,background-color .15s}
.chrome .nav a:hover,.chrome .nav a:focus-visible{color:#ffffff;border-bottom-color:#ffffff;background:var(--fill-brand-strong, #1557b0)}
/* 현재 페이지 강조 — JS(chrome-native-js)가 .nav-current 를 부여한다. */
/* 🔴 2026-09-05 — 1차 메뉴와 2차(드롭다운) 항목은 «현재 위치 표시 장치가 다르다». 의도다. 통일시키지 마라.
   1차(여기)  파란 «면» + 흰 글자 + 흰 밑줄        ← 🔴 원본(모두의카드) 값 그대로. 우리가 넣은 것이 아니다
   2차        왼쪽 «세로선» + 옅은 분홍 배경 + #c2185b   ← 2026-09-05 사용자 요청으로 «강화»한 것
   왜 다른가 ① 자리의 성격 — 1차는 «항상 보이는 가로 줄»에서 어느 갈래인지 짚는다(면이 빠르다)
                            2차는 «열렸을 때만» 보이는 세로 목록에서 여러 줄 중 하나를 짚는다(선이 맞다)
            ② 🔴 배경이 다르다 — 1차는 파란 메뉴바(#1a73e8) 위, 2차는 흰 패널 위
               분홍 #c2185b 을 1차에 쓰면 대비 «1.30 : 1» 로 «거의 안 보인다»(지휘자 계산 · AA 4.5 미달)
               흰색은 4.51 로 통과한다 = 원본이 흰색을 쓰는 이유가 그것이다
   🔴 그러므로 「2차에만 세로선이 걸린다」는 결함이 아니라 «설계»다. 「통일하자」로 바꾸면 1차가 안 보이게 된다. */
.chrome .nav>a.nav-current,.chrome .nav-item>a.nav-current{color:#ffffff;border-bottom-color:#ffffff;background:var(--fill-brand-strong, #1557b0)}
/* 🔴 2026-09-05 조A — 위 이력(margin-left:auto 를 search-pill 쪽으로 옮긴 판단)은 그 시점엔
   hdr-switch 가 비어 있어 맞는 임시 조치였다. 2026-09-05 잔여묶음 조가 hdr-switch 실물
   마크업(카테고리·언어 드롭다운)을 이식하면서 그 전제가 사라졌는데 auto-margin 은 미처
   따라 옮기지 않아 검색창만 오른쪽으로 밀리고 위젯은 로고 옆(사이)에 남는 "어중간한" 배치가
   됐다(사용자 지적 §6-b). 이번 회차가 auto-margin 을 위 .chrome .hdr-switch 로 되돌리고
   (그 뒤(검색창)가 소스오더상 이어져 함께 밀린다 — 결과보고서 확인) 여기서는 뺐다. */
.chrome .search-pill{align-items:center;gap:8px;background:var(--fill-surface-weak, #f0f0f0)/* 검색창 배경 · 밝은 회색 · 기본값 출처=surf2 raw 실측 #f0f0f0 */;border:1px solid var(--line-dark);border-radius:999px;padding:7px 16px;font-family:var(--mono);font-size:15px;color:var(--mist);min-width:200px}
/* display 값 = core/presets/shell/_shared/shell-set-base.css 의 `.chrome .search-pill{display:var(--search-display, flex)}`
   가 정한다(2026-09-04 완성형세트확정 조 — display:flex 리터럴을 이 규칙에서 제거해 그 스위치가
   실제로 값을 결정하도록 짝을 맞췄다. 이 파일에는 골격 아닌 값만 남는다). */
.chrome .search-pill input{flex:1;min-width:0;background:none;border:0;outline:none;color:#222222;font-family:var(--mono);font-size:15px;padding:0;box-shadow:none}
.chrome .search-pill input::placeholder{color:var(--mist)}
.chrome .search-pill:focus-within{border-color:var(--fill-nav, #1a73e8)}
.chrome .search-go{border:0;background:var(--fill-nav, #1a73e8);color:#ffffff;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;cursor:pointer;font-size:15px;line-height:1;font-weight:700;flex:0 0 auto;padding:0;transition:background .15s}
.chrome .search-go:hover,.chrome .search-go:focus-visible{background:var(--fill-brand-strong, #1557b0)}
.chrome .search-go:focus-visible{outline:2px solid #1a73be;outline-offset:2px}
.chrome .menu-toggle{display:none;margin-left:auto;background:none;border:1px solid var(--line-dark);border-radius:8px;padding:9px 10px;line-height:1;flex:0 0 auto;cursor:pointer}
.chrome .menu-toggle span{display:block;width:20px;height:2px;background:#222222;transition:transform .25s,opacity .25s}
.chrome .menu-toggle span+span{margin-top:5px}
.chrome .menu-toggle:focus-visible{outline:2px solid var(--fill-brand, #1e73be);outline-offset:2px}
.chrome.open .menu-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.chrome.open .menu-toggle span:nth-child(2){opacity:0}
.chrome.open .menu-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
/* 🔴 2026-09-05 메뉴바재이식 조 — 아래 모바일 패널·2단 드롭다운·아코디언 블록 전체를 모두의카드
   인라인 <style id="chrome-native-css"> 죽은 스킴(offset 50719~)과 승자 스킴(offset 63900~)을
   «속성 단위 캐스케이드 병합»해 다시 대조했다(위 .nav a 재이식과 같은 방법 — §1 표는 .nav a 만
   짚었지만 대조 단위는 «영역»이라 같은 <style> 블록 안 나머지 선택자도 전건 대조 대상이다).
   찾은 차집합 22건 = 아래 각 줄의 값(패딩·색·테두리·그림자 리터럴)이며 전부 이 회차에 해소했다
   (지엽적 오타 2건도 여기서 잡혔다 — 이전 이식에서 #1e73be 를 #1a73e8/#1a73be/#1557b0 세 가지
   다른 파랑과 섞어 썼다. 승자 쪽 리터럴은 전부 #1e73be/#17588f 두 값뿐). */
.chrome .mobile-panel{display:none;background:var(--fill-page, #f7f8f9)/* 모바일 메뉴판 배경 · 연회색 · 기본값 출처=bg raw 실측 #f7f8f9 */;border-top:1px solid var(--line-dark);padding-bottom:24px}
.chrome .mobile-panel a{display:block;padding:14px 24px;font-size:15px;color:#222222;text-decoration:none;border-bottom:1px solid var(--line-dark)}
.chrome .mobile-panel a:hover{color:var(--fill-brand, #1e73be)}
.chrome .mobile-panel a.nav-current{color:var(--text-nav-current, #17588f);font-weight:700}
.chrome .mobile-panel .search-pill{margin:16px 24px 0;min-width:0}
.chrome.open .mobile-panel{display:block;animation:chrome-panel .25s ease}
@media(min-width:921px){.chrome .mobile-panel{display:none !important}}
@keyframes chrome-panel{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
/* 메뉴 2단 — 데스크톱 드롭다운(CSS 전용) */
.chrome .nav-item{position:relative}
.chrome .nav-item>a{display:inline-flex;align-items:center;gap:6px}
.chrome .nav-caret{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor;opacity:.55}
.chrome .nav-sub{position:absolute;top:100%;left:-16px;padding-top:12px;display:none;z-index:9}
.chrome .nav .nav-sub{padding-top:0}
/* 🔴 2026-09-05 지휘자 직접 — 바닥값을 220px → 170px 로 «내렸다». 원본에서 바꾼 값이므로 기록한다.
   원본(모두의카드)  .chrome .nav-sub-inner{ min-width:220px }
   우리(1차)         min-width:170px   → 🔴 우리(2차) «제거»(2026-09-05 같은 날 · 아래 사유)
   사유 = 사용자 지시가 «내용 기준 폭»이었는데, 항목이 짧은 헤더 위젯(「환율」·「금시세」·「한국어」)에서는
          max-content 가 220 보다 «작아» 바닥값이 항상 이겼다 → 🔴 화면에서 아무 변화가 없었다.
          즉 220 은 «보존»되고 있었지만 그 보존이 «요구를 무력화»하고 있었다.
   🔴 왜 170 인가 = «새 값을 만들지 않았다». 같은 위젯의 «푸터 배치»가 이미 170 을 바닥값으로 쓰고
      (.core-locale--footer .nav-sub{min-width:170px}) 사용자가 화면에서 「푸터에는 적용됐어」로
      확인해 준 값이다 = «검증된 값의 인용»이다.
   🔴 «제거» 사유 = 170 으로 낮춰도 「환율」·「한국어」류는 그보다 짧아 «바닥값이 여전히 폭을 정했다».
      증거 = 사용자 「헤더는 «오른쪽» 여백이 더 많다」 — 글자가 왼쪽 정렬이라 남는 공간이 전부 오른쪽에
      생긴다 = 내용이 아니라 바닥값이 폭을 정하고 있다는 뜻이다. 사용자 지시가 「긴 글 기준으로 해야 해」
      이므로 바닥값이 있는 한 그 요구가 «무력화»된다 → 제거했다.
   ⚠️ 아주 짧은 목록(언어 = 「한국어 ✓」·「English」 두 칸)이 좁아 보이면 그때 «최소 바닥»을 다시 논한다.
      🔴 지금 «미리 만들지 않았다»(없어도 되는 것을 미리 만들지 않는다).
   ⚠️ 푸터 170 은 «부모(.nav-sub)»에 있고 보이는 상자는 inner(max-content)라 폭을 정하지 않는다 — 건드리지 않았다. */
.chrome .nav-sub-inner{background:#ffffff;border:2px solid var(--fill-brand, #1e73be);border-radius:12px;padding:10px 0;box-shadow:0 18px 30px -12px rgba(0,0,0,.25)}
/* 2026-09-05 지휘자 직접 — 드롭다운 폭을 «내용 기준»으로. 사용자 지적 「호버 시 창 너비가 동적이지
   않아」의 수리다. 🔴 min-width(220/170)는 «바닥값»이라 「이보다 작아지지 마라」일 뿐 「내용에 맞춰라」가
   아니다 — nowrap 은 «줄바꿈만» 막았고 상자를 «키우지는» 않았다. width:max-content 가 그 자리를 채운다.
   → 짧은 목록 = 220/170 유지 · 긴 목록 = 가장 긴 항목 + 여백만큼 늘어난다.
   🔴 선언은 «한 자리»(세 배치 공통) — nowrap 과 같은 처리. 상한은 «넘치는지 보고» 정한다(미리 만들지 않음). */
.chrome .nav-sub-inner,.core-locale--footer .nav-sub-inner{width:max-content}
.chrome .nav-item:hover .nav-sub,.chrome .nav-item:focus-within .nav-sub{display:block;animation:chrome-panel .18s ease}
.chrome .nav .nav-sub a{display:block;padding:10px 32px 10px 26px;font-size:15px;color:#1f2937;border-bottom:0}
.chrome .nav .nav-sub a:hover,.chrome .nav .nav-sub a:focus-visible{color:var(--fill-brand, #1e73be);background:#f7f8f9;border-bottom:0}
/* nowrap·.nav-current 시각 규칙 = 아래 "위젯·메뉴 2단 공통" 블록(§S18 — 위젯 드롭다운과
   메뉴 2단이 .nav-sub/.nav-sub-inner 로 «같은 기제»라 공통 규칙 한 곳에 정의한다). */

/* ══ 2026-09-05 라벨 조 §S17·§S18 — 위젯 드롭다운(헤더 .hdr-switch·푸터 .core-locale--footer)
   과 메뉴 2단(.chrome .nav) "선택/현재 항목" 공통 규칙. 셋 다 같은 마크업(.nav-sub
   .nav-sub-inner > a)을 쓰므로 여기 «한 자리»에서만 선언한다(중복 선언 0 — 한쪽만 고쳐지는
   사고를 막는다. 위 세 곳의 개별 white-space/.nav-current 선언은 이 블록으로 흡수했다).
   ① nowrap — 푸터가 이미 갖고 있던 값(원본 방식)을 헤더 위젯·메뉴 2단에도 «같게» 적용
      (발명 0). min-width(위젯 220px·푸터 170px·메뉴 220px)는 원본 값 그대로 — 걷어내지
      않는다(하한이라 내용이 길어지면 늘어난다 · 상한은 실제로 넘칠 때 만든다 — 지금은 0).
   ② 선택 표시 = «넷»(체크는 원본 방식대로 텍스트에 그대로 둔다 · 새 마크업 0):
      세로 막대(border-left) + 옅은 배경 + 전용 글자색(--accent-current) + 체크(✓).
      🔴 막대가 «필수»인 이유(지휘자 계산·재조사 마라) — 호버 배경(#f7f8f9)과 선택 배경
      (--fill-negative-weak, 아래 참고)의 밝기 차이가 1.10:1로 «거의 같다»(색만 다르다) →
      배경만으로는 호버 ↔ 선택이 구분되지 않는다. 막대가 있어야 두 상태가 갈린다 — 나중에
      "막대는 없어도 되겠네"로 지우면 이 구분이 다시 무너진다(그래서 이 사유를 여기 남긴다).
      배경색은 «새 hex 0» — 이 셸이 이미 갖고 있는 --fill-negative-weak(raw dn-s #FCE9E9 ·
      "가격 하락" 배지 배경과 같은 값)를 그대로 재사용한다(이름은 "negative"이지만 값이 우연히
      선택 표시에 맞아 재사용 — 하락 배지 색을 나중에 바꾸면 이 값도 함께 바뀐다는 뜻이니
      완전히 분리하고 싶어지면 그때 별도 raw 를 새로 판다). 글자·막대색만 «진짜 새 값»
      --accent-current(#C2185B · sites/sise/tokens.jsonc 신규 raw accent-current-ink) —
      대비: 흰 배경 5.87:1 · 배경(#fce9e9) 위 5.03:1 · 일반항목(#1f2937)과 구분 2.50(전부
      AA 통과 · 이전 파랑 #17588f 은 일반항목과 구분 1.98 로 "구분이 안 된다"는 지적을 받았다).
      🚫 브랜드색(#1e73be 계열)·경고색(#dc2626)·모두의카드 브랜드색(#e01e1e) 재사용 0. */
.chrome .hdr-switch .nav-sub a,.chrome .nav .nav-sub a,.core-locale--footer .nav-sub a{white-space:nowrap}
.chrome .hdr-switch .nav-sub a.nav-current,.chrome .nav .nav-sub a.nav-current,.core-locale--footer .nav-sub a.nav-current{position:relative;color:var(--accent-current, #c2185b);font-weight:600;background:var(--fill-negative-weak, #fce9e9);padding-left:26px}
.chrome .hdr-switch .nav-sub a.nav-current::before,.chrome .nav .nav-sub a.nav-current::before,.core-locale--footer .nav-sub a.nav-current::before{content:"";position:absolute;left:11px;top:6px;bottom:6px;width:4px;border-radius:2px;background:var(--accent-current, #c2185b)}
/* 메뉴 2단 — 모바일 아코디언(details 네이티브) */
.chrome .mobile-nav-group{border-bottom:1px solid var(--line-dark)}
.chrome .mobile-nav-group summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;padding:14px 24px;font-size:15px;font-weight:600;color:#222222}
.chrome .mobile-nav-group summary::-webkit-details-marker{display:none}
.chrome .mobile-nav-group summary::after{content:"+";font-family:var(--mono);font-size:18px;color:var(--fill-brand, #1e73be);transition:transform .2s}
.chrome .mobile-nav-group summary.nav-current{color:var(--fill-brand, #1e73be)}
.chrome .mobile-nav-group[open] summary::after{transform:rotate(45deg)}
.chrome .mobile-panel .mobile-nav-group a{display:block;padding:10px 24px 10px 40px;font-size:15px;color:var(--mist);border-bottom:0}
.chrome .mobile-panel .mobile-nav-group a:hover{color:var(--fill-brand, #1e73be)}
@media(max-width:920px){
  /* 🔴 2026-09-14 — 데스크톱 2차 확대(+6px)에 맞춰 모바일도 «같은 비율만큼만» 한 단계 더(지휘자
     지정값: 15px→19px). 좌우 10px 은 그대로. */
  .chrome .chrome-inner{padding:19px 10px}
  .chrome .chrome-menubar,.chrome .chrome-inner>.search-pill{display:none}
  .chrome .menu-toggle{display:block}
}

/* 🔴 2026-09-06 창B1 — 전역 유틸 이식(사용자 「범용으로 완성해」 · 지휘자 승인).
   원본 = F:\레퍼런스\TCGGrail\generatepress_child\assets\css\item-modules.css :157 과 :7451
          (같은 규칙이 F:\레퍼런스\모두의카드\generatepress_child\assets\css\item-modules.css :94 · :6149 에도)
   🔴 층 판정(2026-09-06 사용자 정정) — 층은 «셋»이다:
        모듈 core/modules/{모듈}/        어느 사이트에도 소속 안 됨
        프리셋 core/presets/shell/**      «다른 층» · 사이트가 «고르는» 것 · 그것도 범용   ← 여기
        사이트 sites/{site}/shell/        그 사이트만의 값
      tabular-number 는 «모듈이 아니라 프리셋 층»의 것이다. 모듈 넷(movers-board · prose ·
      rank-list · rank-panel)이 이 이름을 함께 쓰고, 어느 한 모듈 안에 두면 그 모듈이 없는
      페이지에서 숫자 자릿수가 어긋난다(2026-09-06 census: /fuel/ 4절 · station 1절 · seoul 1절).
   🔴 금지선은 「모듈 밖이냐」가 아니라 «사이트 소속이냐»다 — 프리셋에 의지하는 것은 정상이고,
      sites/{site}/shell 에 의지하면 그때가 결함이다.
   ⚠️ app-layer 는 이 유틸을 자기 __metric-value 규칙 안으로 «흡수»해 두었다(그 파일 주석 참조).
      그건 그대로 둔다 — 값이 같아 충돌하지 않는다. */
.tabular-number { font-variant-numeric: tabular-nums; }

/* ── 맨 위로 단추 — 🔴 라이브 원본 «그대로» 이식 (2026-09-07 창B1) ─────────────────────
   왜 여기인가: 매니페스트 선언 없이 «모든 페이지»에 떠야 하고, 색·위치가 사이트마다 다를 이유가 없다.
   사이트가 바꾸고 싶으면 자기 shell.css 에서 덮는다 — 여기에 사이트 값을 박지 않는다.

   🔴 출처(제가 직접 GET 해서 잰 것 · 값 창작 0)
     · 규칙 4벌 = 시세.com 라이브 <style id="generate-style-inline-css"> 안
     · 아이콘   = generatepress/assets/css/main.min.css 의 .gp-icon 계열 «마지막 승자»
       (그 파일에 .gp-icon{display:none} 이 «먼저» 나오고 뒤에서 inline-flex 로 덮인다 — 뒤가 이긴다)
     · .generate-back-to-top 자체 규칙은 main.min.css 에 «없다»(전부 인라인 쪽)

   🔴 클래스 이름을 라이브 그대로 둔 이유
     함께 이식한 JS(generatepress/assets/js/back-to-top.min.js)가 이 이름으로 요소를 찾는다.
     개명하면 JS 도 고쳐야 하고 그 순간 «그대로 이식»이 아니게 된다.
     이름 규율(사이트명 0·보면 아는 이름)과는 어긋나므로 개명 여부는 지휘자 판정 대상으로 남긴다.

   🔴 아직 확인 못 한 것
     모두의카드 modules.css:13885 의 `.scroll-top-button` 5벌은 «이것과 다른 것»이다.
     시세 라이브 HTML 에는 scroll-top-button 이 0건이고 generate-back-to-top 이 9건이다.
     모두의카드 라이브에서 어느 쪽이 실제로 뜨는지는 재지 못했다. 그쪽을 옮길 때 다시 잰다.
   ───────────────────────────────────────────────────────────────────────────────── */
.generate-back-to-top {
  /* 🔴 2026-09-23 — 라이브 값 20px 으로 되돌린다(라이브 인라인 CSS 원문 실측: font-size:20px).
     이력 = 20px(라이브) → 32px(09-14 「작다」) → 26px(09-17 「너무 크다」) → 지금 사용자가 다시
     「이게 원인이야」로 이 줄을 지목했다. 🔴 그런데 «곱해지는 것이 하나 더» 있었다 —
     .gp-icon svg 의 transform:scale(1.5)(라이브 0건·우리만 있음). 두 개가 겹쳐 26→39px 이었다.
     ⇒ 배율을 없애고 값을 라이브로 되돌린다. 크기 조절이 다시 필요하면 «이 한 줄만» 만진다. */
  font-size: 20px;
  /* 🔴 2026-09-14 사용자 지시 「정사각형 안 화살표 사이즈 더 키워」 — 라이브는 20px 이지만
     의도적으로 «키운 것»이다. 되돌리지 마라. 이유 = 아이콘이 글자가 아니라 SVG 이고
     width/height 가 1em 이라 font-size 가 곧 그림 크기인데, 그림 틀이 330×512 라
     정사각 1em 안에서 가로는 0.64em·꺾쇠 세로는 0.32em 만 쓴다. 20px 이면 눈에 보이는
     꺾쇠가 약 12.9×6.4px 로 40px 상자의 1/3 이 안 된다. 32px = 약 20.6×10.3px.
     🔴 2026-09-17 «재조정» — 사용자 「라이브에 비해서 너무 커」 + 「09-14 지시는 이전에 너무 작아서 한 것」.
     즉 09-14(작다) ↔ 09-17(크다) 사이가 목표다. 40px 상자 대비 꺾쇠 가로 폭 =
     20px→12.9px(32%) · 26px→16.6px(41%) · 32px→20.6px(52%). 26px 채택(일반적인 back-to-top 40~45%대).
     ⚠️ 앞 줄의 「되돌리지 마라」는 «20px 로 되돌리지 마라»는 뜻이고 그 취지는 유효하다. */
  border-radius: 3px;
  position: fixed;
  bottom: 30px;
  right: 30px;
  line-height: 40px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  z-index: 10;
  transition: opacity 300ms ease-in-out;
  opacity: 0.1;
  transform: translateY(1000px);
  /* 🔴🔴 2026-09-14 «정정» — 아래 옛 기재는 «틀렸다». 사용자가 라이브 적용 CSS 원문을 보내와
     확인된 사실: 라이브에는 .generate-back-to-top{height:40px!important;display:flex!important;
     align-items:center!important;justify-content:center!important;padding-bottom:5px!important}
     가 «실재한다». 즉 09-13 추가분은 «우리가 만든 것»이 아니라 «라이브에 있는 것»이었고,
     09-14 되돌리기가 그것까지 잘못 지웠다. 원인 = 분모를 «인라인 style 태그»로만 잡았다
     (헤더 인라인·main.min.css·사용자 추가 CSS 세 곳을 다 봐야 했다).
     🔴 padding-bottom:5px 는 «일부러 안 넣는다» — 라이브는 svg 에 top:.125em(아래로 2.5px)이
     걸려 있어 그걸 되돌리는 값이다. 우리는 그 top 을 이미 뺐으므로 같이 넣으면 위로 치우친다.
     🔴 라이브 font-size = 20px 이지만 우리는 32px 를 유지한다(사용자가 세 번 「작다」고 했다).
     ~~(옛 기재 · 무효)~~ 09-13 에 추가했던 height:40px·display:flex 3줄과 아래 두 gp-icon 규칙을
     되돌린다. 지휘자 실측 대조: 라이브 인라인 <style id="generate-style-inline-css">에는
     이 규칙들이 «한 줄도 없다»(line-height:40px + text-align:center 뿐이고 gp-icon 규칙 자체가
     없음). 09-13 추가는 우리가 만든 것이었고, 그것이 상자는 같은 40px인데 안의 화살표만 작고
     흐리게 보이는 원인이었다(사용자 09-14 「화살표가 작아」). 값 창작 0 — 뺀 것뿐. */
}
/* 🔴 2026-09-14 — 아이콘 «칠»과 «상자 모양» 두 가지 수리. 근거 = 라이브 원본 파일을 직접 받아 잼
   (GET 200 · https://www.xn--vj4b13a.com/wp-content/themes/generatepress/assets/css/main.min.css?ver=3.6.1)
   원문 2줄:
     .gp-icon{display:inline-flex;align-self:center}
     .gp-icon svg{height:1em;width:1em;top:.125em;position:relative;fill:currentColor}
   ① 🔴 09-14 되돌리기가 «인라인 스타일만» 보고 이 두 줄을 지웠다 — 실제로는 인라인이 아니라
      main.min.css 에 있다(이 파일 위 557행 주석이 그렇게 적어 두었는데도 놓쳤다). 분모를 좁게 잡은 것이
      원인이다. 지우자 svg 에 fill 지정이 «하나도» 없어 기본값 검정이 되었고, 어두운 반투명 원 위라
      사용자 눈에 «안 보였다»(2026-09-14 사용자: 「화살표 색상을 화이트로 변경해. 보이지 않아」).
   ② 🔴 top:.125em;position:relative 는 «일부러 뺐다». 그 값은 글자 기준선에 얹힐 때 생기는 어긋남을
      되돌리는 보정인데, 우리는 아래 상자를 flex 가운데 정렬로 바꿨으므로 그대로 두면 «두 번» 보정되어
      4px 아래로 치우친다. 라이브와 다른 이유가 이것이다.
   ③ 상자가 세로로 길어진 것(2026-09-14 사용자 지적)도 같은 뿌리다 — 그림이 줄 높이에 얹혀 있어
      글자 크기를 32px 로 올리자 줄 상자가 40px 를 넘어섰다. height:40px + flex 가운데 정렬로 못박았다. */
.generate-back-to-top .gp-icon{display:inline-flex;align-self:center}
/* 🔴 2026-09-14 — transform:scale 은 «우리가 더한 것»이다(라이브에 없다). 되돌리지 마라.
   사용자가 세 번 「작다」고 했고, 원인이 값이 아니라 «그림 틀 모양»이기 때문이다:
     그림 틀 330×512(세로로 김) → 정사각 1em 에 통째로 맞추면 세로가 기준이 되어 가로는 0.64em 만 쓴다.
     게다가 꺾쇠 자체는 틀 안 y 173~338 = 세로의 0.32 만 차지한다.
     그래서 1em=32px 라도 실제 칠해지는 꺾쇠는 17.7 × 10.3px 뿐이다(40px 상자의 절반 이하).
   🔴 글자 크기를 더 올리는 것은 답이 아니다 — 그림 «틀»만 커져 40px 상자를 넘어선다.
   그래서 «칠해지는 것»을 직접 확대한다. 1.5배 → 약 26.5 × 15.5px(상자 대비 좌우 여백 약 6.7px).
   transform 은 배치에 영향을 주지 않으므로 정사각 상자는 그대로 유지된다. */
/* 🔴 2026-09-23 — `transform:scale(1.5)` 제거. 라이브 페이지 전문에 scale(1.5) 는 «0건»이다(실측 grep).
   이 배율은 우리가 얹은 것이고, 아래 font-size 26px 위에 «또» 곱해져 화살표가 26×1.5=39px 로
   라이브 20px 의 약 1.95배가 됐다. 사용자 지적 「사이즈 아직 수정 안 됐어」의 절반이 이 줄이었다. */
.generate-back-to-top .gp-icon svg{height:1em;width:1em;fill:currentColor}

.generate-back-to-top__show { opacity: 1; transform: translateY(0); }
a.generate-back-to-top { background-color: rgba( 0,0,0,0.4 ); color: #ffffff; }
a.generate-back-to-top:hover,
a.generate-back-to-top:focus { background-color: rgba( 0,0,0,0.6 ); color: #ffffff; }

/* ============================================================================
   core-locale · site-footer-credit — CF 배포 번들에서 추가 수확 (2026-09-07)
   사유 = 지휘자 실측(갈래② — 셸/전역 클래스인데 이 공유 시트에 없었다). 출처 =
   modoocard/content.css(전수 grep으로 두 셀렉터가 있는 규칙 블록만 추출) — 명칭·값 변경 0.
   ============================================================================ */

.core-locale {
    display: flex;
    align-items: center;

    flex-wrap: nowrap;
    gap: 6px;
    font-size: 13px;
    line-height: 1.3;
    white-space: nowrap;
}

.core-locale__sep {
    opacity: .45;
}

.core-locale__now {
    cursor: default;
    font-weight: 600;
}

.core-locale__opt-off {
    cursor: default;
    opacity: .6;
}

.core-locale__list {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.core-locale__item {
    margin: 0 !important;
    padding: 0 !important;
}

.core-locale__item + .core-locale__item::before {
    content: "·";
    opacity: .45;
    margin-right: 6px;
}

.core-locale--nav {
    padding: 0 12px;
}

.core-locale--nav .core-locale__opt {
    color: rgba(255, 255, 255, .85) !important;
    text-decoration: none;
}

.core-locale--nav .core-locale__opt:hover {
    color: #ffffff !important;
    text-decoration: underline;
}

.site-footer-credit--v2 .core-locale--footer {
    margin: 0;
    color: var(--text-footer, #cbd5e1);
}

.site-footer-credit--v2 .core-locale--footer .core-locale__opt {
    color: var(--text-footer, #cbd5e1) !important;
    text-decoration: none;
}

.site-footer-credit--v2 .core-locale--footer .core-locale__opt:hover {
    color: #ffffff !important;
    text-decoration: underline;
}

.site-footer-credit {
    text-align: left;
    padding: 10px 0;
}

.site-footer-credit__title {
    font-weight: bold;
    margin: 0 0 10px 0;
    font-size: 1.05em;
}

.site-footer-credit__disclaimer {
    margin: 8px 0 10px 0;
    font-size: 0.85em;
    line-height: 1.6;
    color: #777;
}

.site-footer-credit__description {
    margin: 0 0 0 0;
    font-size: 0.8em;
    line-height: 1.6;
    color: #777;
}

.site-footer-credit__links {
    text-align: left;
    margin: 8px 0 6px;
    font-size: 0.85em;
}

.site-footer-credit__links a {
    color: #64748b !important;
    text-decoration: none !important;
    transition: color 0.2s, text-decoration 0.2s;
}

.site-footer-credit__links a:hover,
.site-footer-credit__links a:focus {
    color: #1a73e8 !important;
    text-decoration: underline !important;
}

.site-footer-credit__sep {
    color: #cbd5e1;
    margin: 0 6px;
}

.site-footer-credit__copy {
    text-align: left;
    margin-top: 0;
    font-size: 0.9em;
    color: #666;
}

.site-footer-credit__copy a {
    color: #666;
}

.site-footer:has(.site-footer-credit--v2) {
    background-color: var(--fill-footer, #1e293b);
}

.site-footer:has(.site-footer-credit--v2) .inside-site-info {
    padding: 0 !important;
    max-width: 100% !important;
    display: block !important;
}

/* 🔴 2026-09-13 — 이 블록은 «두 번째 벌»이다. 같은 선택자가 :232 에 «토큰판»으로 이미 있고,
   여기(뒤)가 이겨서 :232 의 `margin: var(--gap-above-footer, 20px) 0 0` 을 `margin:0` 으로 지웠다.
   증상 = 「스크롤 끝까지 내리면 본문·사이드바가 푸터에 «간격 없이» 붙는다」(2026-09-13 사용자 눈 검수).
   🔴 값 창작 0 — :232 정본과 «같은 선언»으로 맞춘다(거기 사유 주석 원문:
      「푸터의 padding(28px)은 «간격이 아니다» — 배경 «안쪽»이라 눈에 보이는 틈이 되지 않는다.
        값 = 상단 간격(--gap-below-menubar 20px)과 «같은 값»으로 대칭을 맞춘다」).
   🔴 범용 셸 베이스라 이 한 줄이 «전 사이트·전 페이지»에 걸린다(assemble-bundle.mjs:427 무조건 적재).
   ⚠️ 미해소 — 「토큰판이 뒤의 하드코딩판에 덮이는」 같은 형태가 모듈 CSS 전건에 250종 더 있다
      (2026-09-13 census: 중복 선택자 1,389종 중 250종 · rank-panel 23 · app-layer 21 · chart 18 …).
      증상이 확인된 것만 고친다 — 전수 수리는 별도 승인 사항. */
.site-footer-credit--v2 {
    text-align: left;
    padding: 0;
    margin: var(--gap-above-footer, 20px) 0 0;
    color: var(--text-footer, #cbd5e1);
    font-size: 15px;
    line-height: 1.6;
}

.site-footer-credit--v2 .site-footer-credit__band {
    background-color: var(--fill-footer, #1e293b);

    padding: 28px max(26px, calc((100% - var(--site-w, 1300px)) / 2)) 22px;
    border-radius: 0;
}

.site-footer-credit--v2 .site-footer-credit__brand {
    margin: 0 0 6px;
    font-size: 18px;
    line-height: 1.35;
}

.site-footer-credit--v2 .site-footer-credit__brand a,
.site-footer-credit--v2 .site-footer-credit__brand strong {
    color: #ffffff !important;
    text-decoration: none !important;
    font-weight: 800;
}

.site-footer-credit--v2 .site-footer-credit__tagline {
    margin: 0 0 14px;
    font-size: 14px;
    color: var(--text-footer-mute, #94a3b8);
}

.site-footer-credit--v2 .site-footer-credit__badges {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.site-footer-credit--v2 .site-footer-credit__badge {
    display: inline-block;
    padding: 5px 12px;
    font-size: 13px; /* CO-05 2026-10-09 · 글자 최소 13px (이전 12.5px) */
    line-height: 1.4;
    color: #e2e8f0;
    background: rgba(255, 255, 255, .04);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    white-space: nowrap;
}

.site-footer-credit--v2 .site-footer-credit__cols {
    background-color: var(--fill-footer, #1e293b);
    padding: 24px max(26px, calc((100% - var(--site-w, 1300px)) / 2)) 28px;
    border-top: 1px solid rgba(255, 255, 255, .09);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 26px 30px;
}

.site-footer-credit--v2 .site-footer-credit__col {
    min-width: 0;
}

/* 🔴 2026-09-13 — 이 블록은 «두 번째 벌»이다(정본 = :260 토큰판). 뒤라서 이겨 왔다.
   사용자 지적: 「여기 폰트 사이즈가 14px로 돼 있어야 하지 않아?」 — 맞다.
   정본 :260 은 `font-size: var(--size-footer-col-title, 14px)` 로 «처음부터 14px» 였고,
   이 구판이 13px 로 덮어 화면에만 13px 이 나갔다.
   🔴 값 창작 0 — 정본과 «같은 선언»으로 되돌린다(리터럴이 아니라 토큰을 쓴다).
      토큰으로 써야 sites/{site}/tokens.jsonc 로 사이트별 조절이 «실제로» 먹는다.
   🔴 같은 형태를 2026-09-13 에 네 번 겪었다(푸터 여백·메뉴 줄간격·맨위로 단추·이 건).
      장치 = core/admin/gates/duplicate-selector-audit.mjs — 이 건도 그 판정기가 잡아냈다. */
.site-footer-credit--v2 .site-footer-credit__col-title {
    margin: 0 0 12px;
    font-size: var(--size-footer-col-title, 14px);
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #d4af37 !important;
}

.site-footer-credit--v2 .site-footer-credit__col-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-footer-credit--v2 .site-footer-credit__col-list li {
    margin: 0 0 9px;
}

.site-footer-credit--v2 .site-footer-credit__link {
    color: var(--text-footer, #cbd5e1) !important;
    text-decoration: none !important;
    font-size: var(--size-footer-link, 14px);
    transition: color .18s ease;
}

.site-footer-credit--v2 .site-footer-credit__link:hover,
.site-footer-credit--v2 .site-footer-credit__link:focus {
    color: #ffffff !important;
    text-decoration: underline !important;
}

.site-footer-credit--v2 .site-footer-credit__link--gold {
    color: #ffffff !important;
    font-weight: 700;
}

.site-footer-credit--v2 .site-footer-credit__link--gold:hover,
.site-footer-credit--v2 .site-footer-credit__link--gold:focus {
    color: #ffffff !important;
    text-decoration: underline;
}

.site-footer-credit--v2 .site-footer-credit__bottomrow {
    background-color: var(--fill-footer, #1e293b);
    padding: 12px max(26px, calc((100% - var(--site-w, 1300px)) / 2));
    border-top: 1px solid rgba(255, 255, 255, .09);
    font-size: var(--size-footer-bottomrow, 13px);
    line-height: 2;
    text-align: center;
}

.site-footer-credit--v2 .site-footer-credit__bottomrow .site-footer-credit__link {
    color: var(--text-footer, #cbd5e1) !important;
    text-decoration: none;
}

.site-footer-credit--v2 .site-footer-credit__bottomrow .site-footer-credit__link:hover {
    color: #ffffff !important;
    text-decoration: underline;
}

.site-footer-credit--v2 .site-footer-credit__bottomrow .site-footer-credit__sep {
    color: #475569;
    margin: 0 6px;
}

.site-footer-credit--v2 .site-footer-credit__bottomrow button.site-footer-credit__link {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    cursor: pointer;
}

.site-footer-credit--v2 .site-footer-credit__bar {
    background-color: var(--fill-footer-strong, #0f172a);
    padding: 18px max(26px, calc((100% - var(--site-w, 1300px)) / 2)) 20px;
    border-radius: 0;
    border-top: 1px solid rgba(255, 255, 255, .09);
}

.site-footer-credit--v2 .site-footer-credit__barrow {

    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: flex-start;
    gap: 4px 10px;
    margin: 0 0 8px;
}

.site-footer-credit--v2 .site-footer-credit__barrow .site-footer-credit__copy {
    margin: 0;
}

.site-footer-credit--v2 .site-footer-credit__copy {
    margin: 0 0 8px;
    font-size: var(--size-footer-copy, 13.5px);
    color: var(--text-footer-mute, #94a3b8) !important;
}

.site-footer-credit--v2 .site-footer-credit__copy a {
    color: var(--text-footer, #cbd5e1) !important;
    text-decoration: none !important;
}

.site-footer-credit--v2 .site-footer-credit__copy a:hover {
    color: #ffffff !important;
}

/* CO-05 2026-10-09 · 글자 최소 13px(사용자 10-09 «글자 최소 문장형 14 / 이름표 13») */
.site-footer-credit--v2 .site-footer-credit__legal {
    margin: 0;
    font-size: var(--size-footer-legal, 13px);
    line-height: 1.7;
    color: var(--text-footer-faint, #64748b);
}

.site-footer-credit--v2 .site-footer-credit__legal strong {
    color: var(--text-footer-mute, #94a3b8);
    font-weight: 600;
}


@media (max-width: 900px) {
    .site-footer-credit--v2 .site-footer-credit__cols {
        grid-template-columns: repeat(2, 1fr);
        gap: 22px 26px;
    }
}
@media (max-width: 560px) {
    .site-footer-credit--v2 .site-footer-credit__band,
    .site-footer-credit--v2 .site-footer-credit__cols,
    .site-footer-credit--v2 .site-footer-credit__bar {
        padding-left: 16px;
        padding-right: 16px;
    }
    .site-footer-credit--v2 .site-footer-credit__band {
        padding-top: 20px;
        padding-bottom: 14px;
    }
    .site-footer-credit--v2 .site-footer-credit__cols {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px 18px;
        padding-top: 16px;
        padding-bottom: 18px;
    }
    .site-footer-credit--v2 .site-footer-credit__cols a,
    .site-footer-credit--v2 .site-footer-credit__link {
        font-size: 13.5px;
        line-height: 1.5;
    }
    /* CO-05 2026-10-09 · 글자 최소 13px(사용자 10-09 «글자 최소 문장형 14 / 이름표 13») */
    .site-footer-credit--v2 .site-footer-credit__legal {
        font-size: 13px;
        line-height: 1.55;
    }
}


.site-footer-credit--v2 .site-footer-credit__barrow .core-locale--footer::before {
    content: "·";
    margin-right: 10px;
    opacity: .55;
}

/* ============================================================================
   🔴 전역 CSS 커스텀 프로퍼티(:root) — CF 배포 번들에서 추가 수확 (2026-09-07)
   사유 = 지휘자 실측 + 자체 확인 — var(--acc)·var(--mut)·var(--up)·var(--dn)·var(--color-primary)
   등이 거의 모든 모듈(table·disclaimer·cta·app-layer·chart·kpi-card·relation-flow·symbol-badge…)
   에서 쓰이는데 이 저장소 core/ 전체에 :root 정의가 «단 하나도 없었다»(전수 grep 확인 0건).
   4개 :root 블록 전부(가상 스포크 계열 --acc 등 · 계산기 계열 --color-* · --color-sticky-top ·
   랜딩페이지 계열 --lp-*)를 번들에서 그대로 뽑아 붙인다. 명칭·값 변경 0.
   ============================================================================ */

/* tcggrail/axis.css:1382-1431 */
:root {
  --bg:   #F6F7FA;   /* 페이지 바닥 */
  --surf: #FFFFFF;   /* 상자 바닥 */
  --surf2:#EEF1F6;   /* 한 단 낮은 바닥(칩·판) */
  --line: #E2E7EF;   /* 바깥 테두리 */
  --line2:#CFD6E2;   /* 안쪽 테두리(타일) */
  --ink:  #12161F;   /* 본문 글자 */
  --ink2: #3F4859;   /* 보조 글자 */
  --mut:  #636E81;   /* 약한 글자(라벨·단위) — WCAG AA(4.5:1↑) */
  --acc:  #5747E0;   /* 강조 */
  --acc-s:#EEEBFE;   /* 강조 배경(옅은) */
  --acc-i:#3B2DBF;   /* 강조(글자용·짙은) */
  --up:   #0E7E4D;   /* 오름 — WCAG AA(4.5:1↑) */
  --up-s: #E4F6EC;   /* 오름 배경 */
  --dn:   #CE3137;   /* 내림 — WCAG AA(4.5:1↑) */
  --dn-s: #FCE9EA;   /* 내림 배경 */
  --fl:   var(--mut); /* 보합(중립) */
  --warn: #93650F;   /* 주의 — WCAG AA(4.5:1↑) */
  --warn-s:#FDF3E0;  /* 주의 배경 */
  --gold: #866A23;   /* 보조 지표선(이동평균·판정 배지) — WCAG AA(4.5:1↑) */
  --buy:    #C13A2E;   /* 마켓 구역 행동색(구매 CTA·최저가 배지·Affiliate 강조) */
  --buy-ink:#98261C;   /* --buy 옅은 배경 위 글자용(짙은 대비) */
  --low: #0E7C86;   /* 최저 호가선 */
  --c1:   #5B4CE8;   /* 계열색 1 */
  --c2:   #08788E;   /* 계열색 2 — WCAG AA(4.5:1↑) */
  --c3:   #D6800F;
  --c4:   #8B96AA;
  --c5:   #D14B8F;
  --g1:   #12B26D;   /* 계기판 왼쪽(상승) */
  --g2:   #EDA51B;   /* 계기판 가운데(보합) */
  --g3:   #EE4B51;   /* 계기판 오른쪽(하락) */
  --r:    14px;      /* 큰 모서리 */
  --r-s:  9px;       /* 작은 모서리 */
}

/* tcggrail/axis.css:18280-18297 */
:root {
  --color-primary: #1a73e8;
  --color-primary-dark: #1557b0;
  --color-primary-light: #e8f0fe;
  --color-radius-sm: 8px;
  --color-radius-md: 12px;
  --color-radius-lg: 16px;
  --color-shadow-sm: 0 1px 3px rgba(0,0,0,.06);
  --color-shadow-md: 0 4px 16px rgba(0,0,0,.08);
  --color-shadow-focus: 0 0 0 3px color-mix(in srgb, var(--color-primary) 18%, transparent);
  --color-text-primary: #111827;
  --color-text-body: #374151;
  --color-text-secondary: #4b5563;
  --color-text-muted: #6b7280;
  --color-border: #e5e7eb;
  --color-border-light: #f3f4f6;
  --color-bg-subtle: #f9fafb;
}

/* tcggrail/axis.css:24573-24575 */
:root {
    --color-sticky-top: 60px;
}

/* tcggrail/axis.css:27300-27319 */
:root {
  --lp-up:    #dc2626;
  --lp-down:  #2563eb;
  --lp-flat:  #64748b;
  --lp-amber: #f59e0b;
  --lp-text:  #1e293b;
  --lp-body:  #374151;
  --lp-sec:   #475569;
  --lp-muted: #94a3b8;
  --lp-link:  #1a73e8;
  --lp-point: #4285f4;
  --lp-card:  #ffffff;
  --lp-subtle:#f8fafc;
  --lp-bg:    #f1f5f9;
  --lp-border:#e2e8f0;
  --lp-blt:   #e5e7eb;
  --lp-radius:8px;
  --lp-shadow:0 4px 12px rgba(0,0,0,0.06);
  --lp-shover:0 8px 20px rgba(0,0,0,0.10);
}

/* ============================================================================
   card-image-fallback(그림 없는 카드 축소모형 정본 부품) — CF 배포 번들에서 추가 수확 (2026-09-07)
   사유 = movers-board·card-holo·list-row 등 여러 모듈이 core_pk_noimg_card() 공용 부품을
   재사용하는데 각자 잘못된 접두어(movers-board__pic--alt-fallback 등)로 발명해 두고 있었다.
   이 부품은 모듈 하나가 아니라 여러 모듈이 «공유»하므로 셸(전역)에 둔다. 출처 = tcggrail/axis.css.
   명칭·값 변경 0.
   ============================================================================ */

/* tcggrail/axis.css:10232 */
.card-image-fallback { position:relative; display:grid; grid-template-rows:auto 1fr auto; gap:4px; aspect-ratio:745/1040; padding:7px 7px 8px; border-radius:6px; background:var(--surf2); border:1px solid var(--line2); cursor:default; overflow:hidden; text-align:left; container-type:inline-size; }

/* tcggrail/axis.css:10235,10237 */
.card-image-fallback__header { display:flex; align-items:baseline; justify-content:space-between; gap:5px; min-width:0; padding:2px 5px; border-radius:4px; background:var(--line2); }
.card-image-fallback__footer { display:flex; align-items:baseline; justify-content:space-between; gap:5px; min-width:0; padding:2px 5px; border-radius:4px; background:var(--line2); }

/* tcggrail/axis.css:10240 */
.card-image-fallback__name { font-size:13px; font-weight:800; color:var(--ink2); line-height:1.3; min-width:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* tcggrail/axis.css:10245,10249 */
.card-image-fallback__hp { flex:0 0 auto; font-style:normal; font-size:13px; font-weight:700; color:var(--mut); font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.card-image-fallback__content { flex:0 0 auto; font-style:normal; font-size:13px; font-weight:700; color:var(--mut); font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* tcggrail/axis.css:10253 */
.card-image-fallback__set { min-width:0; font-size:13px; font-weight:700; color:var(--mut); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* tcggrail/axis.css:10257 */
.card-image-fallback__artwork { grid-row:2; display:grid; place-items:center; min-height:0; border-radius:4px; background:var(--surf); overflow:hidden; }

/* tcggrail/axis.css:10260 */
.card-image-fallback__meta { margin:0; text-align:center; font-size:13px; font-style:normal; font-weight:700; color:var(--mut); line-height:1.35; word-break:keep-all; padding:0 4px; }

/* tcggrail/axis.css:10262 */
.card-image-fallback__hp:empty { min-height:0; }

/* ── 이모지 그림 크기 (2026-09-13 신설 · 국기 배선과 한 쌍) ────────────────────────────────
   shell-set-base.js 가 국기 글자를 <img class="emoji"> 로 바꾼다. 그림은 글자가 아니라
   font-size 를 받지 않으므로 크기를 여기서 준다 — 안 주면 상자 폭만큼 거대해진다(실측).
   🔴 값은 라이브 원문 그대로다(창작 0) — 시세 라이브 인라인 스타일에서 발췌:
       img.emoji {height:1.15em;width:1.15em;margin:0 .07em;vertical-align:-0.18em;display:inline-block}
   ── */
img.emoji { height:1.15em; width:1.15em; margin:0 .07em; vertical-align:-0.18em; display:inline-block; }

/* core/presets/shell/_shared/tag-defaults.css */
/* core/presets/shell/_shared/tag-defaults.css — 플랫폼 "기반"(tag-defaults) 신설 (2026-09-05)
   ------------------------------------------------------------------------------------------
   무엇   순수 태그 선택자(클래스 결합 0) 8종 = h1 · table · th · td · img · a · body · html
          만 담는다. 값은 F:\cloudflare-platform-dist\modoocard\assets\bundles\page.d3534e7b75bc.css
          (라이브가 실제로 부르는 그 해시 배포본)에서 «원문 그대로» 옮겨 적었다 — 우리가 값을
          고르지 않았다(작업창 B2 · _목록-태그기본값한벌-20260905.md §3, 28건 전건).
   왜     같은 범용 모듈(page-header 등)이 모두의카드는 멀쩡하고 시세는 날것으로 보이는 원인 =
          "태그 기본값을 지우는 한 벌"이 저장소에 없었기 때문(모두의카드는 배포본에 «우연히»
          있었을 뿐 — 지금까지의 "동일 시각화"는 «보장»이 아니라 «운»이었다).
   어떻게 사이트가 «고르는» 것이 아니다(shell-set 옵션 아님 · 켜고 끄기 없음) — 조립기
          (core/build/assemble-bundle.mjs · loadShell())가 매 사이트 shell.style 맨 앞에
          «항상» 싣는다. 모듈 CSS(모듈은 클래스로 더 구체적이라 자연히 뒤에서 이긴다) «앞»에
          온다 — 기반이 모듈을 이겨서는 안 된다.
   금지   8종 외 태그(h2~h6·p·ul/ol/li 등) 신설 0 — 그 태그들은 소스에 "순수 태그 선택자"
          규칙이 «한 건도» 없다(B2 §4 재검색 확인). 넣는 순간 값의 근거가 "우리 판단"이 되어
          규율 위반이다. 확장이 필요하면 별건(디자인 판정 선행)으로 발주한다.
   자기검사  node core/build/assemble-bundle.mjs --site sise 실행 후
          grep -c "clamp(23px,3vw,30px)" _generated/sise/… 산출 shell.css 1개 이상 → 실림 확인.
   ------------------------------------------------------------------------------------------ */

/* #1 (소스 7252행) — 유일한 전역 리셋 */
* {
  box-sizing: border-box;
}

/* #2 (소스 1159행) */
body {
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR","Malgun Gothic",sans-serif;
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

/* #3 (소스 7254행) */
a {
  color: var(--acc-i);
}

/* #4 (소스 7256행) — 사용자가 지목한 h1 여백·줄높이의 유일한 정의 */
h1 {
  font-size: clamp(23px,3vw,30px);
  margin: 0 0 10px;
  letter-spacing: -.028em;
  line-height: 1.22;
  text-wrap: balance;
}

/* #5 (소스 7989행) */
table {
  border-collapse: collapse;
  width: 100%;
  min-width: 540px;
  font-size: 15px;
}

/* #6 (소스 7991행) */
th {
  padding: 9px 14px;
  text-align: center;
  border-bottom: 1px solid var(--line);
  border-left: 1px solid color-mix(in srgb,var(--line2)45%,transparent);
  border-top: 1px solid var(--line);
  border-right: 1px solid color-mix(in srgb,var(--line)60%,transparent);
  font-size: 13px;
  letter-spacing: .05em;
  color: var(--mut);
  text-transform: uppercase;
  font-weight: 700;
}

/* #7 (소스 7992행) */
td {
  padding: 9px 14px;
  text-align: left;
  border-bottom: 1px solid var(--line);
  border-left: 1px solid color-mix(in srgb,var(--line2)45%,transparent);
  border-top: 1px solid var(--line);
  border-right: 1px solid color-mix(in srgb,var(--line)60%,transparent);
}

/* #8 (소스 7993행) */
th:first-child {
  border-left: 0;
}

/* #9 (소스 7995행) */
td:first-child {
  border-left: 0;
}

/* #10 (소스 7997행) — #6 th 와 프로퍼티 중복, 더 구체적이라 여기 값이 최종 적용 */
thead th {
  font-size: 13px;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--mut);
  font-weight: 700;
  border-bottom: 2px solid var(--line2);
}

/* #11 (소스 8000행) */
tbody tr:last-child td {
  border-bottom: 2px solid var(--line2);
}

/* #12 (소스 8006행) */
th:last-child {
  border-right: 0;
}

/* #13 (소스 8008행) */
td:last-child {
  border-right: 0;
}

/* #14 (소스 8012행) */
tbody tr:hover {
  background: var(--surf);
}

/* #15 (소스 8792행) — 드래그·롱프레스 방지, 크기/여백 리셋 아님 */
img {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}

/* #16 (소스 9745행) — 표 안 a 만 스코프, 전역 a(#3) 위에 추가 적용 */
table td a {
  display: inline-block;
  padding: 3px 9px;
  border: 1px solid var(--line2);
  border-radius: 6px;
  background: var(--surf2);
  color: var(--acc-i);
  text-decoration: none;
  font-weight: 700;
  line-height: 1.45;
  white-space: nowrap;
  cursor: pointer;
  transition: background .13s,border-color .13s,color .13s;
}

/* #17 (소스 9749행) — #16 과 동일값 */
table th a {
  display: inline-block;
  padding: 3px 9px;
  border: 1px solid var(--line2);
  border-radius: 6px;
  background: var(--surf2);
  color: var(--acc-i);
  text-decoration: none;
  font-weight: 700;
  line-height: 1.45;
  white-space: nowrap;
  cursor: pointer;
  transition: background .13s,border-color .13s,color .13s;
}

/* #18 (소스 9756행) */
table td a:hover {
  background: var(--acc-s);
  border-color: var(--acc);
  color: var(--acc-i);
  text-decoration: none;
}

/* #19 (소스 9759행) — #18 과 동일값 */
table td a:focus-visible {
  background: var(--acc-s);
  border-color: var(--acc);
  color: var(--acc-i);
  text-decoration: none;
}

/* #20 (소스 9862행) */
table td:not(:first-child) {
  white-space: nowrap;
}

/* #21 (소스 9864행) */
table td:first-child {
  white-space: normal;
  min-width: 0;
}

/* #22 (소스 9867행) */
table th:first-child {
  white-space: normal;
  min-width: 96px;
}

/* #23 (소스 9870행) */
table tr>td:last-child {
  white-space: normal;
}

/* #24 (소스 9873행) — #7 td 와 별도 규칙(프로퍼티 겹치지 않음, 둘 다 적용) */
table td {
  white-space: nowrap;
}

/* #25 (소스 9876행) — #6 th 와 별도 규칙 */
table th {
  white-space: nowrap;
}

/* #26 (소스 23763행) */
html {
  scroll-padding-top: var(--chrome-h, 96px);
}

/* #27 (소스 25549행) — #15 img 와 완전 동일(같은 파일 안에 두 번 정의됨), 원문 그대로 보존 */
img {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}

/* #28 (소스 25886행) — #2 body 와 별도 규칙(프로퍼티 겹치지 않음, 배경색만 여기서 추가)
   🔴 2026-09-05 조A — margin 토큰 추가(사용자 확정 "0으로 처리 · 나중에 테두리로 쓸 수도
   있으니 방식은 남긴다"). 원인(지휘자 devtools 실측) = user agent stylesheet 의
   `body{margin:8px}` 기본값이 이 8종 세트에 초기화되지 않아 살아 있었고, 그 8px 자리에
   body 배경(#f7f8f9)이 사방으로 드러나 "회색 테두리"로 보였다(census 재확인 — 원본
   page.d3534e7b75bc.css 의 순수 body 태그 규칙도 2건뿐이라 margin 은 «원본에도 없다» ·
   이 결함은 "이식 누락"이 아니라 "원본·모두의카드 둘 다 갖고 있던 잠재 결함"이며 모두의카드는
   다른 요인으로 드러나지 않았을 뿐이다 — 더 파지 말라는 지휘자 지시에 따라 원인은 여기까지만
   기록한다). 배경색(#f7f8f9)은 손대지 않는다(지우지 않는다 — 값 하나를 바꾸면 되살아나야
   한다는 요구와, 폭(--site-w)도 그대로 둔다는 요구 그대로). */
body {
  background-color: #f7f8f9;
  margin: var(--body-margin, 0);
}

/* #29 (소스 10507~10550행 · @media (max-width:820px) 내부) — 🔴 시공(coder) 재확인 발견,
   B2 목록(28건) 밖. "판정의 분모는 원본이다" 규율에 따라 G2 대조 도구로 원본 전체(25,930행,
   @media 내부 포함)를 재스캔한 결과 유일하게 남는 잔여 = 같은 태그 table 의 반응형 변형(폭
   540px→560px, 좁은 화면). 8종 외 새 태그 신설이 아니라 «이미 포함된 table 태그»의 조건부
   값이므로 G5(8종 외 신설 0) 위반이 아니다 — 넣지 않으면 이 조건에서만 두 사이트가 갈려
   G2(차집합=0)가 닫히지 않는다. */
@media (max-width:820px) {
  table {
    min-width: 560px;
  }
}

/* core/presets/shell/_shared/layout.css */
/* core/presets/shell/_shared/layout.css — 🆕 2026-09-06 창B1
   ═══════════════════════════════════════════════════════════════════════════════════════
   층 = ② «레이아웃»(범용). <main> «안»의 것 — 절 그릇 · 본문 흐름 · 절 간격 · 제목 리듬.
   네 층의 자리와 순서(assemble-bundle.mjs loadShellSetCss · 뒤가 앞을 이긴다):
     ① 셸      _shared/shell-set-base.css      페이지 «바깥»(헤더·네비·푸터·사이드바 골격)  [범용]
     ② 레이아웃 _shared/layout.css  ← 이 파일     <main> «안»                                [범용]
     ③ 세트    {세트}/shell-set.css             사이드바 유무 등 고른 세트의 골격            [세트]
     ④ 사이트  sites/{site}/shell/shell.css     그 사이트만의 것(색·로고·고유 문안)          [사이트]
   🔴 여기 두는 판정 한 줄 = 「이 규칙을 모두의카드에 그대로 갖다 놓아도 맞는가」 → 맞으면 여기다.
   ═══════════════════════════════════════════════════════════════════════════════════════ */

/* ── 접근성 — 스킵 링크(2026-09-15 범용이관 조 — ④ sites/sise/shell/shell.css:34~36 에서 이관).
   이관 사유 = layout.css 배선 완료(assemble-bundle.mjs loadShellSetCss). 판정 = 「모두의카드에
   그대로 갖다 놔도 맞는가」→ 맞다(마크업이 실제로 쓰는 a11y 기법 · 색상·값 전부 범용 회색조 ·
   사이트 고유값 0). 원출처 = tcggrail head-invariant.html #global-styles-inline-css 블록에서
   발췌한 1규칙(그 블록 전체는 WP 블록에디터 산출물이라 죽은 CSS — 이 규칙만 예외로 이식됐었다). */
.screen-reader-text{word-wrap:normal!important;border:0;clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}
.screen-reader-text:focus{background-color:#ddd;clip-path:none;color:#444;display:block;font-size:1em;height:auto;left:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}

/* 본문 흰 상자 «안쪽» 여백 — 사이드바 패널과 같은 값(2026-09-15 범용이관 조 — ④
   sites/sise/shell/shell.css:63~73 에서 이관, 주석 포함). 판정 = 「모두의카드에 그대로 갖다
   놔도 맞는가」→ 맞다(토큰 var(--pad-box-inner, 20px) 하나로 묶는 «메커니즘» 자체가 범용이고
   값은 폴백 20px 뿐 — 사이트 고유 리터럴 0). ⚠️ `.separate-containers .inside-article`
   에 한해서는 ④층(sites/sise/shell/shell.css)이 이 규칙 «뒤»에 실려(뒤가 앞을 이긴다) 사이트별
   값(예: 시세 `padding:40px 20px 20px`)으로 다시 덮는다 — 그 사이트별 덮어쓰기 규칙 자체는
   사이트마다 다르다는 사실이 원래 주석에 명시돼 있어 ④에 그대로 남겨 뒀다(옮기지 않음 — 보고서
   ⑨ 표 참조).
   🔴 2026-09-05 사용자 확정 — 본문은 회색 바탕 위의 «흰 상자»다. 구분을 만드는 것은 «여백»이
   아니라 «배경 대비»다(사용자: 「회색 배경에 본문 영역 화이트 배경으로 감싸서 구분되는 방식」).
   🔴 그래서 «토큰 하나»(--pad-box-inner)로 묶었다 — 각자 20px 로 적어 두면 «한쪽만 바뀔 때 또
   어긋난다». 기본값 20px = 사이드바 패널 원래 값(기준이 되는 쪽을 «인용»했다 · 새 값 0). */
.separate-containers .inside-article,
.separate-containers .comments-area,
.separate-containers .paging-navigation,
.one-container .site-content,
.inside-page-header{padding:var(--pad-box-inner, 20px)}

/* 절 제목 — 라이브 규칙 «값 그대로» 이식(2026-09-06).
   출처 = F:\레퍼런스\시세\generatepress_child\assets\css\modules.css:46-56 (.module-section__title)
   🔴 왜 여기(범용)인가 = 절 제목 리듬은 어느 사이트든 같다. 사이트 고유가 아니다.
      처음에 sites/sise/shell/shell.css(④)에 넣었다가 옮겼다 — 거기 두면 모두의카드·tcggrail 이
      «같은 결함을 다시» 겪는다(지휘자 지적 2026-09-06).
   🔴 계기 = 배포본에 적용되는 CSS 195,820B 안에 `.content-section-block` 계열이 «0건»이었다.
      절 21개가 간격 없이 붙어 나왔고, 모듈 CSS 가 두꺼운 셋(page-header·answer-first·toc)만
      혼자 형태가 서서 「일부만 적용된 것처럼」 보였다(사용자 지적).
   🔴 라이브에는 «절을 감싸는 상자가 없다»(라이브 HTML 실측: <section> 0개 ·
      content-section-block 0건 — 그 클래스는 «우리가 만든» 것이다). 라이브는
      <h2 class="module-section__title"> 와 모듈을 «형제»로 놓고 리듬을 «제목 위 여백»으로만 만든다.
      그래서 옮긴 것은 «상자»가 아니라 «제목 규칙»이고, 상자에는 규칙을 주지 않는다(발명 0).
   🔴 2026-09-15 범용이관 조 — ④층 sites/sise/shell/shell.css:116~138 에 있던 «같은 값의
      사본»을 지웠다(이관 사유 = layout.css 배선 완료 · 값 대조 = 완전 일치, font-size 24px·
      color #1a73e8·border-left 4px solid #4285f4·border-bottom 1px solid #e0e0e0·
      margin 70px 0 15px 0·line-height 1.35 — 7속성 전부 문자 단위 동일이라 «합치기»만
      했다·새 값 0). 이제 이 규칙의 출처는 이 파일 «한 곳»뿐이다. */
.content-section-block__title {
    font-size: 24px;
    font-weight: 700;
    color: #1a73e8;
    padding-left: 15px;
    padding-bottom: 10px;
    border-left: 4px solid #4285f4;
    border-bottom: 1px solid #e0e0e0;
    margin: 70px 0 15px 0;
    line-height: 1.35;
}

/* «안 묶은 선택 슬롯» 빈 상자 감춤(2026-09-15 범용이관 조 — ④ sites/sise/shell/shell.css:140~150
   에서 이관, 주석 포함). 판정 = 「모두의카드에 그대로 갖다 놔도 맞는가」→ 맞다(속성 선택자
   하나뿐 · 값·색·사이트 고유 리터럴 0 — 슬롯 감싸개가 비면 안 그린다는 «행동 규칙»이라 어느
   사이트든 같다).
   🔴 2026-09-06 창B1 원문 — 모듈은 선택 슬롯도 감싸개(data-slot-wrap)를 «항상» 내보낸다. 그
   감싸개에 테두리·여백이 있으면, 값이 없을 때 «내용 없는 상자»가 화면에 남는다.
   🔴 왜 «슬롯을 채워서» 풀지 않는가 = 채울 원자가 없는 자리를 메우면 「단순 치환」이 된다.
   값이 생기면 상자는 «저절로» 다시 나타난다(이 규칙은 빈 것만 감춘다).
   ⚠️ 이것은 «가림»이지 «고침»이 아니다 — 감싸개가 비었을 때 스스로 안 그리는 것이 옳고,
   그 자리는 core/modules(무접촉)라 지휘자 승인 목록에 올렸다. */
[data-slot-wrap]:empty { display: none; }

/* core/presets/shell/_shared/_global.css (본문 부품 9규칙) */
.page-number-list { display: flex; gap: 5px; flex-wrap: wrap; }
.page-number-list a { min-width: 31px; height: 31px; display: grid; place-items: center; border-radius: 7px; font-size: 13.4px; font-weight: 700; border: 1px solid var(--line2); background: var(--surf); color: var(--ink2); text-decoration: none; }
.page-number-list a:hover { border-color: var(--acc); }
.module-section__title--sub { font-size: 19px; font-weight: 700; color: var(--color-text-primary, #1e293b); padding-left: 12px; padding-bottom: 0; border-left: 3px solid #cbd5e1; border-bottom: none; margin: 28px 0 12px 0; line-height: 1.7; }
.text-blue { color: #1d4ed8; }
.text-red { color: #991b1b; }
.featured-image-block { margin: 0 0 20px; text-align: center; }
.featured-image-block__image { max-width: 100%; height: auto; border-radius: 10px; }
.module-section__intro { font-size: 16px; color: #374151; line-height: 1.85; margin-bottom: 16px; }
.page-number-list span[aria-current] { min-width: 31px; height: 31px; display: grid; place-items: center; border-radius: 7px; font-size: 13.4px; font-weight: 700; border: 1px solid var(--acc, #2563eb); background: var(--surf, #fff); color: var(--acc, #2563eb); text-decoration: none; }
/* core/presets/shell/with-sidebar/shell-set.css */
/*
  core/presets/shell/with-sidebar/shell-set.css — 셸 세트: 사이드바 있음(광고+인기글 패널)
  (2026-09-05 개명 조 — 옛 이름 "sidebar" 는 폐기)
  ────────────────────────────────────────────────────────────────────────────
  공통 골격(../_shared/shell-set-base.css) 위에 이 세트만 얹는 차등 규칙.
  body 클래스에 has-info-sidebar 가 붙었을 때만 작동(assemble-bundle.mjs 가 이 세트 선택 시
  body-prefix.html 의 body class 문자열에 그 클래스를 더한다 — 사이트 파일 리터럴 편집 0).

  출처(발명 0 — 전부 실측, _강화/_라이브정본/page-bundle.css 재확인 2026-09-04
  · _강화/_프리셋초안/shell-sidebar/preset.jsonc §container_chain_css.rules_verbatim 원문) ──
    L11719 body.has-info-sidebar .site-content
    L11723 body.has-info-sidebar .site-content .content-area
    L11726-11739 .info-sidebar / .info-sidebar__panel
    L11748-11751 @media(max-width:768px) 사이드바 접힘

  🔴 2026-09-04 지휘자 판별 명확화 반영 — 「그 규칙이 «무엇을» 겨냥하는가」로 소속을 가른다.
  라이브 L16498-16509(`.info-sidebar .core-ad--adsense{...}`)는 «광고 모듈 자체를 겨냥한 보정
  규칙»이라 이 파일에서 뺐다. 우리 플랫폼의 대응 모듈 `core/modules/display/ad-slot`(class
  `.ad-slot`)은 자기 `style.css` 에 이미 크기 계약(`--ad-min-h`/`--ad-max-h` · variant
  `.ad-slot--{top,after-trend,after-summary,early-body}`)을 갖고 있고 그 목록에 "sidebar"가
  없다(旣知 갭 — _프리셋초안/shell-sidebar/preset.jsonc §panels.ad_vertical.slot_binding
  「⚠️모듈 보강 후보#2」). 세트가 `.ad-slot` 을 겨냥해 크기를 대신 정하면 「모듈 결함을 세트가
  떠안고 다음 사이트로 전파」하는 구조가 되므로 여기 담지 않는다 — 모듈 보강 후보로만 보고
  (결과보고서 §범위 밖 발견). 이 파일에 남은 선택자는 전부 `.info-sidebar`/`.info-sidebar__panel`
  (셸이 만든 사이드바 «틀» 자체 — 어떤 모듈 클래스도 겨냥하지 않는다) 뿐이다.
*/
/* 🔴 2026-09-05 — margin-bottom:20px 을 «뺐다»(사용자: 「본문 하단 여백이 이중으로 돼 있어 크다」).
   실측 = 상자 안쪽 아래 여백 20px(--pad-box-inner) + 여기 20px = «40px» 이었다.
   아래를 «한 곳»에서만 준다 = 상자 자신(상단에서 이미 그렇게 정리했다).
   푸터는 자기 위 여백을 «따로» 갖는다(.site-footer-credit__band padding 28px) — 붙지 않는다.
   🔴 다시 넣지 마라. 넣으려면 상자 안쪽 아래 값을 그만큼 줄여야 한다. */
body.has-info-sidebar .site-content{display:flex;align-items:flex-start;column-gap:var(--layout-gap, 20px)}
body.has-info-sidebar .site-content .content-area{flex:1 1 auto;width:auto;min-width:0;overflow-x:hidden}
/* 🔴 2026-09-05 — 사이드바가 «맨 위에서도» 내려가던 원인과 처방(옛 처방 — 아래 2026-09-14 로 대체).
   원인   sticky 는 「자연 위치가 임계(top)보다 «위»에 있으면」 스크롤 0 에서도 «즉시» 밀어 내린다.
          자연 위치 = 헤더높이 H + 상단간격  ·  임계 = --chrome-h(96 폴백) + 16
          🔴 --chrome-h 를 «아무도 안 채워» 96 이 되면서 임계가 자연 위치보다 커졌다 → 밀렸다
          (진단 시험: --chrome-h 를 0 으로 넣자 어긋남이 «사라졌다» — 사용자 확인)
   처방(옛)  임계를 «자연 위치와 같은 식»으로 만든다 = 헤더높이 + «같은 상단간격 토큰»
          🔴 그러면 임계 ≤ 자연 위치가 되어 «맨 위에서 밀 수 없다»(정렬 불변)
          그리고 스크롤 중에는 헤더 아래 «그 간격만큼»에서 멈춘다(가림 방지 목적 보존)

   🔴 2026-09-14 셸3건 조 — 위 처방이 전제로 삼던 «헤더가 스크롤 중에도 화면 위에 계속 떠 있다»는
   조건 자체가 없어졌다(같은 회차 ①: core/presets/shell/_shared/shell-set-base.css 의 `.chrome`
   에서 position:sticky 를 뺐다 — 사용자 확정: 라이브처럼 헤더·메뉴는 고정하지 않는다).
   🔴 헤더가 스크롤로 화면 밖으로 사라지면 뷰포트 맨 위에서 헤더가 차지하는 공간은 «0»이 된다 —
   그러니 사이드바가 멈추는 자리(top)를 더는 헤더 높이(--chrome-h)에 걸어 잴 이유가 없다.
   🔴 라이브 실측(2026-09-14 · 시세.com 자체 라이브 · generatepress_child/style.css) —
   `@media(min-width:769px){.inside-right-sidebar{position:sticky;top:20px}}` 뿐이다.
   max-height·overflow 클램프는 라이브에 «없다»(사이드바가 뷰포트보다 길면 그냥 다 못 붙는다).
   🔴 값 창작 0 — «20px»는 라이브가 쓰는 값 그대로다. --chrome-h 의존을 없앤 것이라 이제
   ⚠️ 남은 조건(헤더 실제 높이를 맞혀야 한다)도 함께 없어진다(사이드바 쪽에서는).
   🔴 사이드바 자체를 «제자리에 스티키로 고정»하는 구조(2026-09-14 사용자 확정 유지)는 그대로 둔다
   — max-height·overflow:auto(내부 스크롤)도 우리 쪽 기존 설계라 남긴다. 바꾸는 것은 «기준점»뿐이다.
   자연 위치(헤더높이 + gap-below-menubar) ≥ 20px 는 어떤 헤더 높이에서도 항상 성립하므로
   맨 위에서 밀리는 옛 결함도 재발하지 않는다(공식으로 증명 — 헤더 높이를 몰라도 항상 안전하다). */
.info-sidebar{flex:0 0 var(--sidebar-w, 320px);width:var(--sidebar-w, 320px);margin:0;padding:0;position:sticky;top:20px;max-height:calc(100vh - 20px - 32px);overflow:auto}
/* 2026-09-04 사이드바재이식 조 — 위 §광고숨김 조의 ".link-grid 2열" 진단은 «오진»으로 철회한다.
   근거(재확인) = mc-sidebar.html 과 mc-sources-2tier.html 두 독립 라이브 실측 모두 실제 "TOP 인기
   글" 패널의 class 는 `.ilw-grid`(그 클래스는 body-fuel-home.html 의 다른 위젯에서만 씀 — 라이브
   대응물 오귀속)가 «아니라» `module-sidebar-links`(<ul><li> 단일 열 리스트 · grid-template-columns
   선언 자체가 CSS 전체에 0건)다. 즉 "2열로 접히는 문제"는 우리가 모두의카드 구조를 안 쓰고 우리
   own link-grid 모듈을 대신 넣어서(§1 결함 목록의 "2열 배열" 항목) 생긴 것이지, 모두의카드 쪽에
   열 수 설정이 있어서가 아니다 — 아래 .module-sidebar-links* 로 구조를 통째 교체하면 이 문제
   자체가 없어진다(고쳐지는 게 아니라 원인이 사라진다). 그래서 `.info-sidebar .link-grid{...}`
   규칙은 이제 대상이 없어 삭제한다(사이드바 안에서 link-grid 를 더 이상 쓰지 않는다).
   ⚠️ S4(사이드바 «열 수» 설정화)는 이 사실 때문에 대상이 없다 — module-sidebar-links 는 애초에
   grid 가 아니라 단일 열 <ul> 이므로 --cols-sidebar-links 를 만들면 어디에도 걸리지 않는 죽은
   변수가 된다(발명 0 원칙 위반). 결과보고서 §판단 분기에 그대로 보고. */
.info-sidebar__panel{background:var(--fill-surface, #fff);padding:var(--pad-box-inner, 20px);margin:0 0 20px;border:1px solid var(--border-neutral-strong, #CFD6E2);border-radius:10px;box-shadow:0 1px 4px rgba(15,23,42,.06)}
.info-sidebar__panel:last-child{margin-bottom:0}
.module-sidebar-links__title{font-size:20px;font-weight:400;line-height:1.5;color:var(--text-neutral,#222222);margin:0 0 16px;padding-bottom:8px;border-bottom:2px solid var(--fill-brand,#1e73be)}
@media(max-width:768px){
  body.has-info-sidebar .site-content{flex-direction:column;row-gap:20px}
  .info-sidebar{width:100%;flex-basis:auto;margin-top:0;position:static;max-height:none;overflow:visible}
  body.has-info-sidebar .site-content .content-area{width:100%;flex-basis:auto}
}

/* 2026-09-04 사이드바재이식 조 — .module-sidebar-links* «전 선택자» 통째 이식(문자 단위 · 값 재작성
   0). 출처 = _강화/_라이브정본/page-bundle.css L11741·L11754-11780(§S6 교차검증: --accent·--contrast·
   --contrast-2 는 page-bundle.css·mc-sidebar.html·mc-home.html·mc-sources-2tier.html 전체에 :root
   재정의가 «0건»이라 원문 폴백 값이 실제 렌더값 그대로다 — mc-sidebar.html 자체 주석(L31-37,
   "눈검수 38호"에서 이미 이 세 속성이 벤더 커스터마이저 블록 제거 후에도 무변화였다고 확인)이
   2차 독립 근거. 반면 --surf2 는 page-bundle.css L1116 에 실제 :root 정의(#EEF1F6)가 있어 원문
   국소 폴백 rgba(0,0,0,.04) 는 실제로 한 번도 렌더되지 않는 죽은 값이었다 — 폴백만 보고 옮겼으면
   오늘 벌어진 네 번째 오판이 됐을 자리. 변수명은 기존 번역 선례(--line2→--border-neutral-strong 등,
   L41 위)를 그대로 이어 우리 토큰명으로 옮기되 값은 위 실측값을 그대로 썼다(발명 0):
     --accent      → --fill-brand      (fallback #1e73be, 우리 :root --fill-brand 와 완전 일치)
     --contrast    → --text-neutral    (fallback #222222, 우리 :root --text-neutral 와 완전 일치)
     --contrast-2  → --text-neutral-weak (fallback #575760, 우리 :root --text-neutral-weak 와 완전 일치)
     --surf2       → --fill-surface-weak (fallback #EEF1F6 — 실제 라이브 값, 우리 :root
                      --fill-surface-weak 는 #F0F0F0 로 다른 값이지만 :root 가 항상 이기므로 실제
                      렌더는 우리 값 #F0F0F0 로 나간다 — 푸터 5토큰과 동일 패턴, 회귀 아님).
   icon/icon-slot/icon--photo/group 규칙은 이번 6항목 마크업에서 미사용이나(라이브 실측 두 표본
   모두 아이콘 0) "그 자손 전 선택자" 원칙에 따라 전부 가져온다(죽은 CSS 0 리스크보다 누락 리스크가
   더 크다는 이번 지시서 원칙). */
.module-sidebar-links ul{margin:0;padding:0;list-style:none}
.module-sidebar-links li{margin:0 0 16px}
.module-sidebar-links li:last-child{margin-bottom:0}
/* 2026-09-05 조A — «자주 찾는 시세» 범용 박스 토글(지시서 §4 ⓒ "토글 --popular-box-display
   1종 · 기본 켜짐"). 폴백 block = 현재 렌더 그대로(회귀 0) — 끄려면 site tokens.jsonc 의
   popular-box-display 값을 "none" 으로 바꾸면 된다. */
.module-sidebar-links{display:var(--popular-box-display, block);--sbl-label-fs:16px;--sbl-label-lh:1.4;--sbl-value-fs:15px;--sbl-value-lh:1.4;--sbl-text-gap:4px;--sbl-icon-size:calc((var(--sbl-label-fs) * var(--sbl-label-lh) + var(--sbl-text-gap) + var(--sbl-value-fs) * var(--sbl-value-lh)) * 0.82)}
.module-sidebar-links a{display:flex;align-items:center;gap:16px;padding:8px;margin:0 -8px;border-radius:8px;text-decoration:none;color:inherit;position:relative}
.module-sidebar-links a:hover,.module-sidebar-links a:focus-visible{background:var(--fill-surface-weak,#EEF1F6)}
.module-sidebar-links a::after{content:"→";position:absolute;right:10px;top:50%;transform:translate(4px,-50%);opacity:0;transition:opacity .15s,transform .15s;color:var(--fill-brand,#1e73be)}
.module-sidebar-links a:hover::after,.module-sidebar-links a:focus-visible::after{opacity:1;transform:translate(0,-50%)}
.module-sidebar-links__icon-slot{flex:0 0 var(--sbl-icon-size);width:var(--sbl-icon-size);height:var(--sbl-icon-size);display:flex;align-items:center;justify-content:center}
.module-sidebar-links__icon{width:var(--sbl-icon-size);height:var(--sbl-icon-size)}
.module-sidebar-links__text{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:var(--sbl-text-gap);padding-right:16px}
.module-sidebar-links__label{font-size:var(--sbl-label-fs);font-weight:700;line-height:var(--sbl-label-lh);color:var(--text-neutral,#222222)}
.module-sidebar-links a:hover .module-sidebar-links__label,.module-sidebar-links a:focus-visible .module-sidebar-links__label{color:var(--fill-brand,#1e73be)}
.module-sidebar-links__value{font-size:var(--sbl-value-fs);line-height:var(--sbl-value-lh);color:var(--text-neutral-weak,#575760)}
.module-sidebar-links__group{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--text-neutral-weak,#575760);margin:16px 0 8px}
.module-sidebar-links__group:first-child{margin-top:0}
.module-sidebar-links__icon--photo{width:calc(var(--sbl-icon-size) * 0.7270);height:var(--sbl-icon-size);object-fit:contain;border-radius:4px}
/* 2026-11-08 조 FE — 제목만 행(부가 설명 칸 __value 가 비었거나 없는 행)은 촘촘하게 = 기본값(추가 규칙 · 위 기존 규칙은 그대로).
   부가 설명 칸 = __value 하나뿐(__group 은 묶음 표제 · __icon 은 그림이라 설명 아님). 글자가 있는 행은 위 규칙 그대로.
   행 위아래 여백 합 32px(li 16 + a 8+8) → 20px(li 6 + a 7+7) = 약 38% 축소 · 행 높이 36.4px(누름 영역 ≥36px) · 빈 값 칸은 그리지 않아 칸 사이 틈(4px)도 없앰 */
.module-sidebar-links li:not(:has(.module-sidebar-links__value:not(:empty))){margin-bottom:6px}
.module-sidebar-links li:not(:has(.module-sidebar-links__value:not(:empty))):last-child{margin-bottom:0}
.module-sidebar-links li:not(:has(.module-sidebar-links__value:not(:empty))) a{padding-top:7px;padding-bottom:7px}
.module-sidebar-links li:not(:has(.module-sidebar-links__value:not(:empty))) .module-sidebar-links__value{display:none}

/* 2026-09-04 사이드바배선 조 신설 — .info-sidebar__panel 안 "패널 내용" 프레임 클래스 3종.
   info-sidebar.html 머리 주석 §① 근거와 동일: 그룹 표제는 module.jsonc(link-grid)가 스스로
   "조립 선언 소관"이라 명시한 자리라 모듈 밑동(.link-grid*)이 아니라 이 셸 프레임 밑동
   (.info-sidebar__*)에 둔다(§10-1 자기 밑동만 건드린다 — link-grid/style.css 는 원문 그대로,
   한 글자도 고치지 않았다). 값 출처는 발명 0 — 아래 3규칙 전부 이미 이 파일 §.info-sidebar__panel
   (L29)이 쓰는 토큰(--border-neutral-strong 등)과 shell.css 공통 타이포 눈금만 재사용한다. */
.info-sidebar__panel-title{margin:0 0 12px;font-size:16px;font-weight:800;color:var(--ink, #0F172A)}
.info-sidebar__group-title{margin:16px 0 4px;font-size:13px;font-weight:700;color:var(--mut, #64748B)}
.info-sidebar__group-title:first-of-type{margin-top:0}

/* 광고 자리표시자(§②) — ad-slot 모듈(.ad-slot)과 이름 충돌 0(다른 클래스). 광고 코드 0줄·
   client_id·ad_slot 미기재(애드센스 승인 전 · 사용자 확정) — 높이만 잠가 레이아웃 시프트를
   막는 "자리"다. 250px = ad-slot.module.jsonc 의 top 외 3슬롯 공통 min_h 값(旣知 표, shell-set.css
   §광고 모듈 겨냥 회피 근거와 같은 실측 원문)과 동일 눈금을 그대로 재사용(발명 0). */
/* 2026-09-04 광고숨김 조 — 사용자 확정("애드센스 승인 전 빈 상자를 표시할 필요 없다")에 따라
   기본값을 «숨김»으로 바꾼다. 기존 --search-display 선례(../_shared/shell-set-base.css
   `.chrome .search-pill{display:var(--search-display, flex)}` · sites/sise/tokens.jsonc
   raw.search-display)를 그대로 따라 새 계열을 만들지 않고 같은 var+폴백 형식만 이었다.
   .info-sidebar__panel(margin:0 0 20px)과 겹친 이 요소가 display:none 이 되면 박스 자체가
   레이아웃에서 빠져 margin 도 함께 사라진다(여백 0 — A1 "빈 상자·여백 0" 판정식). 승인 후에는
   sites/{site}/tokens.jsonc 의 raw.ad-display 값 하나만 "flex" 로 바꾸면 켜진다(마크업 재작성 0). */
.info-sidebar__ad-slot{display:var(--ad-display, none);align-items:center;justify-content:center;min-height:250px;background:var(--fill-muted, #F1F5F9);border-style:dashed}
.info-sidebar__ad-slot-label{font-size:13px;color:var(--mut, #64748B)}

/* ── 2026-11-04 조 T — 셸 간격 = 완성본 tcggrail.com 라이브 계산값(지휘자 결정 ⑥ · 조 N 실측 crewN/gaps-before.jsonl · 1280 = 머리 아래→빵부스러기 40 · 빵부스러기 아래→H1 50 / 360 = 34 · 36)
   원인 셋(조 N 보고): ①머리 아래 회색 30px(tcggrail 20px) ②흰 상자 위 안쪽 20px(tcggrail 40px · 820px 이하 30px) ③768px 이하 빵부스러기 −20/20 이 이김(tcggrail −16/16)
   시세(같은 세트)는 ①②를 자기 shell.css·tokens 에 같은 값으로 이미 둠 → 바뀌는 것 = ③ 768px 이하 빵부스러기 4px(영향 표 crewT/_세트여백-영향표.tsv) · 되돌리기 = 이 절 지우기(이 파일 1개) */
:root{--gap-below-menubar:20px}
.separate-containers .inside-article{padding-top:40px}
@media(max-width:820px){.separate-containers .inside-article{padding-top:30px}}
@media(max-width:768px){.separate-containers .module-breadcrumb{margin-top:-16px;margin-bottom:16px}}   /* 선택자 한 단계 위 = 뒤에 실리는 범용 breadcrumb 모듈 −20/20 규칙(같은 세기)을 이김 */

/* 2026-11-04 조 W — 메뉴 아래 흐르는 글자 띠 규칙 전부 걷어냄(사용자 «흐르는 시세판은 삭제») · 메뉴 아래 전체 너비 자리는 사이트 셸 조각이 비워 둠 */

/* ── 2026-11-04 조 T — 머리 오른쪽 글자 배너(라이브 728×90 그림 배너 자리 · 그림 속 글자 0 · 값 없는 사이트 = 출력 0) · 920px 이하 = 숨김(메뉴 단추만 남는 폭 · 같은 링크는 띠 항목이 흡수) */
/* 2026-11-04 지휘자 — 사용자 «border-radius: 10px; - 0px로» · «헤더 세로 영역이 더 커졌어 … 기존 세로 영역 안에서» · «호버 시 언더라인 생성되지 않도록» · «padding: 14px 26px; 이것도 축소» → 배너 높이 ≤ 로고 높이(36px) · 모서리 0 · 밑줄 0 */
.chrome .chrome-promo{margin-left:auto;flex:0 1 auto;min-width:0;align-self:center}
/* 11-04 AA(사용자 «헤더 세로 길이 길어지지 않도록 … 오른쪽 텍스트 배너를 더 키워 … 패딩 늘려 … 테두리 1px»): 배너를 키운 만큼 위아래 음수 바깥 여백으로 헤더 높이(78px)를 그대로 둔다 */
.chrome .chrome-promo{margin-block:-8px}
.chrome .chrome-promo__link{display:inline-flex;align-items:baseline;gap:10px;padding:10px 20px;border:1px solid var(--line-dark, #e5e7eb);border-radius:0;background:#fff;text-decoration:none;white-space:nowrap;line-height:1.2;box-sizing:border-box}
.chrome .chrome-promo__lead{font-size:20px;font-weight:800;color:var(--text-neutral, #222)}
.chrome .chrome-promo__query{font-size:22px;font-weight:900;font-style:italic;color:var(--fill-accent, #d0242b)}
.chrome .chrome-promo__link:hover,.chrome .chrome-promo__link:focus-visible{border-color:var(--fill-accent, #d0242b);text-decoration:none}
.chrome .chrome-promo__link:hover *,.chrome .chrome-promo__link:focus-visible *{text-decoration:none}
@media(max-width:1100px){.chrome .chrome-promo{margin-block:-4px}.chrome .chrome-promo__lead{font-size:18px}.chrome .chrome-promo__query{font-size:20px}.chrome .chrome-promo__link{padding:8px 16px}}
@media(max-width:920px){.chrome .chrome-promo{display:none}}

/* 조 AH 11-04 (사용자 «사이드바 광고 = 세로로 긴 직사각형 · 사이드바 폭과 안 맞으면 좌우 가운데») — 사이드바 광고 칸 범용 기준(모양만 · 광고 단위 값은 사이트 몫).
   구글 공식 «반응형 광고 코드 수정»(support.google.com/adsense/answer/9183363) = 광고 코드 속성은 그대로 두고 «감싸는 칸»의 너비로 크기를 정하는 방식만 쓴다.
   칸 안쪽이 300px 이상이면 300×600 · 미만이면 160×600 · 칸 안에서 가로 가운데. 칸 좌우 안쪽 여백은 0(가운데 기준을 칸 전체 폭으로). */
.info-sidebar__panel:has(.module-ad-slot){padding-left:0;padding-right:0;container-type:inline-size;display:flex;flex-direction:column;align-items:center}
.info-sidebar .module-ad-slot{width:100%;margin:0 auto;text-align:center;display:flex;flex-direction:column;align-items:center}
.info-sidebar .module-ad-slot ins.adsbygoogle{display:block;width:300px;max-width:100%;min-height:600px;margin:0 auto}
@container (max-width:299px){.info-sidebar .module-ad-slot ins.adsbygoogle{width:160px}}

/* core/presets/shell/_shared/footer-color/deep-navy.css */
/* core/presets/shell/_shared/footer-color/deep-navy.css — 푸터 색 프리셋 «deep-navy»(짙은 남색)
   (2026-09-14 푸터색프리셋 조 신설 · 사용자 지시 "푸터 프리셋 «색» 기준으로 «명칭»을 정해서 해"
   · "짙은 남색이 디폴트야").

   출처 = 발명 0 — sites/sise/tokens.jsonc:79-83 라이브 실측값을 문자 그대로 옮겼다(그 파일
   자체 주석 = "실측(style.css L500/518/561 …)" 등 — 저 값이 이 저장소 안에서 «짙은 남색»이
   가리키는 유일한 실체다). 이 파일이 core/build/assemble-bundle.mjs loadShellSetCss() 의
   기본 프리셋이다(sites/{site}/shell/shell-set.jsonc 에 "footer_color" 키가 없을 때).

   🔴 sise 는 tokens.jsonc 에 아래와 «같은 리터럴»을 이미 직접 선언해 두고 있어(라우트마다
   :root 로 구워짐 — loadTokensCssBlock), 이 프리셋 블록(shellSetCss, tokensCss 뒤에 실림)이
   같은 값으로 한 번 더 선언해도 최종 렌더 색은 바뀌지 않는다(같은 값 재확인 — 산출 무변화). */
:root {
  --fill-footer: #1e293b;        /* 밴드·컬럼·하단줄 — sites/sise/tokens.jsonc:79 footer-bg */
  --fill-footer-strong: #0f172a; /* 3단바(카피라이트 바) — sites/sise/tokens.jsonc:80 footer-bg2 */
  --text-footer: #cbd5e1;        /* 링크 — sites/sise/tokens.jsonc:81 footer-ink */
  --text-footer-mute: #94a3b8;   /* 태그라인·카피 — sites/sise/tokens.jsonc:82 footer-mut */
  --text-footer-faint: #64748b;  /* 법정고지 — sites/sise/tokens.jsonc:83 footer-faint */
}

/* core/modules/display/page-header/style.css */

@media (prefers-reduced-motion: reduce) {
}
@media (max-width: 768px) {
}
.module-page-header__bg-gradient-red {
    background: linear-gradient(135deg, #ef4444, #dc2626) !important;
    color: white !important;
}
.module-page-header__bg-gradient-blue {
    background: linear-gradient(135deg, #3b82f6, #1e40af) !important;
    color: white !important;
}
.module-page-header__bg-gradient-green {
    background: linear-gradient(135deg, #1e7e34, #155d27) !important;
    color: white !important;
}
.module-page-header__bg-gradient-purple {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    color: white !important;
}
.module-page-header__bg-gradient-orange {
    background: linear-gradient(135deg, #ff8c42, #ff6b1a) !important;
    color: white !important;
}
.module-page-header__bg-gradient-yellow {
    background: linear-gradient(135deg, #eab308, #a16207) !important;
    color: white !important;
}
.module-page-header__bg-gradient-rose {
    background: linear-gradient(135deg, #e11d48, #be123c) !important;
    color: white !important;
}
.module-page-header__bg-gradient-gray {
    background: linear-gradient(135deg, #6b7280, #374151) !important;
    color: white !important;
}
.module-page-header__bg-gradient-mint {
    background: linear-gradient(135deg, #10b981, #059669) !important;
    color: white !important;
}
.module-page-header__bg-gradient-teal {
    background: linear-gradient(135deg, #14b8a6, #0d9488) !important;
    color: white !important;
}
.module-page-header__bg-gradient-gold {
    background: linear-gradient(135deg, #f5d742, #d4af37) !important;
    color: #5d4e0f !important;
}
.module-page-header__bg-gradient-silver {
    background: linear-gradient(135deg, #e8e8e8, #a0a0a0) !important;
    color: #333 !important;
}
.module-page-header__bg-gradient-pink {
    background: linear-gradient(135deg, #ec4899, #db2777) !important;
    color: white !important;
}
.module-page-header__bg-gradient-indigo {
    background: linear-gradient(135deg, #6366f1, #4338ca) !important;
    color: white !important;
}
.module-page-header__bg-gradient-violet {
    background: linear-gradient(135deg, #8b5cf6, #6d28d9) !important;
    color: white !important;
}
.module-page-header__bg-gradient-cyan {
    background: linear-gradient(135deg, #06b6d4, #0891b2) !important;
    color: white !important;
}
.module-page-header__bg-gradient-brown {
    background: linear-gradient(135deg, #a0522d, #8b4513) !important;
    color: white !important;
}
@media (prefers-reduced-motion: reduce) {
.module-page-header__step-card, .module-page-header {
        transition: none !important;
    }
}
.module-page-header__type-signature {display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin-bottom:12px;
  padding:11px 13px;border-radius:var(--r-s);background:var(--surf2);border:1px dashed var(--line2)}
.module-page-header__type-chip {flex:0 0 auto;font-size:13px;font-weight:800;padding:3px 11px;border-radius:999px;
  background:var(--acc);color:#fff;letter-spacing:-.01em}
.module-page-header__type-signature-width {flex:1 1 240px;min-width:0;font-size:15px;color:var(--ink2)}
.module-page-header__type-signature-width b {color:var(--ink);font-weight:800}
.module-page-header__type-signature-content {flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;font-size:14px;
  font-weight:800;color:var(--acc-i);text-decoration:none}
.module-page-header__type-signature-content i {display:grid;place-items:center;width:19px;height:19px;border-radius:50%;
  background:var(--acc-s);font-style:normal;font-size:13px;font-weight:800;line-height:1;
  transition:transform .13s,background .13s,color .13s}
.module-page-header__type-signature-content:hover i {background:var(--acc);color:#fff;transform:translateX(2px)}
.module-page-header__type-signature { display:flex; align-items:center; gap:11px; flex-wrap:wrap; margin-bottom:12px; padding:11px 13px; border-radius:var(--r-s); background:var(--surf2); border:1px dashed var(--line2); }
.module-page-header__type-chip { flex:0 0 auto; font-size:13px; font-weight:800; padding:3px 11px; border-radius:999px; background:var(--acc); color:#fff; letter-spacing:-.01em; }
.module-page-header__type-signature-width { flex:1 1 240px; min-width:0; font-size:15px; color:var(--ink2); }
.module-page-header__type-signature-width b { color:var(--ink); font-weight:800; }
.module-page-header__type-signature-content { flex:0 0 auto; display:inline-flex; align-items:center; gap:7px; font-size:14px; font-weight:800; color:var(--acc-i); text-decoration:none; }
.module-page-header__type-signature-content i { display:grid; place-items:center; width:19px; height:19px; border-radius:50%; background:var(--acc-s); font-style:normal; font-size:13px; font-weight:800; line-height:1; transition:transform .13s,background .13s,color .13s; }
.module-page-header__type-signature-content:hover i { background:var(--acc); color:#fff; transform:translateX(2px); }
.module-page-header {
    padding: 30px 15px;
    color: #ffffff;
    border-radius: 8px;
    margin-bottom: 40px;
    text-align: center;
    transition: all 0.3s ease;
}
.module-page-header p { margin-bottom: 0 !important; }
.module-page-header__title {
    font-size: 36px;
    font-weight: 700;
    line-height: 1.1;
    margin-bottom: 10px;
    color: #ffffff;
}
.module-page-header__intro {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    opacity: 0.9;
    color: #ffffff;
}
.module-page-header__info {
    background: rgba(255, 255, 255, 0.2);
    padding: 12px 20px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 1.1em;
    margin-top: 12px;
    margin-bottom: 0;
    color: #ffffff;
}
.module-page-header a, .module-page-header__title a, .module-page-header__intro a, .module-page-header__info a {
    color: #ffffff !important;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1px;
    transition: opacity 0.2s ease;
}
.module-page-header a:hover, .module-page-header__title a:hover, .module-page-header__intro a:hover, .module-page-header__info a:hover {
    color: #ffffff !important;
    opacity: 0.85;
    text-decoration-thickness: 2px;
}
.module-page-header a:visited, .module-page-header__intro a:visited, .module-page-header__info a:visited {
    color: #ffffff !important;
}
.module-page-header strong, .module-page-header em, .module-page-header span, .module-page-header b, .module-page-header i, .module-page-header__intro strong, .module-page-header__intro em, .module-page-header__intro span, .module-page-header__info strong, .module-page-header__info em, .module-page-header__info span {
    color: #ffffff;
}
@media (max-width: 768px) {
.module-page-header { padding: 20px 15px; }
.module-page-header__title { font-size: 24px; }
.module-page-header__info { font-size: 1em; }
}
.module-page-header__bg-gradient-red { background: linear-gradient(135deg, #ef4444, #dc2626); color: #ffffff; }
.module-page-header__bg-gradient-blue { background: linear-gradient(135deg, #3b82f6, #1e40af); color: #ffffff; }
.module-page-header__bg-gradient-green { background: linear-gradient(135deg, #1e7e34, #155d27); color: #ffffff; }
.module-page-header__bg-gradient-purple { background: linear-gradient(135deg, #667eea, #764ba2); color: #ffffff; }
.module-page-header__bg-gradient-orange { background: linear-gradient(135deg, #ff8c42, #ff6b1a); color: #ffffff; }
.module-page-header__bg-gradient-yellow { background: linear-gradient(135deg, #eab308, #a16207); color: #ffffff; }
.module-page-header__bg-gradient-rose { background: linear-gradient(135deg, #e11d48, #be123c); color: #ffffff; }
.module-page-header__bg-gradient-gray { background: linear-gradient(135deg, #6b7280, #374151); color: #ffffff; }
.module-page-header__bg-gradient-mint { background: linear-gradient(135deg, #10b981, #059669); color: #ffffff; }
.module-page-header__bg-gradient-teal { background: linear-gradient(135deg, #14b8a6, #0d9488); color: #ffffff; }
.module-page-header__bg-gradient-gold { background: linear-gradient(135deg, #f5d742, #d4af37); color: #5d4e0f; }
.module-page-header__bg-gradient-silver { background: linear-gradient(135deg, #e8e8e8, #a0a0a0); color: #333333; }
.module-page-header__bg-gradient-pink { background: linear-gradient(135deg, #ec4899, #db2777); color: #ffffff; }
.module-page-header__bg-gradient-indigo { background: linear-gradient(135deg, #6366f1, #4338ca); color: #ffffff; }
.module-page-header__bg-gradient-violet { background: linear-gradient(135deg, #8b5cf6, #6d28d9); color: #ffffff; }
.module-page-header__bg-gradient-cyan { background: linear-gradient(135deg, #06b6d4, #0891b2); color: #ffffff; }
.module-page-header__bg-gradient-brown { background: linear-gradient(135deg, #a0522d, #8b4513); color: #ffffff; }
.module-page-header__briefing > *:last-child, .module-page-header__briefing-body > *:last-child, .module-page-header__info-box > *:last-child, .module-page-header__faq-a > *:last-child, .module-page-header__key-facts-core-text > *:last-child, .module-page-header__quick-answer-content > *:last-child, .module-page-header__answer-first > *:last-child, .module-page-header__answer-first-answer > *:last-child, .module-page-header__highlight > *:last-child, .module-page-header > *:last-child {
    margin-bottom: 0;
}

/* hand-fix:page-header:행 링크 호버 */
/* ── 행 전체 링크의 호버 효과 (2026-09-08 사용자 요청) ── */
.module-page-header__type-signature[href] { text-decoration: none; transition: background .16s ease, box-shadow .16s ease, transform .16s ease; }
.module-page-header__type-signature[href]:hover { background: var(--acc-s, #eff6ff); box-shadow: inset 0 0 0 1px var(--acc, #3b82f6); transform: translateY(-1px); }
.module-page-header__type-signature[href]:hover .module-page-header__type-signature-content { text-decoration: underline; text-underline-offset: 3px; }
.module-page-header__type-signature[href]:focus-visible { outline: 2px solid var(--acc, #3b82f6); outline-offset: 2px; }

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-page-header--lt { margin-bottom: 24px; }
  .module-page-header--lt h2 { font-size: 24px; font-weight: 700; color: #1e293b; margin: 0 0 8px 0; }
  .module-page-header--tier, .module-page-header__content .module-page-header--tier { font-size: 18px; font-weight: 700; color: #1e293b; margin: 28px 0 12px; padding: 10px 16px; background: linear-gradient(135deg, #f0f9ff, #e0f2fe); border-radius: 8px; border-left: 4px solid #3b82f6; }
@media (max-width: 640px) {
  .module-page-header--tier, .module-page-header__content .module-page-header--tier { font-size: 16px; padding: 8px 12px; }
}
/* ── 동기화 블록 끝 (sync-live) ── */

/* core/modules/display/breadcrumb/style.css */

@media (max-width: 768px) {
}
.module-breadcrumb {
    margin: -20px 0 20px;
    padding: 0;
    font-size: 14px;
    line-height: 1.5;
    color: #6b7280;
}
.module-breadcrumb__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}
.module-breadcrumb__item {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 0;
}
.module-breadcrumb__link {
    color: #1e40af;
    text-decoration: none;
    transition: color 0.2s ease;
}
.module-breadcrumb__link:hover {
    color: #1e3a8a;
    text-decoration: underline;
}
.module-breadcrumb__current {
    color: #111827;
    font-weight: 600;
}
.module-breadcrumb__separator {
    margin: 0 8px;
    color: #9ca3af;
    font-size: 16px;
    line-height: 1;
}
@media (max-width: 768px) {
.module-breadcrumb { font-size: 13px; margin-bottom: 16px; margin-top: -16px; }
.module-breadcrumb__separator { margin: 0 6px; }
}


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
@media (max-width: 768px) {
  .module-breadcrumb { font-size: 13px; margin-bottom: 16px; margin-top: -16px; }   /* modules.css:6169 */
  .module-breadcrumb__separator { margin: 0 6px; }   /* modules.css:6170 */
}
.module-breadcrumb { margin: -20px 0 20px; padding: 0; font-size: 14px; line-height: 1.5; color: #6b7280; }   /* modules.css:6122 */
.module-breadcrumb__list { display: flex; flex-wrap: wrap; align-items: center; gap: 0; margin: 0; padding: 0; list-style: none; }   /* modules.css:6133 */
.module-breadcrumb__item { display: inline-flex; align-items: center; margin: 0; padding: 0; }   /* modules.css:6142 */
.module-breadcrumb__link { color: #1e40af; text-decoration: none; transition: color 0.2s ease; }   /* modules.css:6148 */
.module-breadcrumb__link:hover { color: #1e3a8a; text-decoration: underline; }   /* modules.css:6153 */
.module-breadcrumb__current { color: #111827; font-weight: 600; }   /* modules.css:6157 */
.module-breadcrumb__separator { margin: 0 8px; color: #9ca3af; font-size: 16px; line-height: 1; }   /* modules.css:6161 */

/* core/modules/display/answer-first/style.css */

.module-answer-first__briefing > *:last-child, .module-answer-first__briefing-body > *:last-child, .module-answer-first__info-box > *:last-child, .module-answer-first__faq-a > *:last-child, .module-answer-first__key-facts-core-text > *:last-child, .module-answer-first__quick-content > *:last-child, .module-answer-first > *:last-child, .module-answer-first__answer > *:last-child, .module-answer-first__highlight > *:last-child, .module-answer-first__page-header > *:last-child {
    margin-bottom: 0;
}
.module-answer-first {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border: 1px solid #7dd3fc;
    border-radius: 12px;
    padding: 24px 28px;
    margin-bottom: 24px;
}
/* HAR조 2026-09-27 테두리 한 겹 — 수치 카드(metric)를 품을 때만 겉틀 선 0(수치 카드 테두리가 한 겹) · 구획 = 하늘색 그러데이션 바탕 */
.module-answer-first:has(.module-answer-first__metric) { border-color: transparent; }
.module-answer-first__question {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0c4a6e;
    margin: 0 0 12px 0;
    line-height: 1.4;
}
.module-answer-first__answer {
    font-size: 1.05rem;
    color: #1e293b;
    line-height: 1.7;
    margin: 0 0 8px 0;
}
.module-answer-first__answer p { margin: 0 0 8px 0; }
.module-answer-first__answer p:last-child { margin-bottom: 0; }
/* JWAF 2026-10-05 즉답 상자 안 목록 = 상자 안쪽 여백이 이미 있으니 번호(점) 폭만큼만 들여쓴다(브라우저 기본 40px 이중 들여쓰기 제거) */
.module-answer-first__answer ol, .module-answer-first__answer ul { padding-left: 1.3em; margin-left: 0; }
.module-answer-first__source {
    font-size: 14px;
    color: #64748b;
    margin: 12px 0 0 0;
    font-style: italic;
}

/* ── metrics(2026-09-14 F-96 복원) — 자기완결 칸형 목록. 값 창작 0(라이브 원본 부재 —
   §3-3 자기 클래스 밑동으로만 새로 세운 시각. 팔레트는 이 모듈 자체 배경(#f0f9ff/#e0f2fe/#7dd3fc)과
   맞춘다). 앵커 없는 항목은 <a href> 가 없어 브라우저가 자동으로 비클릭 처리한다(추가 상태분기 0). */
.module-answer-first__metrics {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 4px 0 8px 0;
}
.module-answer-first__metric {
    display: flex;
    flex-direction: column;
    gap: 2px;
    background: #ffffff;
    border: 1px solid #bae6fd;
    border-radius: 8px;
    padding: 8px 12px;
    text-decoration: none;
    color: inherit;
    min-width: 108px;
}
.module-answer-first__metric[href] {
    cursor: pointer;
}
.module-answer-first__metric[href]:hover,
.module-answer-first__metric[href]:focus-visible {
    border-color: #7dd3fc;
    background: #f0f9ff;
}
.module-answer-first__metric--lead {
    border-color: #7dd3fc;
    background: #f0f9ff;
}
.module-answer-first__metric-key {
    font-size: 13px;
    color: #64748b;
    font-weight: 600;
}
.module-answer-first__metric-value {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0c4a6e;
}
.module-answer-first__metric--lead .module-answer-first__metric-value {
    font-size: 1.2rem;
}
.module-answer-first__metric-unit {
    font-size: 13px;
    font-weight: 500;
    color: #0c4a6e;
}
.module-answer-first__metric-note {
    font-size: 14px;
    color: #64748b;
}

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-answer-first__table { margin-top: 16px; border-radius: 8px; overflow: hidden; }
/* ── 동기화 블록 끝 (sync-live) ── */

/* core/modules/display/app-layer/style.css */

@media (max-width:820px) {
}
@media (max-width:1180px) {
}
@media (max-width:620px) {
}
.module-app-layer__composition-donut-stat-cell { display:flex; flex-direction:column; gap:3px; padding:11px 12px 9px; border:1px solid var(--line2); border-radius:var(--r-s); background:var(--surf); border-left:1px solid var(--line); }
@media (max-width:900px) {
}
@media (max-width:520px) {
}
a.module-app-layer__meta-tile:hover::after, a.module-app-layer__meta-tile:focus-visible::after { opacity: 1; color: #fff; transform: translateY(2px); background: var(--acc); }
@media (max-width:1060px) {
}
@media (max-width:560px) {
}
.module-app-layer__quick-fact-card { display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:10px; row-gap:1px; align-items:center; padding:11px 12px; border:1px solid var(--line2); border-radius:var(--r-s); background:var(--surf); text-decoration:none; color:inherit; transition:transform .12s,border-color .12s; position:relative; border-left:3px solid var(--acc); }
.module-app-layer__quick-fact-card:hover { transform:translateY(-1.5px); border-color:var(--acc); background:var(--acc-s); }
.module-app-layer__quick-fact-icon { grid-column:1; grid-row:1/span 3; align-self:center; min-width: 0; width:38px; height:38px; border-radius:11px; display:grid; place-items:center; flex:0 0 auto; background:var(--acc-s); color:var(--acc-i); }

.module-app-layer__quick-fact-key { grid-column:2; grid-row:1; font-size:13px; color:var(--mut); font-weight:700; white-space:normal; overflow:visible; text-overflow:clip; word-break:keep-all; overflow-wrap:anywhere; padding-right:22px; } /* HCU 09-29 · 말줄임 → 줄바꿈(뒤 1176 줄과 같게) */
.module-app-layer__versus-compare-panel { display:grid; text-decoration:none; color:inherit; padding:11px 12px; border:1px solid var(--line2); border-radius:var(--r-s); background:var(--surf); position:relative; padding-right:30px; grid-template-columns:minmax(180px,1fr)auto minmax(180px,1fr); gap:14px; align-items:center; margin-bottom:12px; }
.module-app-layer__primary-action-button { display:flex; align-items:center; justify-content:center; gap:9px; text-decoration:none; padding:12px; border-radius:var(--r-s); background:var(--acc); color:#fff; font-weight:800; font-size:14px; margin-top:12px; cursor: pointer; transition: background .13s, transform .13s; }

a.module-app-layer__meta-tile:hover::after, a.module-app-layer__meta-tile:focus-visible::after {
  background: var(--acc); color: var(--acc-i); opacity: 1; transform: translateY(2px);
}
@media (max-width:820px) {
}
@media (max-width:520px) {
}
@media (max-width:820px) {
}
@media (max-width:820px) {
}
@media (max-width:820px) {
}
@media (max-width:820px) {
}

.module-app-layer__attribute-distribution-track { height:9px; border-radius:5px; background:var(--surf2); overflow:hidden; border:1px solid var(--line); grid-column:1/-1; display:flex; }
.module-app-layer__attribute-distribution-bar-fill { display:block; height:100%; border-radius:5px; background:var(--acc); transform-origin:left center; animation:none; animation-play-state:paused; width:var(--w); }
@media (max-width:560px) {

}
@media (max-width:1080px) and (min-width:521px) {
}
@media (max-width:960px) {
}
a.module-app-layer__attribute-chip-link:focus-visible { outline:2px solid var(--acc); outline-offset:2px; border-color:var(--acc); color:var(--acc-i); }
@media (max-width: 620px) {
}
@media (prefers-reduced-motion:no-preference) {
}
@media (prefers-reduced-motion:no-preference) and (scripting:none) {
}
.module-app-layer__panel { position: relative; padding: 17px 16px 18px; border: 1.5px solid var(--acc); border-radius: var(--r); background: linear-gradient(180deg,var(--acc-s) 0%,transparent 42%); margin-bottom:16px; }
.module-app-layer__attribute-chip-link { font-size: 13px; font-weight: 700; padding: 3px 8px; border-radius: 5px; background: var(--surf2); color: var(--ink2); border: 1px solid var(--line2); display:inline-block; align-items:center; gap:6px; letter-spacing:-.01em; line-height:1.35; transition:transform .13s ease,box-shadow .13s ease; }

a.module-app-layer__meta-tile::after { content: "↓"; position: absolute; top: 8px; right: 9px; font-size: 13px; font-weight: 800; color: var(--mut); opacity: .45; transition: opacity .13s,transform .13s,color .13s; display:grid; place-items:center; width:19px; height:19px; border-radius:50%; background:var(--acc-s); line-height:1; }

.module-app-layer__quick-fact-range { grid-column: 2; grid-row: 3; font-size: 13px; color: var(--mut); font-weight: 600; white-space: normal; overflow: visible; text-overflow: clip; word-break:keep-all; overflow-wrap:anywhere; line-height:1.4; } /* HCU 09-29 · 말줄임 → 줄바꿈(뒤 1197 줄과 같게) */


@media (prefers-reduced-motion:reduce) {
}




@media (prefers-reduced-motion:reduce) {
}






@media (max-width:1180px) {
}
@media (max-width:1080px) and (min-width:521px) {
}
@media (max-width:1060px) {
}
@media (max-width:1000px) {
}
@media (max-width:960px) {
}
@media (max-width:900px) {
}
@media (max-width:860px) {
}
@media (max-width:820px) {
}
@media (max-width:760px) {
}
@media (max-width:720px) {
}
@media (max-width:640px) {
}
@media (max-width:620px) {
}
@media (max-width:560px) {
}
@media (max-width:520px) {


}
@media (prefers-reduced-motion:no-preference) {
}
@media (prefers-reduced-motion:reduce) {


}
@media (scripting:none) {
}


@media (max-width:560px) {

}
@media (max-width:720px) {
}
.module-app-layer__cross-axis-summary-link::after { content: "→"; position: absolute; right: 12px; bottom: 12px; font-size: 13px; font-weight: 800; line-height: 1; color: var(--acc-i); opacity: 1; transition: opacity .15s, transform .15s; pointer-events: none; display: grid; place-items: center; width: 19px; height: 19px; border-radius: 999px; background: var(--acc-s); }
.module-app-layer__cross-axis-summary-link:hover::after, .module-app-layer__cross-axis-summary-link:focus-visible::after { opacity: 1; transform: translateX(2px); background: var(--acc); color: #fff; }
.module-app-layer__cross-axis-summary-link::after {
  display: grid; place-items: center; width: 19px; height: 19px; border-radius: 999px; background: var(--acc-s); color: var(--acc-i); opacity: .55; content: "\2192"; position: absolute; right: 12px; bottom: 12px; font-size: 13px; font-weight: 800; line-height: 1; transition: opacity .15s, transform .15s; pointer-events: none;
}
.module-app-layer__cross-axis-summary-link:hover::after, .module-app-layer__cross-axis-summary-link:focus-visible::after { background: var(--acc); color: #fff; opacity: 1; transform: translateX(2px); }
@media (min-width:721px) {
.module-app-layer__composition-donut-ring-box:not(:has(.module-app-layer__composition-donut-stat-panel)) > .module-app-layer__composition-donut-legend { min-width: 0; align-self: center; }
}
.u-tabular-number {
  font-variant-numeric: tabular-nums;
}
.u-value-direction-rising {
  color: var(--up);
}
.u-value-direction-falling {
  color: var(--dn);
}
.module-app-layer__panel {
  position: relative;
  padding: 17px 16px 18px;
  border: 1.5px solid var(--acc);
  border-radius: var(--r);
  background: linear-gradient(180deg,var(--acc-s) 0%,transparent 42%);
}
.module-app-layer__panel::before {
  content: "Summary — the whole card at a glance";
  position: absolute;
  top: -9px;
  left: 13px;
  font-size: 13px;
  font-weight: 800;
  background: var(--acc);
  color: #fff;
  padding: 2px 10px;
  border-radius: 20px;
}
.module-app-layer__attribute-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 0 0 13px;
}
.module-app-layer__attribute-chip-link {
  font-size: 13px;
  font-weight: 700;
  padding: 3px 8px;
  border-radius: 5px;
  background: var(--surf2);
  color: var(--ink2);
  border: 1px solid var(--line2);
}
.module-app-layer__split-columns {
  display: flex;
  gap: 26px;
  align-items: stretch;
}
@media (max-width:820px) {
.module-app-layer__split-columns {
    flex-direction: column;
    align-items: center;
  }
}
.module-app-layer__side-content-column {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 11px;
  min-width: 0;
}
.module-app-layer__summary-metric-five-column-grid {
  display: grid;
  grid-template-columns: 1.35fr 1fr 1fr 1fr 1.1fr;
  gap: 8px;
}
@media (max-width:1180px) {
.module-app-layer__summary-metric-five-column-grid {
    grid-template-columns: 1.3fr 1fr 1fr;
  }
}
@media (max-width:620px) {
.module-app-layer__summary-metric-five-column-grid {
    grid-template-columns: 1fr 1fr;
  }
}
.module-app-layer__composition-donut-stat-cell {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 11px 12px 9px;
  border: 1px solid var(--line2);
  border-radius: var(--r-s);
  background: var(--surf);
}
.module-app-layer__mini-trend-key {
  font-size: 13px;
  color: var(--mut);
  font-weight: 700;
  letter-spacing: .03em;
}
.module-app-layer__mini-trend-value {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.1;
}
.module-app-layer__mini-trend-sparkline {
  display: block;
  width: 100%;
  height: 44px;
  margin: 2px 0 1px;
}
.module-app-layer__mini-trend-range {
  font-size: 13px;
  color: var(--mut);
  font-weight: 600;
}
.module-app-layer__card-title-heading {
  margin: 0;
  font-size: clamp(24px,2.5vw,32px);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.15;
}
.module-app-layer__card-number-badge {
  font-size: .62em;
  font-weight: 700;
  color: var(--acc-i);
  background: var(--acc-s);
  padding: 2px 8px;
  border-radius: 6px;
  letter-spacing: .02em;
  vertical-align: 3px;
  font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
}
.module-app-layer__card-attribute-summary-line {
  margin: 0;
  font-size: 13.5px;
  color: var(--mut);
  line-height: 1.5;
}
.module-app-layer__headline-stat-block {
  padding: 12px 13px;
  border-radius: var(--r-s);
  background: var(--surf);
  border: 1px solid var(--line2);
  display: flex;
  flex-direction: column;
  gap: 2px;
  justify-content: center;
}
.module-app-layer__headline-stat-key {
  font-size: 13px;
  color: var(--mut);
  font-weight: 700;
  letter-spacing: .03em;
}
.module-app-layer__headline-stat-value {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1.05;
}
.module-app-layer__headline-stat-note {
  font-size: 13px;
  color: var(--mut);
  line-height: 1.5;
  margin-top: 3px;
}
.module-app-layer__headline-stat-delta {
  font-size: 14px;
  font-weight: 800;
}
.module-app-layer__headline-stat-delta em {
  font-style: normal;
  font-weight: 600;
  font-size: 13px;
  color: var(--mut);
  margin-left: 2px;
}
.module-app-layer__meta-tile-grid {
  display: grid;
  grid-template-columns: repeat(6,1fr);
  gap: 7px;
  margin-top: 12px;
}
@media (max-width:900px) {
.module-app-layer__meta-tile-grid {
    grid-template-columns: repeat(3,1fr);
  }
}
@media (max-width:520px) {
.module-app-layer__meta-tile-grid {
    grid-template-columns: repeat(2,1fr);
  }
}
.module-app-layer__meta-tile {
  padding: 9px 11px;
  border: 1px solid var(--line2);
  border-radius: var(--r-s);
  background: var(--surf);
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}
.module-app-layer__meta-tile-key {
  font-size: 13px;
  color: var(--mut);
  font-weight: 700;
  letter-spacing: .03em;
}
.module-app-layer__meta-tile-value {
  font-size: 13.5px;
  font-weight: 700;
  white-space: normal; /* HCU 09-29 · 말줄임 → 줄바꿈 */
  overflow: visible;
  text-overflow: clip;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
a.module-app-layer__meta-tile {
  border-color: color-mix(in srgb,var(--acc) 24%,var(--line2));
  transition: border-color .15s,background .15s;
}
a.module-app-layer__meta-tile:hover, a.module-app-layer__meta-tile:focus-visible {
  border-color: var(--acc);
  background: var(--acc-s);
}
a.module-app-layer__meta-tile .module-app-layer__meta-tile-value {
  color: var(--acc-i);
}
a.module-app-layer__meta-tile {
  position: relative;
  padding-right: 20px;
}
a.module-app-layer__meta-tile::after {
  content: "↓";
  position: absolute;
  top: 8px;
  right: 9px;
  font-size: 13px;
  font-weight: 800;
  color: var(--mut);
  opacity: .45;
  transition: opacity .13s,transform .13s,color .13s;
}
a.module-app-layer__meta-tile:hover::after, a.module-app-layer__meta-tile:focus-visible::after {
  opacity: 1;
  color: var(--acc-i);
  transform: translateY(2px);
}
.module-app-layer__quick-fact-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 7px;
  margin-top: 12px;
}
@media (max-width:1060px) {
.module-app-layer__quick-fact-grid {
    grid-template-columns: repeat(3,1fr);
  }
}
@media (max-width:560px) {
.module-app-layer__quick-fact-grid {
    grid-template-columns: repeat(2,1fr);
  }
}
.module-app-layer__quick-fact-card {
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  column-gap: 10px;
  row-gap: 1px;
  align-items: center;
  padding: 11px 12px;
  border: 1px solid var(--line2);
  border-radius: var(--r-s);
  background: var(--surf);
  text-decoration: none;
  color: inherit;
  transition: transform .12s,border-color .12s;
}
.module-app-layer__quick-fact-card:hover {
  transform: translateY(-1.5px);
  border-color: var(--acc);
}
.module-app-layer__quick-fact-card:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
}
.module-app-layer__quick-fact-icon {
  grid-column: 1;
  grid-row: 1/span 3;
  align-self: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
}
.module-app-layer__quick-fact-icon svg {
  width: 21px;
  height: 21px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.module-app-layer__quick-fact-icon img {
  width: 21px;
  height: 21px;
  display: block;
}

.module-app-layer__quick-fact-icon--down {
  background: color-mix(in srgb,var(--dn) 13%,transparent);
  color: var(--dn);
}
.module-app-layer__quick-fact-icon--up {
  background: color-mix(in srgb,var(--up) 14%,transparent);
  color: var(--up);
}
.module-app-layer__quick-fact-key {
  grid-column: 2;
  grid-row: 1;
  font-size: 13px;
  color: var(--mut);
  font-weight: 700;
  white-space: normal; /* HCU 09-29 · 말줄임 → 줄바꿈 */
  overflow: visible;
  text-overflow: clip;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.module-app-layer__quick-fact-value {
  grid-column: 2;
  grid-row: 2;
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -.025em;
  line-height: 1.2;
}
.module-app-layer__quick-fact-range {
  grid-column: 2;
  grid-row: 3;
  font-size: 13px;
  color: var(--mut);
  font-weight: 600;
  white-space: normal; /* HCU 09-29 · 말줄임 → 줄바꿈 */
  overflow: visible;
  text-overflow: clip;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.module-app-layer__print-variant-shine-map-diagram-key span.u-value-direction-rising {
  color: var(--acc-i);
  background: var(--acc-s);
}
.module-app-layer__stat-tile-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 7px;
  margin-top: 12px;
}
.module-app-layer__versus-compare-panel {
  display: grid;
  text-decoration: none;
  color: inherit;
  padding: 11px 12px;
  border: 1px solid var(--line2);
  border-radius: var(--r-s);
  background: var(--surf);
}
.module-app-layer__versus-compare-panel:hover {
  border-color: var(--acc);
}
.module-app-layer__stat-tile-key {
  display: block;
  font-size: 13px;
  color: var(--mut);
  font-weight: 600;
  margin-bottom: 3px;
}
.module-app-layer__stat-tile-value {
  display: block;
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -.02em;
}
.module-app-layer__stat-tile-subtitle {
  display: block;
  font-size: 13px;
  color: var(--mut);
  margin-top: 3px;
}
.module-app-layer__stat-tile-grid .module-app-layer__versus-compare-panel {
  display: block;
}
.module-app-layer__primary-action-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  text-decoration: none;
  padding: 12px;
  border-radius: var(--r-s);
  background: var(--acc);
  color: #fff;
  font-weight: 800;
  font-size: 14px;
  margin-top: 12px;
}
.module-app-layer__purchase-action-row {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(clamp(132px,15vw,168px),1fr));
  gap: 8px;
  margin-top: 12px;
}
.module-app-layer__purchase-action-row>* {
  min-width: 0;
}
.module-app-layer__purchase-action-row .module-app-layer__primary-action-button {
  margin: 0;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 11px 12px;
  font-size: 14px;
  white-space: normal; /* HCU 09-29 · 단추 글자(label = 임의 문장) nowrap → 좁은 폭에서 넘침 → 낱말 단위 줄바꿈 */
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.module-app-layer__purchase-action-row .module-app-layer__primary-action-button b {
  font-weight: 800;
  letter-spacing: -.01em;
}
.module-app-layer__purchase-action-caveat {
  margin: 7px 0 0;
  font-size: 13px;
  color: var(--mut);
  line-height: 1.55;
}
.module-app-layer__primary-action-button--question {
  background: var(--surf);
  color: var(--ink);
  border: 1px solid var(--line2);
}
.module-app-layer__outline-action-button {
  background: var(--surf);
  color: var(--ink2);
  border: 1px solid var(--line2);
  border-radius: var(--r-s);
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
  font-family: inherit;

  text-decoration: none;
  padding: 10px 8px;
}
.module-app-layer__outline-action-button:hover {
  border-color: var(--acc);
  color: var(--ink);
}
.module-app-layer__outline-action-button:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
}
.module-app-layer__primary-action-button .module-app-layer__marketplace-logo img, .module-app-layer__outline-action-button .module-app-layer__marketplace-logo img {
  height: 18px;
  width: auto;
  vertical-align: middle;
}
.module-app-layer__section-takeaway-block {
  margin-top: 12px;
  padding: 13px 15px;
  background: var(--surf);
  border: 1px solid var(--line2);
  border-radius: var(--r-s);
}
.module-app-layer__section-takeaway-block-title {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .05em;
  color: var(--acc-i);
  text-transform: uppercase;
}
.module-app-layer__section-takeaway-block ul {
  margin: 0;
  padding-left: 16px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.module-app-layer__section-takeaway-block li {
  font-size: 16px;
  color: var(--ink2);
  line-height: 1.7;
}
.module-app-layer__section-takeaway-block b {
  color: var(--ink);
  font-weight: 700;
  margin-right: 3px;
}
.module-app-layer__data-story-tile-bars:has(.module-app-layer__attribute-distribution-list) {
  height: auto;

  align-items: stretch;
}

.module-app-layer__price-trend-line-hover {
  position: relative;
}
.module-app-layer__price-trend-line-hover-hitarea {
  position: absolute;
  inset: 0;
  display: flex;
}
.module-app-layer__price-trend-line-hover-hitarea>button {
  flex: 1 1 0;
  min-width: 0;
  height: 100%;
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  position: relative;
  border-radius: 3px;
}
.module-app-layer__price-trend-line-hover-hitarea>button:hover, .module-app-layer__price-trend-line-hover-hitarea>button:focus-visible {
  background: color-mix(in srgb,var(--acc) 9%,transparent);
  outline: 0;
}
.module-app-layer__price-trend-line-hover-hitarea>button::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--acc);
  opacity: 0;
  transition: opacity .12s;
}
.module-app-layer__price-trend-line-tooltip .module-app-layer__price-trend-line-delta-arrow.u-value-direction-rising {
  color: #6EE7A8;
}
.module-app-layer__price-trend-line-tooltip .module-app-layer__price-trend-line-delta-arrow.u-value-direction-falling {
  color: #FF9C8F;
}
.module-app-layer__price-trend-line-hover-hitarea>button:hover::before, .module-app-layer__price-trend-line-hover-hitarea>button:focus-visible::before {
  opacity: 1;
}
.module-app-layer__quick-fact-card {
  position: relative;
}
.module-app-layer__quick-fact-key {
  padding-right: 22px; /* HCU 09-29 · 배지(right 10·19px) 자리 — 16px 이면 390 에서 3px 겹침 */
}
a.module-app-layer__meta-tile::after {
  display: grid;
  place-items: center;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: var(--acc-s);
  color: var(--acc-i);
  opacity: .9;
  font-size: 13px;
  line-height: 1;
  top: 9px;
  right: 9px;
}
a.module-app-layer__meta-tile:hover::after, a.module-app-layer__meta-tile:focus-visible::after {
  background: var(--acc);
  color: #fff;
  opacity: 1;
}
.module-app-layer__versus-compare-panel {
  position: relative;
  padding-right: 30px;
}
a.module-app-layer__versus-compare-panel::after {
  content: "↓";
  position: absolute;
  top: 10px;
  right: 10px;
  display: grid;
  place-items: center;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: var(--acc-s);
  color: var(--acc-i);
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  transition: transform .13s ease,background .13s ease,color .13s ease;
}
a.module-app-layer__versus-compare-panel:hover::after, a.module-app-layer__versus-compare-panel:focus-visible::after {
  background: var(--acc);
  color: #fff;
  transform: translateY(2px);
}
.module-app-layer__versus-compare-panel:hover, .module-app-layer__versus-compare-panel:focus-visible {
  border-color: var(--acc);
}
a.module-app-layer__meta-tile::after, a.module-app-layer__versus-compare-panel::after {
  content: "→";
}
a.module-app-layer__meta-tile:hover::after, a.module-app-layer__meta-tile:focus-visible::after, a.module-app-layer__versus-compare-panel:hover::after, a.module-app-layer__versus-compare-panel:focus-visible::after {
  transform: translateX(2px);
}
.module-app-layer__card-set-name {
  display: block;
  margin-top: 3px;
  font-size: 15px;
  font-weight: 700;
  color: var(--ink2);
  letter-spacing: -.01em;
  line-height: 1.35;
}
@media (max-width:820px) {
.module-app-layer__side-content-column {
    gap: 10px;
  }
.module-app-layer__side-content-column .module-app-layer__purchase-action-row {
    order: 1;
    margin-top: 2px;
  }
.module-app-layer__side-content-column .module-app-layer__purchase-action-caveat {
    order: 2;
    margin-top: 0;
  }
.module-app-layer__side-content-column .module-app-layer__summary-metric-five-column-grid {
    order: 3;
    margin-top: 4px;
  }
.module-app-layer__side-content-column .module-app-layer__meta-tile-grid {
    order: 4;
    margin-top: 0;
  }
.module-app-layer__purchase-action-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
.module-app-layer__purchase-action-row .module-app-layer__primary-action-button {
    padding: 13px 12px;
    font-size: 14px;
  }
.module-app-layer__purchase-action-row .module-app-layer__outline-action-button {
    padding: 12px 10px;
  }
.module-app-layer__purchase-action-row .module-app-layer__primary-action-button:first-child {
    grid-column: 1/-1;
  }
}
@media (max-width:520px) {
.module-app-layer__purchase-action-row {
    grid-template-columns: 1fr;
  }
.module-app-layer__purchase-action-row .module-app-layer__primary-action-button {
    grid-column: 1/-1;
  }
}
.module-app-layer__attribute-chip-row {
  gap: 6px;
}
.module-app-layer__attribute-chip-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px 4px 5px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -.01em;
  line-height: 1.3;
  background: var(--surf2);
  color: var(--ink2);
  border: 1px solid var(--line2);
  transition: transform .13s ease,box-shadow .13s ease;
}
.module-app-layer__attribute-chip-link:hover {
  transform: translateY(-1px);
}
.module-app-layer__attribute-chip-link--rare {
  background: color-mix(in srgb,var(--c5) 20%,var(--surf));
  color: var(--c5);
  border-color: color-mix(in srgb,var(--c5) 42%,transparent);
  box-shadow: 0 2px 9px color-mix(in srgb,var(--c5) 22%,transparent);
}
.module-app-layer__attribute-chip-link--mechanic {
  background: color-mix(in srgb,var(--c1) 20%,var(--surf));
  color: var(--c1);
  border-color: color-mix(in srgb,var(--c1) 42%,transparent);
  box-shadow: 0 2px 9px color-mix(in srgb,var(--c1) 22%,transparent);
}
.module-app-layer__attribute-chip-link--holo {
  background: color-mix(in srgb,var(--c2) 20%,var(--surf));
  color: var(--c2);
  border-color: color-mix(in srgb,var(--c2) 42%,transparent);
}
.module-app-layer__attribute-chip-link--regulation {
  background: color-mix(in srgb,var(--c3) 22%,var(--surf));
  color: var(--c3);
  border-color: color-mix(in srgb,var(--c3) 46%,transparent);
  box-shadow: 0 2px 9px color-mix(in srgb,var(--c3) 24%,transparent);
}
.module-app-layer__attribute-chip-link--language, .module-app-layer__attribute-chip-link--pokedex {
  background: var(--surf2);
  color: var(--ink2);
  border-color: var(--line2);
}
.module-app-layer__attribute-chip-link--holo {
  position: relative;
  overflow: hidden;
}
.module-app-layer__attribute-chip-link--holo::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .3;
  background: repeating-linear-gradient(112deg,
      rgba(255,90,90,.5) 0 5px, rgba(255,205,70,.5) 5px 10px, rgba(90,235,150,.5) 10px 15px,
      rgba(80,190,255,.5) 15px 20px, rgba(195,110,255,.5) 20px 25px);
  mix-blend-mode: color-dodge;
}
.module-app-layer__attribute-chip-link {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -.01em;
  line-height: 1.35;
}
.module-app-layer__attribute-chip-link:hover {
  transform: none;
}
@media (max-width:820px) {
.module-app-layer__panel {
    padding: 0;
    border: 0;
    background: none;
    border-radius: 0;
  }
.module-app-layer__panel::before {
    position: static;
    display: inline-block;
    margin: 0 0 10px;
  }
.module-app-layer__quick-fact-card {
    padding: 10px;
  }
}
.module-app-layer__panel {
  padding: 0;
  border: 0;
  background: none;
  border-radius: 0;
}
.module-app-layer__panel::before {
  content: none;
}
@media (max-width:820px) {
.module-app-layer__panel {
    padding: 0;
  }
}
.module-app-layer__panel>*+* {
  margin-top: 30px;
}
@media (max-width:820px) {
.module-app-layer__panel>*+* {
    margin-top: 24px;
  }
}
.module-app-layer__movers-board-label .u-row-entrance-arrow-badge {
  font-size: 13px;
  font-weight: 800;
  text-align: center;
  letter-spacing: normal;
}
.module-app-layer__purchase-action-row .module-app-layer__outline-action-button {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  column-gap: 6px;
  row-gap: 1px;
  line-height: 1.25;
}
.module-app-layer__purchase-action-row .module-app-layer__outline-action-button em {
  font-style: normal;
  font-size: 13px;
  font-weight: 600;
  color: var(--mut);
  flex-basis: 100%;
  text-align: center;
}
.module-app-layer__attribute-chip-link--format {
  background: color-mix(in srgb,var(--c2) 20%,var(--surf));
  color: var(--c2);
  border-color: color-mix(in srgb,var(--c2) 44%,transparent);
}
.module-app-layer__cross-axis-summary-link {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 10px;
  padding: 10px 13px;
  border: 1px solid var(--line2);
  border-left: 4px solid var(--c2);
  border-radius: var(--r-s);
  background: var(--surf2);
  text-decoration: none;
  color: inherit;
  transition: border-color .13s,background .13s;
}
.module-app-layer__cross-axis-summary-link:hover, .module-app-layer__cross-axis-summary-link:focus-visible {
  border-color: var(--c2);
  background: color-mix(in srgb,var(--c2) 9%,var(--surf2));
}
.module-app-layer__cross-axis-summary-link-key {
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 800;
  color: var(--c2);
  letter-spacing: -.01em;
}
.module-app-layer__cross-axis-summary-link-value {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  min-width: 0;
  font-size: 14px;
}
.module-app-layer__cross-axis-summary-link-value b {
  font-weight: 800;
  color: var(--ink);
}
.module-app-layer__cross-axis-summary-link-value i {
  font-style: normal;
  font-weight: 600;
  color: var(--ink2);
}
.module-app-layer__cross-axis-summary-link-value>*+*::before {
  content: "·";
  margin-right: 8px;
  color: var(--mut);
  font-weight: 400;
}
.module-app-layer__cross-axis-summary-link-group {
  margin-left: auto;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 800;
  color: var(--mut);
}
.module-app-layer__cross-axis-summary-link-group::after {
  content: "→";
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: color-mix(in srgb,var(--c2) 18%,transparent);
  color: var(--c2);
  font-size: 13px;
  transition: background .13s,color .13s,transform .13s;
}
.module-app-layer__cross-axis-summary-link:hover .module-app-layer__cross-axis-summary-link-group {
  color: var(--c2);
}
.module-app-layer__cross-axis-summary-link:hover .module-app-layer__cross-axis-summary-link-group::after {
  background: var(--c2);
  color: #fff;
  transform: translateX(2px);
}
@media (max-width:820px) {
.module-app-layer__cross-axis-summary-link {
    gap: 8px;
  }
.module-app-layer__cross-axis-summary-link-group {
    margin-left: 0;
    width: 100%;
  }
}
.u-sponsored-disclosure-note {
  margin: 9px 0 0;
  font-size: 13px;
  color: var(--mut);
  line-height: 1.55;
}

.module-app-layer__attribute-distribution-track {
  height: 9px;
  border-radius: 5px;
  background: var(--surf2);
  overflow: hidden;
  border: 1px solid var(--line);
}
.module-app-layer__attribute-distribution-bar-fill {
  display: block;
  height: 100%;
  border-radius: 5px;
  background: var(--acc);
}
@media (max-width:560px) {

}
@media (max-width:1080px) and (min-width:521px) {
.module-app-layer__meta-tile-grid {
    grid-template-columns: repeat(3,1fr);
  }
}
@media (max-width:960px) {
.module-app-layer__summary-metric-five-column-grid {
    grid-template-columns: 1fr 1fr;
  }
}
a.module-app-layer__attribute-chip-link {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
  transition: border-color .12s,color .12s;
}
a.module-app-layer__attribute-chip-link:hover, a.module-app-layer__attribute-chip-link:focus-visible {
  border-color: var(--acc);
  color: var(--acc-i);
}
a.module-app-layer__attribute-chip-link:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
}
.module-popup__card-image-fallback .module-app-layer__composition-donut-stat-cell-holo, .module-popup__card-image-fallback .module-app-layer__composition-donut-stat-cell-sheen {
  opacity: 0 !important;
  display: none;
}
.module-app-layer__quick-fact-icon--accent {
  background: var(--acc-s);
  color: var(--acc-i);
}
.module-app-layer__primary-action-button {
  cursor: pointer;
  transition: background .13s, transform .13s;
}
.module-app-layer__primary-action-button:hover, .module-app-layer__primary-action-button:focus-visible {
  background: var(--acc-i);
}
.module-app-layer__primary-action-button:active {
  transform: translateY(1px);
}
a.module-app-layer__primary-action-button, a.module-app-layer__primary-action-button:link, a.module-app-layer__primary-action-button:visited, a.module-app-layer__primary-action-button:hover, a.module-app-layer__primary-action-button:focus, a.module-app-layer__primary-action-button:focus-visible, a.module-app-layer__primary-action-button:active { color: #fff }
a.module-app-layer__primary-action-button .u-tabular-number, a.module-app-layer__primary-action-button:hover .u-tabular-number { color: #fff }
a.module-app-layer__primary-action-button.module-app-layer__primary-action-button--question, a.module-app-layer__primary-action-button.module-app-layer__primary-action-button--question:link, a.module-app-layer__primary-action-button.module-app-layer__primary-action-button--question:visited { color: var(--ink) }
a.module-app-layer__primary-action-button.module-app-layer__primary-action-button--question:hover, a.module-app-layer__primary-action-button.module-app-layer__primary-action-button--question:focus, a.module-app-layer__primary-action-button.module-app-layer__primary-action-button--question:focus-visible, a.module-app-layer__primary-action-button.module-app-layer__primary-action-button--question:active { color: #fff }
a.module-app-layer__primary-action-button.module-app-layer__primary-action-button--question .u-tabular-number { color: var(--ink) }
a.module-app-layer__primary-action-button.module-app-layer__primary-action-button--question:hover .u-tabular-number { color: #fff }
.module-app-layer__axstats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 8px;
}
@media (max-width: 620px) {
.module-app-layer__axstats {
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  }
}
@media (prefers-reduced-motion:no-preference) {
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(1) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(1), .module-app-layer__data-story-tile-rank>i:nth-child(1) {animation-delay:.20s}
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(2) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(2), .module-app-layer__data-story-tile-rank>i:nth-child(2) {animation-delay:.24s}
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(3) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(3), .module-app-layer__data-story-tile-rank>i:nth-child(3) {animation-delay:.28s}
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(4) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(4), .module-app-layer__data-story-tile-rank>i:nth-child(4) {animation-delay:.32s}
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(5) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(5), .module-app-layer__data-story-tile-rank>i:nth-child(5) {animation-delay:.36s}
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(6) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(6), .module-app-layer__data-story-tile-rank>i:nth-child(6) {animation-delay:.40s}
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(7) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(7), .module-app-layer__data-story-tile-rank>i:nth-child(7) {animation-delay:.44s}
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(8) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(8), .module-app-layer__data-story-tile-rank>i:nth-child(8) {animation-delay:.48s}
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(9) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(9), .module-app-layer__data-story-tile-rank>i:nth-child(9) {animation-delay:.52s}
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(10) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(10), .module-app-layer__data-story-tile-rank>i:nth-child(10) {animation-delay:.56s}
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(11) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(11), .module-app-layer__data-story-tile-rank>i:nth-child(11) {animation-delay:.60s}
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(n+12) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span), .module-app-layer__data-story-tile-bars>i:nth-child(n+12), .module-app-layer__data-story-tile-rank>i:nth-child(n+12) {animation-delay:.64s}
}
@media (prefers-reduced-motion:no-preference) and (scripting:none) {
.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span, .module-app-layer__data-story-tile-gauge>i, .module-app-layer__data-story-tile-bars>i, .module-app-layer__data-story-tile-rank>i, .module-app-layer__position-spread-gauge-needle {animation-play-state:running}
}
.module-app-layer__price-trend-line-hover--figure {position:relative;display:block;container-type:inline-size}
.module-app-layer__price-trend-line-hover-points {position:absolute;inset:0}
.module-app-layer__price-trend-line-hover-points>i {position:absolute;left:calc(var(--x)*1%);top:calc(var(--yp)*1%);
  width:var(--d,7px);height:var(--d,7px);
  margin:calc(var(--d,7px) / -2) 0 0 calc(var(--d,7px) / -2);
  display:block;border-radius:50%;background:var(--dc,var(--acc));pointer-events:none}
.module-app-layer__panel--cell .module-app-layer__position-spread-gauge-dial svg {
  max-width: 132px;
}
.u-tabular-number { font-variant-numeric:tabular-nums; }
.u-value-direction-rising { color:var(--up); }
.u-value-direction-falling { color:var(--dn); }
.module-app-layer__panel { position:relative; padding:0; border:0; border-radius:0; background:none; margin-bottom:16px; }
.module-app-layer__panel::before { content:none; position:absolute; top:-9px; left:13px; font-size:13px; font-weight:800; background:var(--acc); color:#fff; padding:2px 10px; border-radius:20px; }
.module-app-layer__split-columns { display:flex; gap:26px; align-items:stretch; }
.module-app-layer__attribute-chip-row { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 13px; }
.module-app-layer__headline-stat-block { padding:12px 13px; background:var(--surf); border:1px solid var(--line2); border-radius:var(--r-s); display:flex; flex-direction:column; justify-content:center; gap:2px; }
.module-app-layer__attribute-chip-link { font-size:13px; font-weight:800; padding:4px 10px; border-radius:6px; background:var(--surf2); color:var(--ink2); border:1px solid var(--line2); display:inline-block; align-items:center; gap:6px; letter-spacing:-.01em; line-height:1.35; transition:transform .13s ease,box-shadow .13s ease; }
.module-app-layer__headline-stat-block-key { font-size:13px; font-weight:700; color:var(--mut); line-height:1.4; }
.module-app-layer__attribute-chip-link--rarity { background:var(--acc-s); color:var(--acc-i); border-color:transparent; }
.module-app-layer__headline-stat-block-value { font-size:38px; font-weight:800; letter-spacing:-.035em; line-height:1.05; font-variant-numeric:tabular-nums; }
.module-app-layer__headline-stat-block-description { display:flex; align-items:center; gap:6px; font-size:14px; font-weight:800; margin-top:2px; }
.module-app-layer__headline-stat-block-description.u-value-direction-rising { color:var(--up); }
.module-app-layer__headline-stat-block-description.u-value-direction-falling { color:var(--dn); }
.module-app-layer__summary-metric-five-column-grid { display:grid; grid-template-columns:1.35fr 1fr 1fr 1fr 1.1fr; gap:8px; }
.module-app-layer__headline-stat-block-footnote { font-size:13px; color:var(--mut); line-height:1.45; margin-top:4px; }
.module-app-layer__mini-trend-key { font-size:13px; color:var(--mut); font-weight:700; letter-spacing:.03em; }
.module-app-layer__mini-trend-value { font-size:20px; font-weight:800; letter-spacing:-.03em; line-height:1.1; }
.module-app-layer__mini-trend-sparkline { display:block; width:100%; height:44px; margin:2px 0 1px; }
.module-app-layer__mini-trend-range { font-size:13px; color:var(--mut); font-weight:600; }
.module-app-layer__card-title-heading { margin:0; font-size:clamp(24px,2.5vw,32px); font-weight:800; letter-spacing:-.03em; line-height:1.15; }
.module-app-layer__card-number-badge { font-size:.62em; font-weight:700; color:var(--acc-i); background:var(--acc-s); padding:2px 8px; border-radius:6px; letter-spacing:.02em; vertical-align:3px; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.module-app-layer__list-row-card-number-plain { font-size:.62em; color:var(--mut); font-variant-numeric:tabular-nums; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; }
.module-app-layer__card-attribute-summary-line { margin:0; font-size:13.5px; color:var(--mut); line-height:1.5; }
.module-app-layer__side-content-column { flex:1 1 auto; display:flex; flex-direction:column; gap:11px; min-width:0; }
.module-app-layer__composition-donut-stat-panel { background:var(--surf); border:1px solid var(--line2); border-radius:var(--r-s); display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; overflow:hidden; }
.module-app-layer__composition-donut-stat-cell { padding:11px 12px 9px; border-left:1px solid var(--line); display:flex; flex-direction:column; gap:3px; border:1px solid var(--line2); border-radius:var(--r-s); background:var(--surf); }
.module-app-layer__headline-stat-key { font-size:13px; color:var(--mut); font-weight:700; letter-spacing:.03em; }
.module-app-layer__composition-donut-stat-cell:first-child { border-left:0; background:linear-gradient(180deg,var(--acc-s),transparent 70%); }
.module-app-layer__headline-stat-value { font-size:28px; font-weight:800; letter-spacing:-.035em; line-height:1.05; font-variant-numeric:tabular-nums; }
.module-app-layer__headline-stat-note { font-size:13px; color:var(--mut); line-height:1.5; margin-top:3px; }
.module-app-layer__headline-stat-delta { font-size:14px; font-weight:800; }
.module-app-layer__headline-stat-delta em { font-style:normal; font-weight:600; font-size:13px; color:var(--mut); margin-left:2px; }

.module-app-layer__entity-spec-summary-strip { display:flex; flex-wrap:wrap; gap:2px 18px; padding:15px 13px; border-radius:var(--r-s); background:var(--surf2); border:1px dashed var(--line2); font-size:15px; }
.module-app-layer__entity-spec-summary-strip a { display:inline-flex; align-items:center; gap:5px; color:var(--ink2); text-decoration:none; text-underline-offset:3px; text-decoration-thickness:1.5px; text-decoration-color:color-mix(in srgb,currentColor 55%,transparent); }
.module-app-layer__entity-spec-summary-strip span { display:inline-flex; align-items:center; gap:5px; color:var(--ink2); text-decoration:none; }
.module-app-layer__entity-spec-summary-strip a:hover { color:var(--acc-i); text-decoration:underline; }
.module-app-layer__entity-spec-summary-strip b { color:var(--mut); font-weight:700; }
.module-app-layer__entity-spec-summary-strip em { font-style:normal; color:var(--ink); font-weight:800; }
.module-app-layer__quick-fact-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr)); gap:7px; margin-top:12px; }
.module-app-layer__quick-fact-card { position:relative; display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:10px; align-items:center; padding:11px 12px; border:1px solid var(--line2); border-left:3px solid var(--acc); border-radius:var(--r-s); background:var(--surf); text-decoration:none; color:inherit; transition:transform .12s,border-color .12s; row-gap:1px; }
.module-app-layer__quick-fact-card:hover { transform:translateY(-1.5px); background:var(--acc-s); border-color:var(--acc); }
.module-app-layer__quick-fact-card b { font-size:13px; font-weight:700; color:var(--mut); }
.module-app-layer__meta-tile-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:7px; margin-top:12px; }
.module-app-layer__quick-fact-icon { grid-row:1/span 3; width:38px; height:38px; border-radius:11px; display:grid; place-items:center; background:var(--acc-s); color:var(--acc-i); grid-column:1; align-self:center; flex:0 0 auto; }
.module-app-layer__quick-fact-card em { font-style:normal; font-size:14px; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums; }
.module-app-layer__quick-fact-icon svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; display:block; }
.module-app-layer__quick-fact-icon img { width:21px; height:21px; display:block; }
.module-app-layer__quick-fact-key { grid-row:1; font-size:13px; color:var(--mut); font-weight:700; grid-column:2; white-space:normal; overflow:visible; text-overflow:clip; word-break:keep-all; overflow-wrap:anywhere; padding-right:22px; } /* HCU 09-29 · 말줄임(값 숨김) → 줄바꿈 · 선례 = 이동타일 규칙(quick-fact-grid--move) · 오른쪽 22px = 배지(right 10·19px) 자리(16px 이면 390 카드 여백 10px 에서 3px 겹침) */
.module-app-layer__meta-tile { padding:9px 11px; border:1px solid var(--line2); border-radius:var(--r-s); background:var(--surf); display:flex; flex-direction:column; gap:2px; min-width:0; color:inherit; text-decoration:none; }
.module-app-layer__quick-fact-value { grid-row:2; font-size:19px; font-weight:800; line-height:1.2; grid-column:2; letter-spacing:-.025em; }
.module-app-layer__meta-tile-key { font-size:13px; color:var(--mut); font-weight:700; letter-spacing:.03em; }
.module-app-layer__meta-tile-value { font-size:13.5px; font-weight:700; white-space:normal; overflow:visible; text-overflow:clip; word-break:keep-all; overflow-wrap:anywhere; } /* HCU 09-29 · 말줄임(값 숨김) → 줄바꿈(값에 은행·상품 이름이 들어옴) */
a.module-app-layer__meta-tile { border-color:color-mix(in srgb,var(--acc)24%,var(--line2)); transition:border-color .15s,background .15s; position:relative; padding-right:20px; }
a.module-app-layer__meta-tile:hover { border-color:var(--acc); background:var(--acc-s); }
a.module-app-layer__meta-tile:focus-visible { border-color:var(--acc); background:var(--acc-s); }
a.module-app-layer__meta-tile .module-app-layer__meta-tile-value { color:var(--acc-i); }
a.module-app-layer__meta-tile::after { content:"→"; position:absolute; top:9px; right:9px; font-size:13px; font-weight:800; color:var(--acc-i); opacity:.9; transition:opacity .13s,transform .13s,color .13s; display:grid; place-items:center; width:19px; height:19px; border-radius:50%; background:var(--acc-s); line-height:1; }
a.module-app-layer__meta-tile[href^="#"]::after { transform:rotate(45deg); }
a.module-app-layer__meta-tile[href^="#"]:hover::after, a.module-app-layer__meta-tile[href^="#"]:focus-visible::after { transform:rotate(45deg) translate(1.5px,1.5px); }
a.module-app-layer__meta-tile:hover::after { opacity:1; color:#fff; transform:translateX(2px); background:var(--acc); }
a.module-app-layer__meta-tile:focus-visible::after { opacity:1; color:#fff; transform:translateX(2px); background:var(--acc); }
.module-app-layer__entity-spec-summary-strip a:focus-visible { text-decoration:underline; }
.module-app-layer__quick-fact-card:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }

.module-app-layer__quick-fact-icon svg rect { fill:currentColor; stroke:none; }
.module-app-layer__quick-fact-icon--accent { background:var(--acc-s); color:var(--acc-i); }
.module-app-layer__quick-fact-icon--down { background:color-mix(in srgb,var(--dn)13%,transparent); color:var(--dn); }
.module-app-layer__quick-fact-icon--up { background:color-mix(in srgb,var(--up)14%,transparent); color:var(--up); }
.module-app-layer__quick-fact-range { grid-column:2; grid-row:3; font-size:13px; color:var(--mut); font-weight:600; white-space:normal; overflow:visible; text-overflow:clip; word-break:keep-all; line-height:1.4; }
.module-app-layer__attribute-distribution-bar-fill { transform-origin:left center; animation:none; animation-play-state:paused; display:block; height:100%; border-radius:5px; background:var(--acc); width:var(--w); }

.module-app-layer__stat-tile-metric-bar i { transform-origin:left center; animation:none; animation-play-state:paused; display:block; height:100%; width:var(--w); border-radius:99px; background:var(--acc); opacity:.85; }

.module-app-layer__attribute-distribution-bar-fill.module-app-layer__sh-go { animation-play-state:running; }
.module-app-layer__type-sparkline-card-footnote em.u-value-direction-rising { color:var(--up); }
.module-app-layer__type-sparkline-card-footnote em.u-value-direction-falling { color:var(--dn); }
.module-app-layer__stat-tile-link-track i.module-app-layer__sh-go { animation-play-state:running; }
.module-app-layer__stat-tile-metric-bar i.module-app-layer__sh-go { animation-play-state:running; }
.module-app-layer__rank-list-group-value-ladder-value.u-value-direction-rising { color:var(--up); }
.module-app-layer__stat-tile-link-bars i.module-app-layer__sh-go { animation-play-state:running; }
.module-app-layer__rank-list-group-value-ladder-value.u-value-direction-falling { color:var(--dn); }
.module-app-layer__stat-tile-link-dot i.module-app-layer__sh-go { animation-play-state:running; }
.module-app-layer__print-variant-shine-map-diagram-key span.u-value-direction-rising { color:var(--acc-i); background:var(--acc-s); }
.module-app-layer__composition-donut-ring-box { display:flex; gap:18px; align-items:center; flex-wrap:wrap; padding:14px 16px; background:var(--surf2); border:1px solid var(--line2); border-radius:var(--r-s); margin-bottom:12px; }
.u-visual-block-box .module-app-layer__composition-donut-ring-box { padding:0; background:transparent; border:0; border-radius:0; }
figure .module-app-layer__composition-donut-ring-box { padding:0; background:transparent; border:0; border-radius:0; }
.module-app-layer__ranked-thumbnail-list-gap-rows .module-app-layer__composition-donut-ring-box { padding:0; background:transparent; border:0; border-radius:0; }
.module-app-layer__composition-donut-ring { width:132px; height:132px; border-radius:50%; flex:0 0 auto; display:grid; place-items:center; align-content:center; position:relative; background:conic-gradient(var(--acc)0 33%,#6E7A8D 33% 61%,#3DD68C 61% 75%,#E2A33C 75% 78.4%,#F2555A 78.4% 80.3%,var(--line2)80.3% 100%); }
.module-app-layer__composition-donut-ring::after { content:""; position:absolute; width:82px; height:82px; border-radius:50%; background:var(--surf2); }
.module-app-layer__composition-donut-ring::before {
  content:""; position:absolute; inset:-6px; border-radius:50%; pointer-events:none;
  background:
    conic-gradient(transparent 0 var(--donut-highlight-from,0%),
      rgba(255,255,255,.30) var(--donut-highlight-from,0%) var(--donut-highlight-to,0%),
      transparent var(--donut-highlight-to,0%) 100%),
    conic-gradient(transparent 0 var(--donut-highlight-from,0%),
      var(--donut-highlight-color,var(--line2)) var(--donut-highlight-from,0%) var(--donut-highlight-to,0%),
      transparent var(--donut-highlight-to,0%) 100%);
  opacity:0; transition:opacity .16s ease;
}
.module-app-layer__composition-donut-ring.is-donut-slice-lit::before { opacity:1; }
.module-app-layer__composition-donut-legend > span { padding:2px 6px; margin:-2px -6px; border-radius:6px; transition:background-color .16s ease; }
.module-app-layer__composition-donut-legend > span.module-app-layer__donut-legend-lit { background-color:var(--surf2); box-shadow:inset 0 0 0 1px var(--line2); font-weight:800; color:var(--ink); }
@media (prefers-reduced-motion:reduce) {
.module-app-layer__composition-donut-ring::before, .module-app-layer__composition-donut-legend > span { transition:none; }
}
.module-app-layer__versus-compare-panel:hover { border-color:var(--acc); }
.module-app-layer__composition-donut-ring b { position:relative; z-index:1; font-size:22px; font-weight:800; letter-spacing:-.03em; line-height:1.15; }
.module-app-layer__stat-tile-key { display:block; font-size:13px; color:var(--mut); font-weight:600; margin-bottom:3px; }
.module-app-layer__composition-donut-ring--value { background:var(--dg); }
.module-app-layer__stat-tile-value { display:block; font-size:20px; font-weight:800; letter-spacing:-.02em; line-height:1.05; color:var(--ink); font-variant-numeric:tabular-nums; white-space:normal; word-break:keep-all; overflow-wrap:anywhere; } /* HCU 09-29 · nowrap → 390 비교 판(170px)에서 값이 이웃 판까지 넘침 · 낱말 단위 줄바꿈(keep-all) — 기본 줄바꿈은 «배/럴»·«환산하/는» 처럼 낱말을 가르고 숫자 갈림도 더 많았음(실측 3 ↔ 2) · 판 폭보다 긴 한 낱말만 anywhere 로 갈림 */
.module-app-layer__composition-donut-ring small { position:relative; z-index:1; display:block; font-size:13px; font-weight:700; color:var(--mut); line-height:1.3; margin-top:3px; max-width:76px; text-align:center; white-space:normal; word-break:keep-all; }
.module-app-layer__stat-tile-subtitle { display:block; font-size:13px; color:var(--mut); margin-top:3px; line-height:1.5; }
.module-app-layer__composition-donut-legend { display:flex; flex-direction:column; gap:5px; font-size:13.6px; min-width:200px; flex:1 1 220px; }
.module-app-layer__primary-action-button { display:flex; align-items:center; justify-content:center; gap:9px; text-decoration:none; padding:12px; border-radius:var(--r-s); background:var(--acc); color:#fff; font-weight:800; font-size:14px; margin-top:12px; }
.module-app-layer__composition-donut-legend i { display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:7px; vertical-align:-1px; flex:0 0 auto; }
.module-app-layer__primary-action-button small { font-weight:600; font-size:13px; opacity:.85; }
.module-app-layer__composition-donut-legend span { display:flex; align-items:center; column-gap:9px; color:var(--ink2); }
.module-app-layer__purchase-action-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(clamp(132px,15vw,168px),1fr)); gap:8px; margin-top:12px; }
.module-app-layer__composition-donut-legend span>i { margin-right:0; flex:0 0 auto; }
.module-app-layer__purchase-action-row>* { min-width:0; }
.module-app-layer__composition-donut-legend b { font-variant-numeric:tabular-nums; margin-left:auto; padding-left:14px; white-space:normal; }
.module-app-layer__purchase-action-row .module-app-layer__primary-action-button { margin:0; flex-direction:row; align-items:center; justify-content:center; gap:5px; padding:11px 12px; font-size:14px; white-space:normal; word-break:keep-all; overflow-wrap:anywhere; } /* HCU 09-29 · 단추 글자 nowrap → 줄바꿈 */
.module-app-layer__composition-donut-legend span>b { margin-left:auto; padding-left:14px; white-space:normal; }
.module-app-layer__purchase-action-row .module-app-layer__primary-action-button b { font-weight:800; letter-spacing:-.01em; }
.module-app-layer__purchase-action-caveat { margin:7px 0 0; font-size:13px; color:var(--mut); line-height:1.55; }
.module-app-layer__primary-action-button--question { background:var(--surf); color:var(--ink); border:1px solid var(--line2); }
.module-app-layer__primary-action-button--question small { color:var(--mut); opacity:1; }
.module-app-layer__quick-fact-grid>* { min-width:0; }
.module-app-layer__outline-action-button { background:var(--surf); color:var(--ink2); border:1px solid var(--line2); border-radius:var(--r-s); font-weight:700; font-size:13px; cursor:pointer; font-family:inherit; text-decoration:none; padding:10px 8px; }
.module-app-layer__outline-action-button:hover { border-color:var(--acc); color:var(--ink); }
.module-app-layer__composition-donut-stat-panel>* { min-width:0; }
.module-app-layer__outline-action-button:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }
.module-app-layer__versus-compare-panel { display:grid; grid-template-columns:minmax(180px,1fr)auto minmax(180px,1fr); gap:14px; align-items:center; padding:11px 12px; background:var(--surf); border:1px solid var(--line2); border-radius:var(--r-s); margin-bottom:12px; text-decoration:none; color:inherit; position:relative; padding-right:30px; }

.module-app-layer__attribute-distribution-bar-fill--group { background:var(--gold); }
:where(.module-app-layer__content-section-block, .module-app-layer__panel, .module-app-layer__page-summary-box)>* { margin-bottom:12px; }
:where(.module-app-layer__content-section-block, .module-app-layer__panel, .module-app-layer__page-summary-box, .module-app-layer__entry-content)>*:last-child { margin-bottom:0; }
.module-app-layer__content-section-block>.module-app-layer__composition-donut-ring-box:last-child { margin-bottom:0; }
.module-app-layer__price-trend-line-hover--fit svg { height:auto; aspect-ratio:600/130; }
.u-row-entrance-arrow-badge { flex:0 0 auto; margin-left:7px; display:inline-grid; place-items:center; width:19px; height:19px; border-radius:999px; background:var(--surf2); border:1px solid var(--line2); color:var(--mut); font-size:13px; font-weight:800; line-height:1; }
a:hover .u-row-entrance-arrow-badge { border-color:var(--acc); color:var(--acc-i); }
.u-row-entrance-arrow-badge--card {
  position: absolute;
  top: 10px;
  right: 10px;
  margin-left: 0;
  transition: transform .13s ease, background .13s ease, color .13s ease, border-color .13s ease;
}
a:hover .u-row-entrance-arrow-badge--card, a:focus-visible .u-row-entrance-arrow-badge--card {
  background: var(--acc);
  border-color: var(--acc);
  color: #fff;
  transform: translateX(2px);
}
.module-app-layer__row-entrance-arrow-badge--anchor { transform: rotate(45deg); }
a:hover .u-row-entrance-arrow-badge--card.module-app-layer__row-entrance-arrow-badge--anchor, a:focus-visible .u-row-entrance-arrow-badge--card.module-app-layer__row-entrance-arrow-badge--anchor {
  background: var(--acc);
  border-color: var(--acc);
  color: #fff;
  transform: rotate(45deg);
}
.module-app-layer__versus-compare-panel>* { min-width:0; }
.module-app-layer__quick-fact-card>* { min-width:0; }
:is(.module-app-layer__content-section-block, .module-app-layer__panel, .module-app-layer__page-summary-box)>:nth-child(n+2) { margin-top:22px; }
:is(.module-app-layer__content-section-block, .module-app-layer__panel, .module-app-layer__page-summary-box)>.module-app-layer__rank-list-block-followup-note:nth-child(n+2) { margin-top:8px; }
:is(.module-app-layer__content-section-block, .module-app-layer__panel, .module-app-layer__page-summary-box)>.module-app-layer__list-page-bar:nth-child(n+2) { margin-top:8px; }
:is(.module-app-layer__content-section-block, .module-app-layer__panel, .module-app-layer__page-summary-box)>.module-app-layer__prose-body-block+.module-app-layer__prose-body-block { margin-top:12px; }
:is(.module-app-layer__content-section-block, .module-app-layer__panel, .module-app-layer__page-summary-box)>.module-app-layer__ranked-thumbnail-list-gap-rows+.module-app-layer__ranked-thumbnail-list-gap-rows { margin-top:12px; }
:is(.module-app-layer__content-section-block, .module-app-layer__panel, .module-app-layer__page-summary-box)>.module-app-layer__prose-section-lead-paragraph+* { margin-top:0; }
:is(.module-app-layer__content-section-block, .module-app-layer__panel, .module-app-layer__page-summary-box)>*+h3 { margin-top:28px; }
:is(.module-app-layer__content-section-block, .module-app-layer__panel, .module-app-layer__page-summary-box)>h3+* { margin-top:9px; }
a.module-app-layer__versus-compare-panel::after { content:"→"; position:absolute; top:10px; right:10px; display:grid; place-items:center; width:19px; height:19px; border-radius:50%; background:var(--acc-s); color:var(--acc-i); font-size:13px; font-weight:800; line-height:1; transition:transform .13s ease,background .13s ease,color .13s ease; }
a.module-app-layer__versus-compare-panel[href^="#"]::after { transform:rotate(45deg); }
a.module-app-layer__versus-compare-panel[href^="#"]:hover::after, a.module-app-layer__versus-compare-panel[href^="#"]:focus-visible::after { transform:rotate(45deg) translate(1.5px,1.5px); }
a.module-app-layer__versus-compare-panel:hover::after { background:var(--acc); color:#fff; transform:translateX(2px); }
a.module-app-layer__versus-compare-panel:focus-visible::after { background:var(--acc); color:#fff; transform:translateX(2px); }
.module-app-layer__versus-compare-panel:focus-visible { border-color:var(--acc); }
.module-app-layer__price-trend-line-hover-dots { position:absolute; inset:0; pointer-events:none; }
.module-app-layer__price-trend-line-hover-dots>i { position:absolute; left:calc(var(--x)*1%); top:calc(var(--yp)*1%); width:7px; height:7px; margin:-3.5px 0 0 -3.5px; border-radius:50%; background:var(--up); display:block; }

.module-app-layer__stat-tile-value small { font-size:14px; font-weight:700; color:var(--mut); margin-left:2px; }

.module-app-layer__stat-tile-link-bars i.module-app-layer__bar-segment-emphasis { background:var(--acc); }

.module-app-layer__price-trend-line-hover { position:relative; }
.module-app-layer__price-trend-line-hover-hitarea { position:absolute; inset:0; display:flex; }
.module-app-layer__price-trend-line-hover-hitarea>button { flex:1 1 0; min-width:0; height:100%; border:0; background:transparent; padding:0; cursor:pointer; position:relative; border-radius:3px; }
.module-app-layer__price-trend-line-hover-hitarea>button:hover { background:color-mix(in srgb,var(--acc)9%,transparent); outline:0; }
.module-app-layer__price-trend-line-hover-hitarea>button:focus-visible { background:color-mix(in srgb,var(--acc)9%,transparent); outline:0; }
.module-app-layer__price-trend-line-hover-hitarea>button::before { content:""; position:absolute; left:50%; top:0; bottom:0; width:1px; background:var(--acc); opacity:0; transition:opacity .12s; }
.module-app-layer__card-set-name { display:block; margin-top:3px; font-size:15px; font-weight:700; color:var(--ink2); letter-spacing:-.01em; line-height:1.35; }
.module-app-layer__price-trend-line-hover-points>button { position:absolute; left:calc(var(--x)*1%); top:calc(var(--yp)*1%); width:26px; height:26px; margin:-13px 0 0 -13px; border:0; background:transparent; padding:0; cursor:pointer; border-radius:50%; }
.module-app-layer__price-trend-line-hover-points>button:hover, .module-app-layer__price-trend-line-hover-points>button.module-app-layer__entity-link-lit { background:color-mix(in srgb,var(--acc)18%,transparent); outline:0; }
.module-app-layer__price-trend-line-hover-points>i { transition:transform .16s ease; }
.module-app-layer__price-trend-line-hover-points>i.module-app-layer__entity-link-lit, .module-app-layer__price-trend-line-hover-points>i.is-dot-hover-lit { transform:scale(1.15); }
@media (prefers-reduced-motion:reduce) {
.module-app-layer__price-trend-line-hover-points>i { transition:none; }
}
.module-app-layer__price-trend-line-hover-points>button:focus-visible { background:color-mix(in srgb,var(--acc)18%,transparent); outline:0; }
.module-app-layer__price-trend-line-tooltip .module-app-layer__price-trend-line-delta-arrow.u-value-direction-rising { color:#6EE7A8; }
.module-app-layer__price-trend-line-tooltip .module-app-layer__price-trend-line-delta-arrow.u-value-direction-falling { color:#FF9C8F; }
.module-app-layer__price-trend-line-hover-hitarea>button:hover::before { opacity:1; }
.module-app-layer__price-trend-line-hover-hitarea>button:focus-visible::before { opacity:1; }
.module-app-layer__price-trend-line-hover-hitarea>button.module-app-layer__table-row-current:hover { background:color-mix(in srgb,var(--dn)11%,transparent); }
.module-app-layer__price-trend-line-hover-hitarea>button.module-app-layer__table-row-current:focus-visible { background:color-mix(in srgb,var(--dn)11%,transparent); }
.module-app-layer__funnel-step-chart { margin-top:14px; padding:15px 15px 13px; background:var(--surf); border:1px solid var(--line2); border-radius:var(--r-s); }
.module-app-layer__price-trend-line-hover-hitarea>button.module-app-layer__table-row-current::before { background:var(--dn); }
.module-app-layer__funnel-step-chart-heading { display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:11px; }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell { position:relative; display:flex; flex-direction:column; gap:4px; width:100%; height:100%; padding:7px; border-radius:12px; overflow:hidden; background:linear-gradient(150deg,#FFE9A3 0%,#F5C542 26%,#E8A424 55%,#F7D96B 78%,#D9931C 100%); }
.module-app-layer__funnel-step-chart-title { margin:0; font-size:16px; font-weight:800; color:var(--ink); }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell-header { position:relative; z-index:2; display:flex; align-items:baseline; justify-content:space-between; gap:6px; padding:3px 7px; border-radius:5px; background:rgba(28,18,4,.30); color:#FFF7E2; }
.module-app-layer__funnel-step-chart-reading-hint { font-size:13px; color:var(--mut); font-weight:600; }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell-footer { position:relative; z-index:2; display:flex; align-items:baseline; justify-content:space-between; gap:6px; padding:3px 7px; border-radius:5px; background:rgba(28,18,4,.30); color:#FFF7E2; }
.module-app-layer__funnel-step-chart-label { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell-header b { font-size:13px; font-weight:800; letter-spacing:-.02em; }
.module-app-layer__funnel-step-chart-subtitle { display:grid; grid-template-columns:minmax(0,1fr)128px; gap:10px; align-items:center; }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell-header em { font-style:normal; font-size:13px; font-weight:800; color:#FFD9A0; }
.module-app-layer__funnel-step-chart-subtitle>* { min-width:0; }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell-footer b { font-size:13px; font-weight:700; }
.module-app-layer__funnel-step-chart-band { position:relative; height:34px; width:100%; border-radius:6px; overflow:hidden; background:var(--line2); border:1px solid var(--line2); box-sizing:border-box; }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell-footer em { font-style:normal; font-size:13px; font-weight:800; font-family:ui-monospace,Menlo,monospace; color:#FFE3AE; }
.module-app-layer__funnel-step-chart-band i { display:block; height:100%; width:var(--w); border-radius:5px; background:color-mix(in srgb,var(--acc)72%,var(--surf)); min-width:2px; }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell-artwork { position:relative; z-index:2; flex:1; border-radius:7px; overflow:hidden; border:2px solid rgba(255,247,214,.75); background:radial-gradient(120% 90% at 26% 18%,#FFF3B0 0%,#FFC24A 22%,#FF7A2F 48%,#E8352E 70%,#A32BC4 100%); }
.module-app-layer__funnel-step-chart-band b { position:absolute; left:11px; top:0; height:100%; display:flex; align-items:center; font-size:14px; font-weight:800; color:var(--ink); white-space:nowrap; }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell-flame { position:absolute; inset:-14% -8% -22% -8%; background:radial-gradient(46% 40% at 34% 62%,rgba(255,236,150,.95)0%,rgba(255,150,40,.72)42%,transparent 72%),radial-gradient(38% 34% at 70% 40%,rgba(255,110,60,.85)0%,transparent 70%),radial-gradient(30% 26% at 56% 84%,rgba(255,215,120,.8)0%,transparent 74%); }
.module-app-layer__funnel-step-chart-subtitle--current .module-app-layer__funnel-step-chart-band i { background:var(--acc); }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell-glow { position:absolute; inset:0; background:radial-gradient(60% 44% at 50% 8%,rgba(255,255,255,.55)0%,transparent 62%); }
.module-app-layer__funnel-step-chart-value { text-align:right; font-size:15px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; overflow:visible; text-overflow:clip; white-space:nowrap; color:var(--ink); }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell-holo { position:absolute; inset:0; z-index:3; pointer-events:none; mix-blend-mode:color-dodge; opacity:.30; background:repeating-linear-gradient(112deg,rgba(255,80,80,.55)0 7px,rgba(255,210,60,.55)7px 14px,rgba(90,235,140,.55)14px 21px,rgba(70,190,255,.55)21px 28px,rgba(190,110,255,.55)28px 35px); }
.module-app-layer__funnel-step-chart-value em { display:block; font-style:normal; font-size:13px; font-weight:600; color:var(--mut); white-space:normal; }
.module-card-holo__thumb-popup-artwork-frame .module-app-layer__composition-donut-stat-cell-sheen { position:absolute; top:-60%; left:-120%; width:70%; height:220%; z-index:4; pointer-events:none; transform:rotate(19deg); background:linear-gradient(90deg,transparent,rgba(255,255,255,.62)46%,rgba(255,255,255,.9)52%,transparent); animation:sheen 4.6s ease-in-out infinite; }
.module-app-layer__funnel-step-chart-arrow { display:block; width:17px; height:17px; margin:0 auto; color:var(--mut); }
.module-app-layer__funnel-step-chart-arrow path { stroke:currentColor; stroke-width:2.4; fill:none; stroke-linecap:round; stroke-linejoin:round; }
.module-app-layer__funnel-step-chart-footnote { margin:11px 0 0; font-size:13px; color:var(--mut); line-height:1.6; }
.module-app-layer__funnel-step-chart-footnote b { color:var(--ink2); font-weight:800; }
a.module-app-layer__stat-tile-metric-content:hover { border-color:var(--acc); }
.module-app-layer__price-trend-line-tooltip-arrow.u-value-direction-rising { color:#6EE7A8; }
.module-app-layer__price-trend-line-tooltip-arrow.u-value-direction-falling { color:#FF9C8F; }
.module-app-layer__data-story-tile-value.u-value-direction-rising { color:var(--up); }
.module-app-layer__data-story-tile-value.u-value-direction-falling { color:var(--dn); }
.module-app-layer__attribute-distribution-bar-fill--width { background:var(--warn); }
.module-app-layer__attribute-chip-link:hover { transform:none; }
.module-app-layer__attribute-chip-link i { font-style:normal; padding:2px 7px; border-radius:999px; font-size:13px; font-weight:800; background:rgba(255,255,255,.16); color:inherit; opacity:.9; display:none; }
.module-app-layer__attribute-chip-link--rare { background:color-mix(in srgb,var(--c5)20%,var(--surf)); color:var(--c5); border-color:color-mix(in srgb,var(--c5)42%,transparent); box-shadow:0 2px 9px color-mix(in srgb,var(--c5)22%,transparent); }
.module-app-layer__attribute-chip-link--mechanic { background:color-mix(in srgb,var(--c1)20%,var(--surf)); color:var(--c1); border-color:color-mix(in srgb,var(--c1)42%,transparent); box-shadow:0 2px 9px color-mix(in srgb,var(--c1)22%,transparent); }
.module-app-layer__attribute-chip-link--holo { background:color-mix(in srgb,var(--c2)20%,var(--surf)); color:var(--c2); border-color:color-mix(in srgb,var(--c2)42%,transparent); position:relative; overflow:hidden; }
.module-app-layer__attribute-chip-link--regulation { background:color-mix(in srgb,var(--c3)22%,var(--surf)); color:var(--c3); border-color:color-mix(in srgb,var(--c3)46%,transparent); box-shadow:0 2px 9px color-mix(in srgb,var(--c3)24%,transparent); }
.module-app-layer__attribute-chip-link--language { background:var(--surf2); color:var(--ink2); border-color:var(--line2); }
.module-app-layer__attribute-chip-link--pokedex { background:var(--surf2); color:var(--ink2); border-color:var(--line2); }
.module-app-layer__attribute-chip-link--rare i { background:color-mix(in srgb,currentColor 20%,transparent); }
.module-app-layer__attribute-chip-link--mechanic i { background:color-mix(in srgb,currentColor 20%,transparent); }
.module-app-layer__attribute-chip-link--holo i { background:color-mix(in srgb,currentColor 20%,transparent); }
.module-app-layer__attribute-chip-link--regulation i { background:color-mix(in srgb,currentColor 20%,transparent); }
.module-app-layer__attribute-chip-link--language i { background:var(--surf); color:var(--mut); }
.module-app-layer__attribute-chip-link--pokedex i { background:var(--surf); color:var(--mut); }
.module-app-layer__attribute-chip-link--holo::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:.3; background:repeating-linear-gradient(112deg,rgba(255,90,90,.5)0 5px,rgba(255,205,70,.5)5px 10px,rgba(90,235,150,.5)10px 15px,rgba(80,190,255,.5)15px 20px,rgba(195,110,255,.5)20px 25px); mix-blend-mode:color-dodge; }
.module-app-layer__stat-tile-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:7px; margin-top:12px; margin:12px 0 0; }
.module-app-layer__stat-tile-metric-bar>i.is-rv-anim-go { transform-origin:left center; animation:bar-fill-x 1.5s linear .2s both; }
.module-app-layer__stat-tile-grid>* { min-width:0; }
.module-app-layer__stat-tile-metric-content { position:relative; display:block; padding:11px 12px; border:1px solid var(--line2); border-radius:var(--r-s); background:var(--surf); text-decoration:none; color:inherit; }
a.module-app-layer__stat-tile-metric-content::after {
  content: "→"; position: absolute; right: 12px; bottom: 12px;
  display: grid; place-items: center;
  width: 19px; height: 19px; border-radius: 999px;
  font-size: 13px; font-weight: 800; line-height: 1;
  background: var(--acc-s); color: var(--acc-i); opacity: 1;
  transition: background .15s, color .15s, transform .15s;
  pointer-events: none;
}
a.module-app-layer__stat-tile-metric-content:hover::after, a.module-app-layer__stat-tile-metric-content:focus-visible::after { background: var(--acc); color: #fff; transform: translateX(2px); }
.module-app-layer__stat-tile-metric-key { display:block; font-size:13px; color:var(--mut); font-weight:600; margin-bottom:3px; }
.module-app-layer__stat-tile-metric-value { display:block; font-size:20px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; overflow:visible; text-overflow:clip; }
.module-app-layer__stat-tile-metric-value small { font-size:13px; color:var(--mut); font-weight:700; margin-left:4px; }
.module-app-layer__stat-tile-metric-bar { display:block; height:7px; margin-top:7px; border-radius:99px; background:var(--line2); overflow:hidden; }
.module-app-layer__stat-tile-metric-subtitle { display:block; font-size:13px; color:var(--mut); margin-top:5px; line-height:1.5; }

.module-app-layer__attribute-distribution-track { grid-column:1/-1; display:flex; height:9px; border-radius:5px; background:var(--surf2); border:1px solid var(--line); overflow:hidden; }
.module-app-layer__attribute-distribution-track i { display:block; height:100%; background:var(--acc); border-radius:5px 0 0 5px; }
.module-app-layer__panel>*+* { margin-top:30px; }
.module-app-layer__attribute-distribution-list>li.module-app-layer__table-row-current .module-app-layer__attribute-distribution-track i { background:var(--acc-i); }

.module-app-layer__funnel-step-chart-band>i.is-rv-anim-go { transform-origin:left center; animation:bar-fill-x 1.5s linear .2s both; }
.module-app-layer__section-takeaway-block { margin-top:12px; padding:13px 15px; background:var(--surf); border:1px solid var(--line2); border-radius:var(--r-s); margin:12px 0; }
.module-app-layer__section-takeaway-block-title { margin:0 0 8px; font-size:13px; font-weight:800; letter-spacing:.05em; color:var(--acc-i); text-transform:uppercase; }
.module-app-layer__section-takeaway-block ul { margin:0; padding-left:16px; display:flex; flex-direction:column; gap:5px; }
.module-app-layer__section-takeaway-block li { font-size:16px; color:var(--ink2); line-height:1.7; }
.module-app-layer__section-takeaway-block b { color:var(--ink); font-weight:700; margin-right:3px; }

.module-app-layer__purchase-action-row .module-app-layer__outline-action-button { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; column-gap:6px; row-gap:1px; line-height:1.25; }

.module-app-layer__purchase-action-row .module-app-layer__outline-action-button em { font-style:normal; font-size:13px; font-weight:600; color:var(--mut); flex-basis:100%; text-align:center; }

.module-app-layer__attribute-chip-link--format { background:color-mix(in srgb,var(--c2)20%,var(--surf)); color:var(--c2); border-color:color-mix(in srgb,var(--c2)44%,transparent); }
.module-app-layer__price-trend-line-hover--figure { position:relative; display:block; container-type:inline-size; }
.module-app-layer__price-trend-line-hover-points { position:absolute; inset:0; }
.module-app-layer__price-trend-line-hover-points>i { position:absolute; left:calc(var(--x)*1%); top:calc(var(--yp)*1%); width:var(--d,7px); height:var(--d,7px); margin:calc(var(--d,7px)/ -2)0 0 calc(var(--d,7px)/ -2); display:block; border-radius:50%; background:var(--dc,var(--acc)); pointer-events:none; }
.u-direction-triangle-icon { display:inline-grid; place-items:center; width:15px; height:15px; vertical-align:-2px; }
.u-direction-triangle-icon svg { width:100%; height:100%; display:block; }
.u-direction-triangle-icon--up { color:var(--up); }
.u-direction-triangle-icon--down { color:var(--dn); }
table td .u-tabular-number { white-space:nowrap; }
table .u-tabular-number { white-space:nowrap; }
.module-app-layer__cross-axis-summary-link { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:10px; padding:10px 13px; border:1px solid var(--line2); border-left:4px solid var(--c2); border-radius:var(--r-s); background:var(--surf2); text-decoration:none; color:inherit; transition:border-color .13s,background .13s; }
.module-app-layer__cross-axis-summary-link:hover { border-color:var(--c2); background:color-mix(in srgb,var(--c2)9%,var(--surf2)); }
.module-app-layer__cross-axis-summary-link:focus-visible { border-color:var(--c2); background:color-mix(in srgb,var(--c2)9%,var(--surf2)); }
.module-app-layer__cross-axis-summary-link-key { flex:0 0 auto; font-size:13px; font-weight:800; color:var(--c2); letter-spacing:-.01em; }
.module-app-layer__cross-axis-summary-link-value { display:flex; align-items:center; gap:8px; flex-wrap:wrap; min-width:0; font-size:14px; }
.module-app-layer__cross-axis-summary-link-value b { font-weight:800; color:var(--ink); }
.module-app-layer__cross-axis-summary-link-value i { font-style:normal; font-weight:600; color:var(--ink2); }
.module-app-layer__cross-axis-summary-link-value>*+*::before { content:"·"; margin-right:8px; color:var(--mut); font-weight:400; }
.module-app-layer__cross-axis-summary-link-group { margin-left:auto; flex:0 0 auto; display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:800; color:var(--mut); }
.module-app-layer__cross-axis-summary-link-group::after { content:"→"; display:inline-grid; place-items:center; width:20px; height:20px; border-radius:50%; background:color-mix(in srgb,var(--c2)18%,transparent); color:var(--c2); font-size:13px; transition:background .13s,color .13s,transform .13s; }
.module-app-layer__cross-axis-summary-link:hover .module-app-layer__cross-axis-summary-link-group { color:var(--c2); }
.module-app-layer__cross-axis-summary-link:hover .module-app-layer__cross-axis-summary-link-group::after { background:var(--c2); color:#fff; transform:translateX(2px); }
.u-sponsored-disclosure-note { margin:9px 0 0; font-size:13px; color:var(--mut); line-height:1.55; }
a.module-app-layer__attribute-chip-link { text-decoration:none; color:inherit; cursor:pointer; transition:border-color .12s,color .12s; }
a.module-app-layer__attribute-chip-link:hover { border-color:var(--acc); color:var(--acc-i); }
a.module-app-layer__attribute-chip-link:focus-visible { border-color:var(--acc); color:var(--acc-i); outline:2px solid var(--acc); outline-offset:2px; }
.module-popup__card-image-fallback .module-app-layer__composition-donut-stat-cell-holo { opacity:0 !important; display:none; }
.module-popup__card-image-fallback .module-app-layer__composition-donut-stat-cell-sheen { opacity:0 !important; display:none; }
.module-app-layer__quick-fact-card.module-app-layer__state-paid-source { background:color-mix(in srgb,var(--warn)7%,var(--surf)); border-color:color-mix(in srgb,var(--warn)34%,transparent); }
.module-app-layer__composition-donut-stat-cell.module-app-layer__state-paid-source { background:color-mix(in srgb,var(--warn)7%,var(--surf)); border-color:color-mix(in srgb,var(--warn)34%,transparent); }
.module-app-layer__quick-fact-card.module-app-layer__state-unavailable-source { background:color-mix(in srgb,var(--dn)7%,var(--surf)); border-color:color-mix(in srgb,var(--dn)32%,transparent); }
.module-app-layer__composition-donut-stat-cell.module-app-layer__state-unavailable-source { background:color-mix(in srgb,var(--dn)7%,var(--surf)); border-color:color-mix(in srgb,var(--dn)32%,transparent); }

.module-app-layer__summary-metric-five-column-grid>* { min-width:0; }
.module-app-layer__meta-tile-grid>* { min-width:0; }
.module-app-layer__meta-tile-value.u-tabular-number { overflow:visible; text-overflow:clip; white-space:normal; word-break:keep-all; overflow-wrap:anywhere; } /* HCU 09-29 · u-tabular-number 는 글자 값에도 붙음(실측 «환율로 환산하는 법») → nowrap 이면 넘침 · 낱말 단위 줄바꿈 */
@media (max-width:1180px) {
.module-app-layer__summary-metric-five-column-grid { grid-template-columns:1.3fr 1fr 1fr; }
}
@media (max-width:1080px) and (min-width:521px) {
.module-app-layer__meta-tile-grid { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:1060px) {
.module-app-layer__quick-fact-grid { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:1000px) {
.module-app-layer__quick-fact-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:960px) {
.module-app-layer__summary-metric-five-column-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:900px) {
.module-app-layer__split-columns { flex-direction:column; align-items:center; }
.module-app-layer__meta-tile-grid { grid-template-columns:repeat(3,1fr); }
.module-app-layer__stat-tile-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:860px) {
.module-app-layer__stat-tile-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:820px) {
.module-app-layer__split-columns { flex-direction:column; align-items:center; }
.module-app-layer__side-content-column { gap:10px; }
.module-app-layer__side-content-column .module-app-layer__purchase-action-row { order:1; margin-top:2px; }
.module-app-layer__side-content-column .module-app-layer__purchase-action-caveat { order:2; margin-top:0; }
.module-app-layer__side-content-column .module-app-layer__summary-metric-five-column-grid { order:3; margin-top:4px; }
.module-app-layer__side-content-column .module-app-layer__meta-tile-grid { order:4; margin-top:0; }
.module-app-layer__purchase-action-row { grid-template-columns:1fr; gap:8px; }
.module-app-layer__purchase-action-row .module-app-layer__primary-action-button { padding:13px 12px; font-size:14px; }
.module-app-layer__purchase-action-row .module-app-layer__outline-action-button { padding:12px 10px; }
.module-app-layer__purchase-action-row .module-app-layer__primary-action-button:first-child { grid-column:1/-1; }
.module-app-layer__panel { padding:0; border:0; background:none; border-radius:0; }
.module-app-layer__panel::before { position:static; display:inline-block; margin:0 0 10px; }
.module-app-layer__quick-fact-card { padding:10px; }
.module-app-layer__panel>*+* { margin-top:24px; }
.module-app-layer__cross-axis-summary-link { gap:8px; }
.module-app-layer__cross-axis-summary-link-group { margin-left:0; width:100%; }
}
@media (max-width:760px) {
.module-app-layer__versus-compare-panel { grid-template-columns:1fr; gap:10px; }
}
@media (max-width:720px) {
.module-app-layer__composition-donut-stat-panel { grid-template-columns:1fr 1fr; }
.module-app-layer__composition-donut-stat-panel>.module-app-layer__composition-donut-stat-cell:nth-child(odd) { border-left:0; }
.module-app-layer__composition-donut-stat-panel>.module-app-layer__composition-donut-stat-cell:nth-child(n+3) { border-top:1px solid var(--line); }
}
@media (max-width:640px) {
.module-app-layer__panel { padding:20px 12px 13px; }
.module-app-layer__funnel-step-chart-subtitle { grid-template-columns:1fr; gap:5px; }
.module-app-layer__funnel-step-chart-value { text-align:center; }
.module-app-layer__funnel-step-chart-band { min-width:88px; }
}
@media (max-width:620px) {
.module-app-layer__summary-metric-five-column-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:560px) {
.module-app-layer__quick-fact-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:520px) {
/* 🔴 2026-09-28(HBD조 · 지휘자 정정 · 사용자 「작은 타일 카드는 여러 열 배치」) — 작은 타일(quick_facts)은 모바일도 2열(1열 아님). 되돌리기 = 1fr. */
.module-app-layer__quick-fact-grid { grid-template-columns:repeat(2,1fr); }
.module-app-layer__meta-tile-grid { grid-template-columns:repeat(2,1fr); }

.module-app-layer__purchase-action-row { grid-template-columns:1fr; }
.module-app-layer__purchase-action-row .module-app-layer__primary-action-button { grid-column:1/-1; }
/* 🔴 2026-09-28(HBM조 · T-89 · 짧은 값 타일 모바일 2열) — 되돌리기 = 1fr. */
.module-app-layer__stat-tile-grid { grid-template-columns:repeat(2,1fr); }

}
@media (prefers-reduced-motion:no-preference) {
.module-app-layer__attribute-distribution-bar-fill.is-rv-anim-go { transform-origin:left center; animation:tg-bar-fill 1.5s linear .2s both; }
.module-app-layer__attribute-distribution-track>i.is-rv-anim-go { transform-origin:left center; animation:tg-bar-fill 1.5s linear .2s both; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(1) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.20s; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(2) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.24s; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(3) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.28s; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(4) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.32s; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(5) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.36s; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(6) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.40s; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(7) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.44s; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(8) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.48s; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(9) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.52s; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(10) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.56s; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(11) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.60s; }
:is(.module-app-layer__distribution-bar-row, .module-app-layer__ranked-thumbnail-list-rank-panel-bar, .module-app-layer__group-value-compare-cell, .module-app-layer__badge-bar-row, .module-app-layer__ranked-thumbnail-list-rank-row, .module-app-layer__attribute-distribution-list>li):nth-child(n+12) :is(.module-app-layer__distribution-bar-fill, .module-app-layer__ranked-thumbnail-list-rank-panel-bar-footnote, .module-app-layer__attribute-distribution-bar-fill, .module-app-layer__attribute-distribution-track>i, .module-app-layer__bar-row-track>i, .module-app-layer__group-value-compare-cell-bar>span) { animation-delay:.64s; }
}
@media (prefers-reduced-motion:reduce) {
.module-app-layer__attribute-distribution-bar-fill { animation:none; }

.module-app-layer__stat-tile-metric-bar i { animation:none; }

.module-app-layer__composition-donut-stat-cell-sheen { animation:none; opacity:.28; left:12%; }
.module-app-layer__stat-tile-metric-bar>i { animation:none; }
.module-app-layer__funnel-step-chart-band>i { animation:none; }
}
@media (scripting:none) {
.module-app-layer__stat-tile-metric-bar>i { animation:none; }
.module-app-layer__funnel-step-chart-band>i { animation:none; }
}
a.module-app-layer__vertical-timeline-rail-rank:hover .u-row-entrance-arrow-badge { border-color:var(--acc); }

.module-app-layer__stat-tile-link-bars>i.module-app-layer__bar-segment-emphasis { background:var(--acc); }
.module-app-layer__sibling-axis-link-card:hover .u-row-entrance-arrow-badge { border-color:var(--acc); background:var(--acc); color:#fff; }
.module-app-layer__entity-spec-summary-strip>a { display:flex; justify-content:space-between; gap:10px; align-items:baseline; padding:7px 2px; border-bottom:1px solid var(--line2); font-size:13px; text-decoration:none; color:inherit; }
.module-app-layer__entity-spec-summary-strip>span { display:flex; justify-content:space-between; gap:10px; align-items:baseline; padding:7px 2px; border-bottom:1px solid var(--line2); font-size:13px; text-decoration:none; color:inherit; }
.module-app-layer__entity-spec-summary-strip>a:last-child { border-bottom:0; }
.module-app-layer__entity-spec-summary-strip>span:last-child { border-bottom:0; }
.module-app-layer__entity-spec-summary-strip>a:hover em { color:var(--acc); }
.module-app-layer__visual-block-box--split .module-app-layer__composition-donut-ring-box { margin-bottom:0; }
a.module-app-layer__quick-fact-card:hover { border-color:var(--acc); }
.module-app-layer__stat-tile-subtitle b { color:var(--ink); font-weight:700; }
a:focus-visible .u-row-entrance-arrow-badge { background:var(--acc); border-color:var(--acc); color:#fff; }
.module-app-layer__sibling-axis-link-card:focus-visible .u-row-entrance-arrow-badge { background:var(--acc); border-color:var(--acc); color:#fff; }
.module-app-layer__data-story-tile:hover .u-row-entrance-arrow-badge { background:var(--acc); border-color:var(--acc); color:#fff; }
.module-app-layer__data-story-tile:focus-visible .u-row-entrance-arrow-badge { background:var(--acc); border-color:var(--acc); color:#fff; }
.module-app-layer__versus-compare-panel--legend .module-app-layer__stat-tile-value { font-size:29px; }
.module-app-layer__versus-compare-panel--legend .module-app-layer__stat-tile-key { font-size:13px; } /* HBS 09-28 · 12px → 13px */
.module-app-layer__attribute-chip-link[aria-pressed="true"] { background:var(--card-edge,hsl(47 100% 78%)); border-color:transparent; color:hsl(224 30% 10%); }
.module-app-layer__attribute-chip-link.is-state-current-active { background:var(--card-edge,hsl(47 100% 78%)); border-color:transparent; color:hsl(224 30% 10%); }
.module-app-layer__attribute-chip-link:focus-visible { outline:2px solid hsl(43 90% 66%); outline-offset:3px; }

td.u-tabular-number { font-variant-numeric:tabular-nums; white-space:nowrap; text-align:right; }
.module-app-layer__composition-donut-stat-panel>.module-app-layer__composition-donut-stat-cell { padding:19px 14px; border:0; border-left:1px solid var(--line); border-radius:0; background:transparent; }
/* 🔴 2026-09-27 지휘자(사용자 「여기 전체 테두리가 있고 또 … 여기 테두리가 있어서 이중으로 테두리가 있어서 이상해. 수정해」 · 예금 홈 앱층) — 패널 안 숫자 블록도 칸과 같은 처리: 자기 테두리·배경 없음(패널 테두리 하나만) */
.module-app-layer__composition-donut-stat-panel>.module-app-layer__headline-stat-block { border:0; border-radius:0; background:transparent; }
/* 🔴 2026-09-28(HBD조 · 지휘자 항목7 · HBC 보고 1절) — 순위 상자가 hub 판(위 규칙으로 headline-stat-block 은 이미 테두리 0) 안에서
   자기 테두리를 그대로 가져 판 테두리와 다시 겹친다. 위 줄과 같은 원칙(패널 테두리 하나만)을 그대로 따라 순위 상자 쪽 테두리를 0으로 뺀다. */
.module-app-layer__composition-donut-stat-panel .module-app-layer__headline-stat-rank { border:0; }
.module-app-layer__summary-metric-five-column-grid>.module-app-layer__composition-donut-stat-cell { padding:11px 12px 9px; background:var(--surf); }
@media (max-width:560px) {

.module-app-layer__versus-compare-panel { grid-template-columns:1fr; }
}
@media (max-width:720px) {
.module-app-layer__split-columns { grid-template-columns:minmax(0,1fr); }
}
.module-app-layer__data-story-tile, .module-app-layer__cross-axis-summary-link { position: relative; }
.module-app-layer__cross-axis-summary-link::after {
  content: "\2192";
  position: absolute; right: 12px; bottom: 12px;
  font-size: 13px; font-weight: 800; line-height: 1;
  color: var(--acc-i); opacity: .55; transition: opacity .15s, transform .15s;
  pointer-events: none;
}
.module-app-layer__cross-axis-summary-link:hover::after, .module-app-layer__cross-axis-summary-link:focus-visible::after { opacity: 1; transform: translateX(2px); }
.module-app-layer__cross-axis-summary-link::after { content: "→"; }
.module-app-layer__stat-radar-hover > .module-app-layer__price-trend-line-hover-points { pointer-events:none; }
.module-app-layer__stat-radar-hover > .module-app-layer__price-trend-line-hover-points > button { pointer-events:auto; }
.module-app-layer__cross-axis-summary-link::after {
  display: grid; place-items: center;
  width: 19px; height: 19px; border-radius: 999px;
  background: var(--acc-s); color: var(--acc-i); opacity: 1;
}
.module-app-layer__cross-axis-summary-link::after { content: none; }
.module-app-layer__cross-axis-summary-link:hover::after, .module-app-layer__cross-axis-summary-link:focus-visible::after { background: var(--acc); color: #fff; opacity: 1; }
@media (min-width:721px) {
.module-app-layer__composition-donut-ring-box:not(:has(.module-app-layer__composition-donut-stat-panel)) {
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    align-items: stretch;
  }
.module-app-layer__composition-donut-ring-box:not(:has(.module-app-layer__composition-donut-stat-panel)) > .module-app-layer__composition-donut-legend {
    min-width: 0;
  }
.module-app-layer__composition-donut-ring-box:not(:has(.module-app-layer__composition-donut-stat-panel)) > .module-app-layer__composition-donut-ring {

    width: auto; height: 100%;
    aspect-ratio: 1 / 1;
    min-width: 132px; min-height: 132px;
    max-width: 260px; max-height: 260px;
    align-self: center;
  }
.module-app-layer__composition-donut-ring-box:not(:has(.module-app-layer__composition-donut-stat-panel)) > .module-app-layer__composition-donut-legend { align-self: center; }
}
@keyframes tg-bar-fill {from{transform:scaleX(0)}}
@keyframes bar-fill-x {from{transform:scaleX(0)}}

/* ── 코너 링크 화살표 규칙(지휘자 일괄 · 2026-09-07) ── */
/* ① 링크가 아니면 코너 화살표 없음 */
.module-app-layer__stat-card:not(a)::after,
.module-app-layer__cross-axis-summary-link:not(a)::after,
.module-app-layer__affiliate-marketplace-offer-card:not(a)::after,
.module-app-layer__meta-tile:not(a)::after,
.module-app-layer__versus-compare-panel:not(a)::after,
.module-app-layer__data-story-tile:not(a)::after,
.module-app-layer__bento-grid-item:not(a)::after,
a.module-app-layer__stat-card:not([href])::after,
a.module-app-layer__cross-axis-summary-link:not([href])::after,
a.module-app-layer__affiliate-marketplace-offer-card:not([href])::after,
a.module-app-layer__meta-tile:not([href])::after,
a.module-app-layer__versus-compare-panel:not([href])::after,
a.module-app-layer__data-story-tile:not([href])::after,
a.module-app-layer__bento-grid-item:not([href])::after { content: none; }
/* ② 카드 안에 CTA 버튼이 있으면 코너 화살표 없음 — 버튼에 이미 화살표가 붙어 있다 */
.module-app-layer__stat-card:has(.module-app-layer__affiliate-marketplace-offer-card-visit-button)::after,
.module-app-layer__stat-card:has(.module-app-layer__cta)::after,
.module-app-layer__stat-card:has(.module-app-layer__stat-card-go)::after,
.module-app-layer__stat-card:has(.module-app-layer__link-grid-card-cta)::after,
.module-app-layer__cross-axis-summary-link:has(.module-app-layer__affiliate-marketplace-offer-card-visit-button)::after,
.module-app-layer__cross-axis-summary-link:has(.module-app-layer__cta)::after,
.module-app-layer__cross-axis-summary-link:has(.module-app-layer__stat-card-go)::after,
.module-app-layer__cross-axis-summary-link:has(.module-app-layer__link-grid-card-cta)::after,
.module-app-layer__affiliate-marketplace-offer-card:has(.module-app-layer__affiliate-marketplace-offer-card-visit-button)::after,
.module-app-layer__affiliate-marketplace-offer-card:has(.module-app-layer__cta)::after,
.module-app-layer__affiliate-marketplace-offer-card:has(.module-app-layer__stat-card-go)::after,
.module-app-layer__affiliate-marketplace-offer-card:has(.module-app-layer__link-grid-card-cta)::after,
.module-app-layer__meta-tile:has(.module-app-layer__affiliate-marketplace-offer-card-visit-button)::after,
.module-app-layer__meta-tile:has(.module-app-layer__cta)::after,
.module-app-layer__meta-tile:has(.module-app-layer__stat-card-go)::after,
.module-app-layer__meta-tile:has(.module-app-layer__link-grid-card-cta)::after,
.module-app-layer__versus-compare-panel:has(.module-app-layer__affiliate-marketplace-offer-card-visit-button)::after,
.module-app-layer__versus-compare-panel:has(.module-app-layer__cta)::after,
.module-app-layer__versus-compare-panel:has(.module-app-layer__stat-card-go)::after,
.module-app-layer__versus-compare-panel:has(.module-app-layer__link-grid-card-cta)::after,
.module-app-layer__data-story-tile:has(.module-app-layer__affiliate-marketplace-offer-card-visit-button)::after,
.module-app-layer__data-story-tile:has(.module-app-layer__cta)::after,
.module-app-layer__data-story-tile:has(.module-app-layer__stat-card-go)::after,
.module-app-layer__data-story-tile:has(.module-app-layer__link-grid-card-cta)::after,
.module-app-layer__bento-grid-item:has(.module-app-layer__affiliate-marketplace-offer-card-visit-button)::after,
.module-app-layer__bento-grid-item:has(.module-app-layer__cta)::after,
.module-app-layer__bento-grid-item:has(.module-app-layer__stat-card-go)::after,
.module-app-layer__bento-grid-item:has(.module-app-layer__link-grid-card-cta)::after { content: none; }
/* ③ 같은 페이지 앵커는 4시 30분(↘) — 다른 페이지·외부는 3시(→) 그대로 */
a.module-app-layer__stat-card[href^="#"]::after,
a.module-app-layer__cross-axis-summary-link[href^="#"]::after,
a.module-app-layer__affiliate-marketplace-offer-card[href^="#"]::after,
a.module-app-layer__meta-tile[href^="#"]::after,
a.module-app-layer__versus-compare-panel[href^="#"]::after,
a.module-app-layer__data-story-tile[href^="#"]::after,
a.module-app-layer__bento-grid-item[href^="#"]::after { transform: rotate(45deg); }
a.module-app-layer__stat-card[href^="#"]:hover::after,
a.module-app-layer__cross-axis-summary-link[href^="#"]:hover::after,
a.module-app-layer__affiliate-marketplace-offer-card[href^="#"]:hover::after,
a.module-app-layer__meta-tile[href^="#"]:hover::after,
a.module-app-layer__versus-compare-panel[href^="#"]:hover::after,
a.module-app-layer__data-story-tile[href^="#"]:hover::after,
a.module-app-layer__bento-grid-item[href^="#"]:hover::after,
a.module-app-layer__stat-card[href^="#"]:focus-visible::after,
a.module-app-layer__cross-axis-summary-link[href^="#"]:focus-visible::after,
a.module-app-layer__affiliate-marketplace-offer-card[href^="#"]:focus-visible::after,
a.module-app-layer__meta-tile[href^="#"]:focus-visible::after,
a.module-app-layer__versus-compare-panel[href^="#"]:focus-visible::after,
a.module-app-layer__data-story-tile[href^="#"]:focus-visible::after,
a.module-app-layer__bento-grid-item[href^="#"]:focus-visible::after { transform: rotate(45deg) translateX(2px); }
/* 🔴 2026-09-07 사용자 지적 — 변형(kind)이 없는 칩이 짙은 배경에 검정 글자로 나와 안 읽힘.
   변형이 붙은 것은 라이브 색을 그대로 쓰고, «변형 없는 링크»만 흰 글자로 읽히게 한다. */
a.module-app-layer__attribute-chip-link[class$="attribute-chip-link--"],
a.module-app-layer__attribute-chip-link:not([class*="attribute-chip-link--"]) { background: var(--acc); color: #fff; border-color: transparent; }
a.module-app-layer__attribute-chip-link[class$="attribute-chip-link--"]:hover,
a.module-app-layer__attribute-chip-link:not([class*="attribute-chip-link--"]):hover { background: var(--acc-i); color: #fff; }
/* 🔴 2026-09-07 사용자 지적 — 호버 시 화살표 원 배경이 보라로 바뀌는데 글리프가 검정이라 안 보였다. */
.module-app-layer__cross-axis-summary-link:hover::after,.module-app-layer__meta-tile:hover::after,.module-app-layer__versus-compare-panel:hover::after,.module-app-layer__data-story-tile:hover::after,
.module-app-layer__cross-axis-summary-link:focus-visible::after,.module-app-layer__meta-tile:focus-visible::after,.module-app-layer__versus-compare-panel:focus-visible::after,.module-app-layer__data-story-tile:focus-visible::after { color: #fff; }
/* 🔴 animation 이 쓰는 @keyframes 정의(라이브 원문) — 없으면 요소가 «시작 상태로 굳는다» */
@keyframes bar-fill-x{from{transform:scaleX(0)}}
@keyframes tg-bar-fill{from{transform:scaleX(0)}}

/* hand-fix:app-layer:타일 폭·차트 상자 */
/* ── ㉮ 차트를 감싸는 «이중 상자» 제거 (2026-09-08 사용자 지적) ──
 * chart 모듈이 .price-trend-line-hover-layer 에 배경·테두리를 준다. 그 안에 스파크를 넣으면
 * 이미 테두리가 있는 타일 «안»에 또 상자가 생겨 갑갑하고 자리를 먹는다.
 * 타일·칸 «안»에 있을 때만 상자를 없앤다 — 홀로 선 차트의 상자는 그대로 둔다.
 */
.module-app-layer__headline-stat-block .module-app-layer__price-trend-line-hover,
.module-app-layer__composition-donut-stat-cell .module-app-layer__price-trend-line-hover,
.module-app-layer__data-story-tile .module-app-layer__price-trend-line-hover,
.module-app-layer__meta-tile .module-app-layer__price-trend-line-hover,
.module-app-layer__quick-fact-card .module-app-layer__price-trend-line-hover {
  background: none; border: 0; border-radius: 0; padding: 0; box-shadow: none;
}

/* ── ㉯ 칸 수가 모자랄 때 오른쪽이 비던 것 (2026-09-08 사용자 지적) ──
 * 라이브 격자는 «항상 다섯 칸»(1.35fr 1fr 1fr 1fr 1.1fr)을 전제한다. 자료가 넷이면
 * 다섯째 칸이 빈 채로 남아 오른쪽 폭을 못 쓴다.  다섯이면 라이브 비율 그대로 두고,
 * 다섯이 아닐 때만 «있는 만큼 폭을 나눠» 채운다.
 */
.module-app-layer__summary-metric-five-column-grid:not(:has(> :nth-child(5))) {
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

/* hand-fix:app-layer:구매 단추 줄바꿈 */
/* ── 단추 글자가 잘리던 것 (2026-09-08 사용자 지시) ──
 * 칸 최소 폭이 132~168px 이라 「티씨지플레이어에서 보기 $412.50」 같은 긴 글이 잘렸다.
 * ㉮ 최소 폭을 글에 맞게 올려 «필요하면 다음 줄»로 내려가게 한다(auto-fit 이 이미 줄을 바꾼다).
 * ㉯ 단추 «안»에서도 글이 줄바꿈하도록 둔다 — 잘라내지 않는다.
 */
.module-app-layer__purchase-action-row { grid-template-columns: repeat(auto-fit, minmax(clamp(180px, 22vw, 260px), 1fr)); }
.module-app-layer__primary-action-button { flex-wrap: wrap; white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.3; padding: 12px 14px; text-align: center; }
/* ㉰ 모바일에서는 개수와 무관하게 «1열» — 좁은 폭에서 두 개가 나란히 서면 둘 다 글이 잘린다
      (사용자 지시: 「모바일에서는 구매 버튼이 몇 개가 됐던 1열로 배치」). */
@media (max-width: 640px) {
  .module-app-layer__purchase-action-row { grid-template-columns: 1fr; }
}

/* hand-fix:app-layer:칩 기본 변형 색 */
/* ── 칩 색 (2026-09-08 사용자 제안) ──
 * 라이브는 칩을 «뜻»으로 물들인다 — --rarity · --pokedex · --language · --format · --holo
 * 전부 제 색 규칙을 갖고 있고 우리도 그대로 갖고 있다.  색이 없던 것은 --plain 하나뿐이라
 * 한 줄이 밋밋해 보였다.  라이브의 물들이는 방식(color-mix)을 그대로 써서 옅게만 준다.
 * 🔴 라이브가 색을 정한 변형은 손대지 않는다(회귀 0).
 */
.module-app-layer__attribute-chip-link--plain {
  background: color-mix(in srgb, var(--acc) 10%, var(--surf));
  color: var(--acc-i, var(--acc));
  border-color: color-mix(in srgb, var(--acc) 30%, transparent);
}

/* hand-fix:app-layer:meta 타일 열 수 */
/* ── 한 줄에 여섯은 너무 잘다 (2026-09-08 사용자 지시) ──
 * 라이브는 repeat(6,1fr) 고정이라 항목이 여섯이면 한 줄에 다 선다.
 * 사용자 지시: 「데스크톱에서 3열 기준으로 하든지, 4열 배열로 하든지. 나머지는 다음 행으로」.
 * 최소 폭을 정해 «자리가 되는 만큼»만 세운다 — 본문 1080px 에서 4열, 좁아지면 3·2·1열.
 */
/* 🔴 최소 폭을 240px 로 잡았더니 «좁은 곁열»에서는 1열이 됐다(2026-09-08 사용자 지적).
      max(150px, 25% - 8px) = 넓어도 «넉 열까지», 좁으면 3·2·1열로 줄어든다. */
.module-app-layer__meta-tile-grid { grid-template-columns: repeat(auto-fit, minmax(max(150px, 25% - 8px), 1fr)); }

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-app-layer__lens-entry-panel { margin-top:34px; padding:0; background:none; border:0; border-radius:0; margin:14px 0 0; }
  .module-app-layer__lens-entry-panel-title { margin:0 0 11px; font-size:15px; letter-spacing:-.01em; text-transform:none; color:var(--ink2); font-weight:800; margin-bottom:10px; }
  .module-app-layer__data-story-tile { display:flex; flex-direction:column; gap:7px; padding:12px 12px 11px; border:1px solid var(--line2); justify-content:flex-start; border-radius:var(--r-s); background:var(--surf); text-decoration:none; color:inherit; transition:transform .12s,border-color .12s; position:relative; padding-bottom:9px; }
  .module-app-layer__data-story-tile:hover { transform:translateY(-2px); border-color:var(--acc); }
  .module-app-layer__data-story-tile:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }
  .module-app-layer__data-story-tile-question { font-size:13px; font-weight:700; color:var(--mut); letter-spacing:.01em; line-height:1.4; min-height:29px; padding-right:0; }
  .module-app-layer__data-story-tile-value { font-size:23px; font-weight:800; letter-spacing:-.03em; line-height:1; display:flex; align-items:baseline; gap:6px; flex-wrap:wrap; font-variant-numeric:tabular-nums; overflow:visible; text-overflow:clip; white-space:nowrap; }
  .module-app-layer__data-story-tile-value em { font-style:normal; font-size:13px; font-weight:600; color:var(--mut); letter-spacing:0; white-space:normal; word-break:keep-all; overflow-wrap:anywhere; min-width:0; line-height:1.35; } /* HCU 09-29 · nowrap 이면 긴 설명이 타일 밖으로 나감(사용자 「글자가 삐져가는」) → 낱말 단위 줄바꿈 · 값 숫자(부모 b)는 한 줄 유지 */
  .module-app-layer__data-story-tile:has(.u-row-entrance-arrow-badge--card) .module-app-layer__data-story-tile-question { padding-right:22px; } /* HCU 09-29 · 원형 화살표 배지(top 10·right 10·19px) 자리 비움 — 질문 글자가 배지 밑으로 들어가던 겹침 */
  .module-app-layer__data-story-tile-content { display:block; width:100%; height:40px; }
  .module-app-layer__data-story-tile-bars:has(.module-app-layer__proportion-bar-track) { align-items: stretch; height: auto; min-height: 58px; }
  .module-app-layer__data-story-tile-meta { font-size:13px; color:var(--mut); line-height:1.45; min-height:28px; margin-top:auto; }
  .module-app-layer__bar-segment-emphasis { background:var(--acc-s); }
  .module-app-layer__data-story-tile::after { content:none; position:absolute; top:10px; right:11px; font-size:13px; font-weight:800; color:var(--mut); opacity:.5; transition:opacity .13s ease,transform .13s ease,color .13s ease; }
  .module-app-layer__data-story-tile:hover::after, .module-app-layer__data-story-tile:focus-visible::after { opacity: 1; color: var(--acc-i); transform: translateX(2px); }
@media (prefers-reduced-motion:reduce) {
  .module-app-layer__data-story-tile::after { transition:none; }
}
  .module-app-layer__data-story-tile-go { display:flex; align-items:center; justify-content:flex-end; gap:4px; margin-top:auto; padding-top:8px; font-size:13px; font-weight:800; color:var(--mut); letter-spacing:-.01em; transition:color .13s ease; }
  .module-app-layer__data-story-tile-go::after { content:"→"; font-weight:800; transition:transform .13s ease,background .13s ease,color .13s ease; display:inline-grid; place-items:center; width:21px; height:21px; border-radius:50%; background:var(--acc-s); color:var(--acc-i); font-size:13px; line-height:1; flex:0 0 auto; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:translateY(-2px)rotate(45deg); }
  .module-app-layer__data-story-tile:hover .module-app-layer__data-story-tile-go, .module-app-layer__data-story-tile:focus-visible .module-app-layer__data-story-tile-go { color: var(--acc-i); }
@media (prefers-reduced-motion:reduce) {
  .module-app-layer__data-story-tile-go, .module-app-layer__data-story-tile-go::after { transition: none; }
}
  .module-app-layer__data-story-tile:hover .module-app-layer__data-story-tile-go::after, .module-app-layer__data-story-tile:focus-visible .module-app-layer__data-story-tile-go::after { background: var(--acc); color: #fff; }
@media (max-width:820px) {
  .module-app-layer__lens-entry-panel { margin-top:28px; }
}
  .module-app-layer__content-section-block>h2, h2.module-app-layer__lens-entry-panel-title { font-size: 24px; font-weight: 700; line-height: 1.35; letter-spacing: -.02em; margin: 70px 0 15px 0; padding-left: 15px; border-left: 4px solid var(--acc); padding-bottom: 10px; border-bottom: 1px solid var(--line2); color: var(--ink); text-transform: none; text-wrap: balance; }
@media (max-width:820px) {
  .module-app-layer__content-section-block>h2, h2.module-app-layer__lens-entry-panel-title { font-size: 21px; margin: 50px 0 13px 0; padding-left: 12px; border-left-width: 3px; }
}
@media (max-width:600px) {
  .module-app-layer__content-section-block>h2, h2.module-app-layer__lens-entry-panel-title { font-size: 19px; margin: 40px 0 12px 0; }
}
@media (prefers-reduced-motion:no-preference) {
  .module-app-layer__data-story-tile-bars>i,.module-app-layer__data-story-tile-rank>i { transform-origin:bottom center; animation:tg-col-grow 1.5s linear .2s both; animation-play-state:paused; }
}
  .module-app-layer__data-story-tile-gauge { position:relative; display:flex; align-items:center; height:40px; }
  .module-app-layer__data-story-tile-gauge::before { content:""; position:absolute; left:0; right:0; height:10px; border-radius:5px; background:var(--line2); }
  .module-app-layer__data-story-tile-gauge i { transform-origin:left center; animation:none; animation-play-state:paused; position:relative; z-index:1; display:block; height:10px; border-radius:5px; background:var(--acc); width:var(--w); }
  .module-app-layer__data-story-tile-rank i { transform-origin:center bottom; animation:none; animation-play-state:paused; flex:1; min-height:3px; border-radius:2px 2px 0 0; background:var(--line2); height:var(--h); }
  /* 🔴 2026-09-28(HBD조 · 지휘자 「사용자 원문」·지휘자 측정) — 차트(이야기) 타일 = 데스크톱 2열·모바일 1열(사용자 09-28 확정).
     원인 = flex-wrap 은 calc 로 «칸 몫»을 정해도 각 칸 «안 내용»(추이선 svg·줄바꿈 안 되는 값·순위 막대 목록)의 최소 폭이 그 몫보다 크면
     한 줄에 하나씩 밀린다(플렉스 항목 기본 min-width:auto = 내용 최소폭 존중 — 아래 min-width:0 을 줘도 grid 만큼 확실히 눌리지 않았다).
     grid 는 minmax(0,1fr) 로 «0까지 눌러도 된다»를 명시해 안전하게 2등분한다. 되돌리기 = display:flex·flex-basis calc 로. */
  .module-app-layer__lens-entry-panel-group { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
  .module-app-layer__lens-entry-panel-group > .module-app-layer__data-story-tile { min-width:0; }
  .module-app-layer__data-story-tile-bars s { position:absolute; bottom:-1px; left:0; right:0; text-align:center; font-size:13px; color:var(--mut); text-decoration:none; transform:translateY(100%); line-height:1.2; }
  .module-app-layer__data-story-tile:hover::after { opacity:1; color:var(--acc-i); transform:translateX(2px); }
  .module-app-layer__data-story-tile:focus-visible::after { opacity:1; color:var(--acc-i); transform:translateX(2px); }
  .module-app-layer__data-story-tile-donut-row { display:flex; align-items:center; gap:13px; }
  .module-app-layer__data-story-tile-distribution-donut::after { content:""; position:absolute; inset:13px; border-radius:50%; background:var(--surf); }
  .module-app-layer__data-story-tile-distribution-donut b { position:relative; z-index:1; font-size:23px; font-weight:800; letter-spacing:-.04em; line-height:1; color:var(--ink); }
  .module-app-layer__data-story-tile-distribution-donut s { position:relative; z-index:1; text-decoration:none; font-size:13px; color:var(--mut); font-weight:600; line-height:1; letter-spacing:.04em; opacity:.85; }
  .module-app-layer__data-story-tile-donut-legend { display:flex; flex-direction:column; gap:5px; flex:1; min-width:0; }
  .module-app-layer__data-story-tile-donut-legend>span { display:flex; flex-wrap:wrap; align-items:center; gap:6px; font-size:13px; font-weight:700; color:var(--ink2); } /* HCU 09-29 · flex-wrap = 이름이 길면 값(em «92곳 · 29%»)이 다음 줄로(타일 밖 넘침 0 · 값은 한 줄) */
  .module-app-layer__data-story-tile-donut-legend i { width:9px; height:9px; border-radius:2px; flex:0 0 auto; box-shadow:0 0 0 1px color-mix(in srgb,var(--ink)12%,transparent); }
  .module-app-layer__data-story-tile-donut-legend em { margin-left:auto; font-style:normal; font-weight:800; color:var(--ink); }
  .module-app-layer__data-story-tile-distribution-donut { width:84px; height:84px; gap:0; box-shadow:inset 0 0 0 1.5px var(--surf); }
  .module-app-layer__data-story-tile-dcol { display:flex; flex-direction:column; align-items:center; gap:5px; flex:0 0 auto; }
  .module-app-layer__data-story-tile-dcap { font-size:13px; font-weight:700; color:var(--ink2); letter-spacing:.02em; line-height:1.25; padding:3px 10px; border:1px solid var(--line2); border-radius:999px; background:var(--surf2); white-space:nowrap; }
  .module-app-layer__lens-entry-panel-footnote { margin:10px 0 0; font-size:13px; color:var(--mut); line-height:1.62; }
  .module-app-layer__data-story-tile-chart-wrap { position:relative; display:block; }
  .module-app-layer__data-story-tile-chart-dot { position:absolute; width:6px; height:6px; border-radius:50%; background:var(--dn); transform:translate(-50%,-50%); pointer-events:none; }
  .module-app-layer__lens-entry-panel-title em { font-style:normal; font-weight:700; color:var(--mut); }
  .module-app-layer__data-story-tile:hover .module-app-layer__data-story-tile-go::after { background:var(--acc); color:#fff; }
  .module-app-layer__data-story-tile:focus-visible .module-app-layer__data-story-tile-go::after { background:var(--acc); color:#fff; }
  .module-app-layer__data-story-tile-donut { position:relative; display:grid; place-items:center; width:100%; height:40px; }
  .module-app-layer__data-story-tile-donut i { position:absolute; left:50%; top:0; transform:translateX(-50%); width:40px; height:40px; border-radius:50%; background:conic-gradient(var(--acc)calc(var(--p)*1%),var(--line2)0); }
  .module-app-layer__data-story-tile-donut i::after { content:""; position:absolute; inset:7px; border-radius:50%; background:var(--surf); }
  .module-app-layer__data-story-tile-donut b { position:relative; z-index:1; font-size:13px; font-weight:800; }
  .module-app-layer__data-story-tile-bars { position:relative; display:flex; align-items:flex-end; gap:5px; height:58px; flex-direction:column; justify-content:space-between; padding-bottom:18px; }
  .module-app-layer__data-story-tile-bars > i { flex:1; min-height:3px; border-radius:3px 3px 0 0; background:var(--line2); position:relative; transform-origin:bottom center; animation:none; animation-play-state:paused; }
  .module-app-layer__data-story-tile-bars > i.module-app-layer__bar-segment-emphasis { background:var(--acc); }
  .module-app-layer__data-story-tile-rank { display:flex; align-items:flex-end; gap:3px; height:40px; }
  .module-app-layer__data-story-tile-rank i.module-app-layer__bar-segment-emphasis { background:var(--dn); }
  .module-app-layer__data-story-tile-rank>i { transform-origin:bottom center; animation:none; animation-play-state:paused; }
  .module-app-layer__data-story-tile-gauge s { position:absolute; z-index:2; left:var(--x); top:2px; bottom:2px; width:2px; background:var(--ink); border-radius:1px; text-decoration:none; }
  .module-app-layer__data-story-tile-rows { display:flex; flex-direction:column; gap:5px; }
  .module-app-layer__data-story-tile:hover .module-app-layer__data-story-tile-go { color:var(--acc-i); }
  .module-app-layer__data-story-tile:focus-visible .module-app-layer__data-story-tile-go { color:var(--acc-i); }
  .module-app-layer__content-section-block>.module-app-layer__lens-entry-panel:first-child { margin-top:0; }
  h2.module-app-layer__lens-entry-panel-title { font-size:24px; font-weight:700; line-height:1.35; letter-spacing:-.02em; margin:70px 0 15px 0; padding-left:15px; border-left:4px solid var(--acc); padding-bottom:10px; border-bottom:1px solid var(--line2); color:var(--ink); text-transform:none; text-wrap:balance; }
  .module-app-layer__lens-entry-panel-group>* { min-width:0; }
@media (max-width:820px) {
  h2.module-app-layer__lens-entry-panel-title { font-size:21px; margin:50px 0 13px 0; padding-left:12px; border-left-width:3px; }
}
/* 🔴 2026-09-28(HBD조 · 사용자 09-28 확정) — 차트(이야기) 타일 모바일 = 1열(위 데스크톱 2열과 짝). 옛 4·3열 flex-basis 규칙은 grid 전환으로 무효라 지운다. */
@media (max-width:700px) {
  .module-app-layer__lens-entry-panel-group { grid-template-columns:1fr; }
}
@media (max-width:600px) {
  h2.module-app-layer__lens-entry-panel-title { font-size:19px; margin:40px 0 12px 0; }
}
@media (max-width:430px) {
  .module-app-layer__lens-entry-panel-group > .module-app-layer__data-story-tile { flex-basis:100%; }
}
@media (prefers-reduced-motion:no-preference) {
  .module-app-layer__data-story-tile-bars>i { transform-origin:bottom center; animation:tg-col-grow 1.5s linear .2s both; animation-play-state:paused; }
  .module-app-layer__data-story-tile-rank>i { transform-origin:bottom center; animation:tg-col-grow 1.5s linear .2s both; animation-play-state:paused; }
  .module-app-layer__data-story-tile-bars>i:nth-child(1) { animation-delay:.20s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(1) { animation-delay:.20s; }
  .module-app-layer__data-story-tile-bars>i:nth-child(2) { animation-delay:.24s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(2) { animation-delay:.24s; }
  .module-app-layer__data-story-tile-bars>i:nth-child(3) { animation-delay:.28s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(3) { animation-delay:.28s; }
  .module-app-layer__data-story-tile-bars>i:nth-child(4) { animation-delay:.32s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(4) { animation-delay:.32s; }
  .module-app-layer__data-story-tile-bars>i:nth-child(5) { animation-delay:.36s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(5) { animation-delay:.36s; }
  .module-app-layer__data-story-tile-bars>i:nth-child(6) { animation-delay:.40s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(6) { animation-delay:.40s; }
  .module-app-layer__data-story-tile-bars>i:nth-child(7) { animation-delay:.44s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(7) { animation-delay:.44s; }
  .module-app-layer__data-story-tile-bars>i:nth-child(8) { animation-delay:.48s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(8) { animation-delay:.48s; }
  .module-app-layer__data-story-tile-bars>i:nth-child(9) { animation-delay:.52s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(9) { animation-delay:.52s; }
  .module-app-layer__data-story-tile-bars>i:nth-child(10) { animation-delay:.56s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(10) { animation-delay:.56s; }
  .module-app-layer__data-story-tile-bars>i:nth-child(11) { animation-delay:.60s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(11) { animation-delay:.60s; }
  .module-app-layer__data-story-tile-bars>i:nth-child(n+12) { animation-delay:.64s; }
  .module-app-layer__data-story-tile-rank>i:nth-child(n+12) { animation-delay:.64s; }
}
@media (prefers-reduced-motion:no-preference) and (scripting:none) {
  .module-app-layer__data-story-tile-bars>i { animation-play-state:running; }
  .module-app-layer__data-story-tile-rank>i { animation-play-state:running; }
}
@media (prefers-reduced-motion:reduce) {
  .module-app-layer__data-story-tile-gauge i { animation:none; }
  .module-app-layer__data-story-tile-rank i { animation:none; }
  .module-app-layer__data-story-tile { transition:none; }
  .module-app-layer__data-story-tile-go { transition:none; }
  .module-app-layer__data-story-tile-go::after { transition:none; }
  .module-app-layer__data-story-tile-rank>i { animation:none; }
  .module-app-layer__data-story-tile-bars>i { animation:none; }
  .module-app-layer__data-story-tile-gauge>i { animation:none; }
}
@media (scripting:none) {
  .module-app-layer__data-story-tile-rank>i { animation:none; }
  .module-app-layer__data-story-tile-bars>i { animation:none; }
  .module-app-layer__data-story-tile-gauge>i { animation:none; }
}
  a.module-app-layer__data-story-tile:hover { border-color:var(--acc); }
  .module-app-layer__data-story-tile-meta b { color:var(--ink); font-weight:700; }
  .module-app-layer__data-story-tile-rank>i.module-app-layer__bar-segment-emphasis { background:var(--acc); }
  .module-app-layer__data-story-tile-donut>i { position:absolute; border-radius:50%; background:conic-gradient(var(--acc)calc(var(--p,0)* 1%),var(--line2)0); left:50%; top: 50%; transform: translate(-50%, -50%); width: auto; height: 100%; max-height: 58px; aspect-ratio: 1; }
  .module-app-layer__data-story-tile-donut>b { position:relative; z-index:1; font-size:13px; font-weight:800; color:var(--ink); }
  tr.module-app-layer__bar-segment-emphasis td { background:color-mix(in srgb,var(--fire)9%,transparent); }
  .module-app-layer__data-story-tile-rows .module-app-layer__compact-value-bar-row:not(:has(> code)):not(.module-app-layer__compact-value-bar-row--gap) > b { grid-area: label; }
  .module-app-layer__data-story-tile-rows .module-app-layer__compact-value-bar-row:not(:has(> code)):not(.module-app-layer__compact-value-bar-row--gap) > em { grid-area: value; margin-left: 0; text-align: right; }
  .module-app-layer__data-story-tile-rows .module-app-layer__compact-value-bar-row:not(:has(> code)):not(.module-app-layer__compact-value-bar-row--gap) > i { grid-area: bar; position: static; width: 100%; height: 9px; border-radius: 5px; background: var(--line2); opacity: 1; overflow: hidden; }
  .module-app-layer__data-story-tile-rows .module-app-layer__compact-value-bar-row:not(:has(> code)):not(.module-app-layer__compact-value-bar-row--gap) > i::after { border-radius: 5px; opacity: 1; }
  .module-app-layer__data-story-tile-rows .module-app-layer__compact-value-bar-row--current:not(:has(> code)):not(.module-app-layer__compact-value-bar-row--gap) > i::after { background: var(--acc-i); }
  .module-app-layer__data-story-tile-image { display: block; width: 21px; height: 21px; margin-bottom: 1px; }
  .module-app-layer__data-story-tile-image img { display: block; width: 21px; height: 21px; }
  .module-app-layer__data-story-tile-donut, .module-app-layer__data-story-tile-gauge, .module-app-layer__data-story-tile-rank, .module-app-layer__data-story-tile-content { flex: 1 1 auto; height: auto; min-height: 40px; }
  .module-app-layer__data-story-tile-donut > i::after { inset: 17.5%; }
/* ── 동기화 블록 끝 (sync-live) ── */


/* ── 짝 맞추기 — 마크업이 찍는데 규칙이 없던 이름 (2026-09-10 창D) ────────── */
/* 🔴 짝 맞추기(2026-09-10 창D) — 변형 표식 — 원본에 이 변형의 선언이 없었다.
   마크업이 이 이름을 찍는데 규칙이 없어 «자리»만 만든다. 생김새는 «창작하지 않는다»
   (선례 = display/pdf-embed/style.css .module-pdf-embed__title). */
/* 🔴 값 복원(2026-09-10 창D) — 창작이 아니라 복원이다.
   개명 «전»에 이 요소가 화면에서 받던 값 · 출처 = _harvest/base.css · shell/_global.css 의 .proportion-bar-track--current > i 선언 그대로 (그 클래스 자체 선언은 원래도 없었고 «자식 i»가 값을 받았다) */
.module-app-layer__proportion-bar-track--current > i { background: var(--acc-i); opacity: 1; }
/* 🔴 짝 맞추기(2026-09-10 창D) — 원본에 선언 없음.
   마크업이 이 이름을 찍는데 규칙이 없어 «자리»만 만든다. 생김새는 «창작하지 않는다»
   (선례 = display/pdf-embed/style.css .module-pdf-embed__title). */
.module-app-layer__data-story-tile-bars-legend {
}

/* ══ 🆕 2026-09-27 HAN조 — 앱층 타일 14종 변형 + 움직임 4종 ═════════════════════════════════════════
   지시서 docs/directive/platform/_지시서-HAN-앱층타일모듈보강-20260927.md · 모양 원천 = docs/design/platform/_시안/앱층-부품/앱층-타일-샘플.html
   🔴 변형 추가만 — 이 블록의 선택자는 전부 «새 이름» 또는 «새 수식어»(--motion · --move · --live · :has(새 요소)) 범위다.
      기존 선택자의 값은 한 줄도 바꾸지 않았다(기존 편 화면 무변화 · story_tiles 는 sites/ 매니페스트 바인딩 0 = grep 실측).
   🔴 색 = 사이트 토큰만(리터럴 0) · 상승 = var(--up) · 하락 = var(--dn)(시세 셸 토큰이 상승 = 초록이라 지시서 「상승 빨강」과 어긋남 → 보고서 발견 칸).
   🔴 글자 13px 하한 · 좌표·백분율은 데이터가 준다(표시층 계산 0 — calc 는 «자리 옮기기»만).
   🔴 움직임 = 뿌리 .module-app-layer--motion(슬롯 motion=reveal) 안에서만 · prefers-reduced-motion:no-preference 안에서만 ·
      script.js 가 화면에 들어올 때 is-rv-anim-go 를 붙여야 재생(스크립트 없음 = 끝 그림 그대로 · 값은 처음부터 HTML 글자). */

/* 기준선 팔레트 — 한 곳. ref-1 = 상위 지역 · ref-2 = 전국 · ref-3 = 그 밖 · -ink = 그 선의 글자색(흰 바탕 대비 4.5:1 이상 짝).
   자기 값(self) = 주 색 실선. 다크 짝 = 사이트 토큰을 따라간다(시세 셸은 지금 다크 모드 없음 — 보고서). */
/* 🆕 2026-10-09 선 색 = 글자 색(사용자 «선과 글자가 색상이 동일하게 매칭»): ref-N-ink 는 ref-N 과 «같은 토큰» — 옛 값 ref-1 선 --mut ↔ 글자 --ink2 · ref-3 선 --c3 ↔ 글자 --warn 은 서로 달랐다. 아래 «app-dot-strip 표지 색 구분» 블록 참조(분포점줄·불릿·범위 세 타일 공용). */
.module-app-layer__panel { --ref-1:var(--warn); --ref-1-ink:var(--warn); --ref-2:var(--c2); --ref-2-ink:var(--c2); --ref-3:var(--ink); --ref-3-ink:var(--ink); }

/* 공통 — 그림 아래 축 글 */
.module-app-layer__data-story-tile-axis { display:flex; justify-content:space-between; gap:6px; font-size:13px; line-height:1.35; color:var(--mut); font-variant-numeric:tabular-nums; }
.module-app-layer__data-story-tile-axis>span { min-width:auto; word-break:keep-all; overflow-wrap:break-word; } /* HCU 09-29 · min-width:0 이면 눈금 칸이 줄어 «1,794원» 이 설명 글과 겹치고 타일 밖으로 나감 → 눈금은 내용 폭 아래로 안 줄고 설명 글만 낱말 단위로 감김 */
/* 🆕 2026-09-28(HCG조 · 사용자 승인 「승인」 · 눈검수 「9/24 가 그래프 끝 밖」) — 추이 타일 날짜 줄 = 그래프 칸 폭(오른쪽 눈금 칸 + 칸 사이 8px 만큼 비운다).
   눈금 칸 폭 = 4.4em(추이 칸 글꼴 기준 · 아래 -trend-ticks) → 날짜 줄은 글꼴 크기를 타일에서 물려받아(추이 칸과 같은 기준) 여백을 같은 em 으로 잡고, 글자 칸만 13px.
   눈금 칸이 없는 추이 칸 = 칸 사이 8px 만 · 되돌리기 = 이 세 규칙 삭제(백업 = style.css.bak_20260928-HCG조). */
.module-app-layer__data-story-tile-trend + .module-app-layer__data-story-tile-axis { font-size:inherit; padding-right:8px; }
.module-app-layer__data-story-tile-trend:has(> .module-app-layer__data-story-tile-trend-ticks) + .module-app-layer__data-story-tile-axis { padding-right:calc(4.4em + 8px); }
.module-app-layer__data-story-tile-trend + .module-app-layer__data-story-tile-axis>span { font-size:13px; }

/* 분포점줄(viz=dots) — 점 1개 = 대상 1곳 · 같은 값은 위로 쌓음 · 기준선 = 자기(실선 주 색) · 상위·전국·그 밖(점선 · 선마다 다른 색) · 중앙값 = 축 위 짧은 눈금 */
.module-app-layer__data-story-tile-dots { position:relative; display:block; height:74px; margin:0 6px; border-bottom:1px solid var(--line2); }
.module-app-layer__data-story-tile-dots>i { position:absolute; left:calc(var(--x) * 1%); bottom:calc(var(--level) * 5px + 1px); width:8px; height:8px; margin-left:-4px; border-radius:50%; background:var(--acc); opacity:.8; }
.module-app-layer__data-story-tile-ref { position:absolute; left:calc(var(--x) * 1%); top:0; bottom:0; width:0; border-left:2px solid var(--acc); font-style:normal; }
.module-app-layer__data-story-tile-ref>span { position:absolute; top:-2px; left:4px; padding:0 2px; font-size:13px; font-weight:700; line-height:1.2; white-space:nowrap; color:var(--acc); background:var(--surf); }
.module-app-layer__data-story-tile-ref--ref-1 { border-left:2px dashed var(--ref-1); }
.module-app-layer__data-story-tile-ref--ref-1>span { top:16px; color:var(--ref-1-ink); }
.module-app-layer__data-story-tile-ref--ref-2 { border-left:2px dashed var(--ref-2); }
.module-app-layer__data-story-tile-ref--ref-2>span { top:34px; color:var(--ref-2-ink); }
.module-app-layer__data-story-tile-ref--ref-3 { border-left:2px dashed var(--ref-3); }
.module-app-layer__data-story-tile-ref--ref-3>span { top:52px; color:var(--ref-3-ink); }
.module-app-layer__data-story-tile-ref--end>span { left:auto; right:4px; }
.module-app-layer__data-story-tile-median { position:absolute; left:calc(var(--x) * 1%); bottom:-5px; width:2px; height:9px; margin-left:-1px; background:var(--ink2); text-decoration:none; }

/* 불릿-기준대비(viz=bullet) — 막대 = 자기 값 · 기준 눈금 = 점선(기준마다 다른 색) · 글 = 막대 아래 한 줄(선 색) */
.module-app-layer__data-story-tile-bullet { position:relative; display:block; height:18px; margin:6px 0 24px; border-radius:4px; background:var(--surf2); }
.module-app-layer__data-story-tile-bullet>i { position:absolute; left:0; top:4px; bottom:4px; width:var(--w); border-radius:3px; background:var(--acc); }
.module-app-layer__data-story-tile-bullet>.module-app-layer__data-story-tile-ref { top:-3px; bottom:-3px; }
.module-app-layer__data-story-tile-bullet>.module-app-layer__data-story-tile-ref>span { top:calc(100% + 3px); left:0; transform:translateX(-50%); padding:0; background:none; }
.module-app-layer__data-story-tile-bullet>.module-app-layer__data-story-tile-ref--end>span { left:0; right:auto; transform:translateX(-100%); }
.module-app-layer__data-story-tile-bullet>.module-app-layer__data-story-tile-ref--ref-2>span { top:calc(100% + 19px); } /* HCU 09-29 · 표지 둘(부산·전국)이 같은 줄에서 겹침 → 둘째 표지를 한 줄 아래로 */
.module-app-layer__data-story-tile-bullet:has(>.module-app-layer__data-story-tile-ref--ref-2) { margin-bottom:40px; }

/* 봉(viz=candle) — 꼬리 = 고가~저가 · 몸통 = 시가~종가 · 오름 var(--up) · 내림 var(--dn) */
.module-app-layer__data-story-tile-candles { display:flex; gap:8px; height:64px; padding:0 4px; border-bottom:1px solid var(--line2); }
.module-app-layer__data-story-tile-candle { position:relative; flex:1 1 0; min-width:0; color:var(--mut); }
.module-app-layer__data-story-tile-candle--up { color:var(--up); }
.module-app-layer__data-story-tile-candle--down { color:var(--dn); }
.module-app-layer__data-story-tile-candle::before { content:""; position:absolute; left:50%; width:2px; margin-left:-1px; top:calc(var(--wick-top) * 1%); bottom:calc((100 - var(--wick-bottom)) * 1%); background:currentColor; }
.module-app-layer__data-story-tile-candle::after { content:""; position:absolute; left:50%; width:min(18px, 70%); transform:translateX(-50%); top:calc(var(--body-top) * 1%); bottom:calc((100 - var(--body-bottom)) * 1%); min-height:2px; border-radius:2px; background:currentColor; }

/* 세로선-변동(viz=lollipop) — 가운데 0 기준 · 오름 위 · 내림 아래 · 값 없음 = 점선 빈 원 */
.module-app-layer__data-story-tile-lollipops { position:relative; display:flex; gap:4px; height:72px; }
.module-app-layer__data-story-tile-lollipops::before { content:""; position:absolute; left:0; right:0; top:50%; border-top:1px solid var(--line2); }
.module-app-layer__data-story-tile-lollipop { position:relative; flex:1 1 0; min-width:0; color:var(--mut); }
.module-app-layer__data-story-tile-lollipop--up { color:var(--up); }
.module-app-layer__data-story-tile-lollipop--down { color:var(--dn); }
.module-app-layer__data-story-tile-lollipop::before { content:""; position:absolute; left:50%; width:2px; margin-left:-1px; height:calc(var(--h) * .44%); background:currentColor; }
.module-app-layer__data-story-tile-lollipop::after { content:""; position:absolute; left:50%; width:8px; height:8px; margin-left:-4px; border-radius:50%; background:currentColor; }
.module-app-layer__data-story-tile-lollipop--up::before { bottom:50%; }
.module-app-layer__data-story-tile-lollipop--up::after { bottom:calc(50% + var(--h) * .44% - 4px); }
.module-app-layer__data-story-tile-lollipop--down::before { top:50%; }
.module-app-layer__data-story-tile-lollipop--down::after { top:calc(50% + var(--h) * .44% - 4px); }
.module-app-layer__data-story-tile-lollipop--missing::before { content:none; }
.module-app-layer__data-story-tile-lollipop--missing::after { top:50%; margin-top:-4px; background:none; border:1px dashed var(--line2); }

/* 양방향막대-변동(viz=diverging) — 가운데 기준 · 오름 오른쪽 · 내림 왼쪽 */
.module-app-layer__data-story-tile-diverging { display:grid; gap:5px; }
.module-app-layer__data-story-tile-diverging-row { display:grid; grid-template-columns:minmax(0,5em) 1fr auto; gap:8px; align-items:center; font-size:13px; }
.module-app-layer__data-story-tile-diverging-label { white-space:normal; overflow:visible; text-overflow:clip; word-break:keep-all; overflow-wrap:anywhere; } /* HCU 09-29 · 말줄임(이름 숨김) → 줄바꿈 */
.module-app-layer__data-story-tile-diverging-track { position:relative; height:9px; border-radius:5px; background:var(--surf2); }
.module-app-layer__data-story-tile-diverging-track::before { content:""; position:absolute; left:50%; top:-2px; bottom:-2px; width:1px; background:var(--line2); }
.module-app-layer__data-story-tile-diverging-track>i { position:absolute; top:0; height:100%; width:var(--w); border-radius:5px; }
.module-app-layer__data-story-tile-diverging-bar--up { left:50%; background:var(--up); }
.module-app-layer__data-story-tile-diverging-bar--down { right:50%; background:var(--dn); }
.module-app-layer__data-story-tile-diverging-value { display:inline-flex; align-items:center; gap:2px; font-weight:700; text-align:right; }

/* 와플(viz=waffle) — 칸 1개 = 대상 1개 · 6열 */
.module-app-layer__data-story-tile-waffle-row { display:flex; align-items:center; gap:14px; }
.module-app-layer__data-story-tile-waffle { flex:none; display:grid; grid-template-columns:repeat(6,14px); gap:3px; }
.module-app-layer__data-story-tile-waffle>i { display:block; width:14px; height:14px; border-radius:3px; background:var(--line); }
.module-app-layer__data-story-tile-waffle>i.module-app-layer__data-story-tile-waffle-cell--on { background:var(--acc); }
.module-app-layer__data-story-tile-waffle-count { font-size:14px; font-weight:700; }

/* 히트맵-격자(viz=heat) — 행 = 대상 · 열 = 날짜 · 진하기 = 변동 크기(--level) · 값 없음 = 점선 칸 */
.module-app-layer__data-story-tile-heat { display:grid; grid-template-columns:5.2em repeat(var(--columns), minmax(0,1fr)); gap:3px; align-items:center; }
.module-app-layer__data-story-tile-heat-column { font-size:13px; color:var(--mut); text-align:center; font-variant-numeric:tabular-nums; }
.module-app-layer__data-story-tile-heat-row { font-size:13px; white-space:normal; overflow:visible; text-overflow:clip; word-break:keep-all; overflow-wrap:anywhere; } /* HCU 09-29 · 말줄임(행 이름 숨김) → 줄바꿈 */
.module-app-layer__data-story-tile-heat-cell { display:block; height:20px; border-radius:3px; }
.module-app-layer__data-story-tile-heat-cell--up { background:color-mix(in srgb, var(--up) calc(var(--level) * 1%), var(--surf)); }
.module-app-layer__data-story-tile-heat-cell--down { background:color-mix(in srgb, var(--dn) calc(var(--level) * 1%), var(--surf)); }
.module-app-layer__data-story-tile-heat-cell--flat { background:var(--surf2); }
.module-app-layer__data-story-tile-heat-cell--empty { background:repeating-linear-gradient(135deg, var(--line2) 0 1.5px, transparent 1.5px 5px); } /* HAR조 2026-09-27 테두리 한 겹 — 빈칸 표시 = 빗금 바탕(타일 안 점선 상자 0) · 원래 border:1px dashed var(--line2) */

/* 추이선-첫관측(viz=spark_single) — 점선 기준 + 첫 관측 점 1개(빈 선 0) */
.module-app-layer__data-story-tile-spark-single { position:relative; display:block; height:40px; }
.module-app-layer__data-story-tile-spark-single::before { content:""; position:absolute; left:6px; right:6px; top:50%; border-top:1px dashed var(--line2); }
.module-app-layer__data-story-tile-spark-single>i { position:absolute; left:18px; top:50%; width:10px; height:10px; margin:-5px 0 0 -5px; border-radius:50%; background:var(--acc); }

/* 가로막대-무리크기(viz=bars · 설계 M2) — 트랙 규칙 0 이라 막대가 안 보이던 결함 수리. 범위 = 이야기 타일 bars 안의 트랙만(바인딩 0 = 기존 편 무변화) */
.module-app-layer__data-story-tile-bars:has(> .module-app-layer__proportion-bar-track) { gap:5px; padding-bottom:0; justify-content:flex-start; }
.module-app-layer__data-story-tile-bars>.module-app-layer__proportion-bar-track { display:block; align-self:stretch; height:9px; border-radius:5px; background:var(--surf2); overflow:hidden; }
.module-app-layer__data-story-tile-bars>.module-app-layer__proportion-bar-track>i { display:block; height:100%; width:var(--w); border-radius:5px; background:var(--acc); }
.module-app-layer__data-story-tile-bars>.module-app-layer__proportion-bar-track--current>i { background:var(--acc-i); }

/* 큰값-순위배지(metrics emphasis=hero · 설계 M9) — 큰 값 오른쪽 순위 상자 · 칸 전체 링크(늘린 링크 · 중첩 링크 0) */
/* 🔴 2026-09-28(HBD조) — 이중 테두리 수리(사용자 지시 「이중 테두리 없이」 · double-border-audit 실측).
   순위 상자(headline-stat-rank) 자체가 테두리를 갖는데(아래) quick·entity·axis 변형에서는 그 겉판(headline-stat-block)도
   테두리를 갖는다(:1133) — 겹치는 «겉» 쪽을 0으로 한다(순위 상자 없는 headline-stat-block 은 그대로 · :has() 로 한정).
   hub 변형은 겉판이 이미 다른 쪽(composition-donut-stat-panel)이라 그 쪽을 아래(:1152 부근)에서 따로 0으로 한다. */
.module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-rank) { display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:10px; align-items:center; border:0; }
.module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-rank)>* { grid-column:1 / -1; }
.module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-rank)>.module-app-layer__headline-stat-value { grid-column:1; }
.module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-rank)>.module-app-layer__headline-stat-value>small { margin-left:2px; font-size:15px; font-weight:700; }
.module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-rank)>.module-app-layer__headline-stat-rank { grid-column:2; }
.module-app-layer__headline-stat-rank { min-width:0; padding:7px 8px; border-radius:10px; text-align:center; background:var(--acc-s); border:1px solid var(--line2); }
.module-app-layer__headline-stat-rank>b { display:block; font-size:20px; font-weight:800; line-height:1.1; color:var(--acc-i); }
.module-app-layer__headline-stat-rank>span { display:block; font-size:13px; line-height:1.3; color:var(--ink2); }
.module-app-layer__headline-stat-rank--bad { background:var(--surf); border-color:var(--dn); }
.module-app-layer__headline-stat-rank--bad>b { color:var(--dn); }
.module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-link) { position:relative; transition:background .16s ease, border-color .16s ease; }
.module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-link)>.module-app-layer__headline-stat-key { padding-right:26px; }
.module-app-layer__headline-stat-link { color:inherit; text-decoration:none; }
.module-app-layer__headline-stat-link::after { content:""; position:absolute; inset:0; border-radius:inherit; }
.module-app-layer__headline-stat-link:focus-visible { outline:none; }
.module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-link:hover) { border-color:var(--acc); background:var(--acc-s); }
.module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-link:focus-visible) { border-color:var(--acc); background:var(--acc-s); outline:2px solid var(--acc); outline-offset:2px; }

/* 이동타일(quick_facts_kind=move · 설계 M11) — 옅은 바탕 · 점선 테두리 · 이모지 앞 · 원형 화살표(→ 3시) · 호버 = 바탕 강조 + 배지 채움(기존 a:hover .u-row-entrance-arrow-badge--card 규칙 그대로) */
.module-app-layer__quick-fact-title { margin:14px 0 6px; font-size:14px; font-weight:700; color:var(--ink2); }
.module-app-layer__quick-fact-grid--move { grid-template-columns:repeat(auto-fit, minmax(140px, 1fr)); margin-top:0; }
.module-app-layer__quick-fact-grid--move>.module-app-layer__quick-fact-card { position:relative; display:flex; align-items:center; gap:8px; padding:10px 34px 10px 10px; border:1px dashed var(--line2); background:var(--surf2); font-size:14px; transition:background .16s ease, border-color .16s ease, transform .16s ease; }
.module-app-layer__quick-fact-grid--move>.module-app-layer__quick-fact-card:hover,
.module-app-layer__quick-fact-grid--move>.module-app-layer__quick-fact-card:focus-visible { background:var(--acc-s); border-color:var(--acc); }
.module-app-layer__quick-fact-emoji { flex:none; font-size:18px; line-height:1; }
.module-app-layer__quick-fact-grid--move .module-app-layer__quick-fact-key { font-size:14px; font-weight:700; color:var(--ink); white-space:normal; overflow:visible; text-overflow:clip; word-break:keep-all; }
.module-app-layer__quick-fact-grid--move .module-app-layer__quick-fact-value { font-size:13px; font-weight:600; color:var(--mut); }
.module-app-layer__quick-fact-grid--move .module-app-layer__quick-fact-value:empty { display:none; }
.module-app-layer__quick-fact-grid--move .u-row-entrance-arrow-badge--card { top:50%; margin-top:-10px; }

/* 칩-상태(chips kind=live) — 실시간 맥동 점 + 빨강 계열 테두리(글자 대비 = --dn / --surf 5.1:1) */
.module-app-layer__attribute-chip-row>.module-app-layer__attribute-chip-link--live { display:inline-flex; align-items:center; gap:5px; color:var(--dn); border-color:var(--dn); background:var(--surf); }
.module-app-layer__attribute-chip-link>i.module-app-layer__attribute-chip-live-dot { display:inline-block; flex:none; width:7px; height:7px; padding:0; border-radius:50%; background:currentColor; opacity:1; }

/* 이야기 타일 링크 호버 = 바탕 옅게 강조(사용자 09-27 「호버 시 시각화」 · 배지 채움은 기존 :1571 규칙) — 범위 = 움직임 켠 판(새 변형을 쓰는 판) */
.module-app-layer--motion a.module-app-layer__data-story-tile[href]:hover,
.module-app-layer--motion a.module-app-layer__data-story-tile[href]:focus-visible { background:var(--acc-s); }

/* ── 움직임 ── */
@property --module-app-layer-donut-sweep { syntax:"<number>"; inherits:false; initial-value:1; }
@keyframes module-app-layer-grow-x { from { transform:scaleX(0); } }
@keyframes module-app-layer-grow-y { from { transform:scaleY(0); } }
@keyframes module-app-layer-rise { from { opacity:0; transform:translateY(6px); } }
@keyframes module-app-layer-pop { from { opacity:0; transform:scale(.4); } }
@keyframes module-app-layer-fade { from { opacity:0; } }
@keyframes module-app-layer-pulse { 0%, 100% { opacity:1; } 50% { opacity:.25; } }
@keyframes module-app-layer-pulse-once { 0% { transform:scale(1); } 40% { transform:scale(1.7); opacity:.55; } 100% { transform:scale(1); opacity:1; } }
@keyframes module-app-layer-draw { from { stroke-dashoffset:1200; } to { stroke-dashoffset:0; } }
@keyframes module-app-layer-donut-sweep { from { --module-app-layer-donut-sweep:0; } to { --module-app-layer-donut-sweep:1; } }
@media (prefers-reduced-motion:no-preference) {
  .module-app-layer__attribute-chip-live-dot { animation:module-app-layer-pulse 1.9s ease-in-out infinite; }
  /* 분포 점 차례로 나타남 — 왼쪽(싼 값)부터 · 기준선 글은 점 뒤 */
  .module-app-layer--motion .module-app-layer__data-story-tile-dots>i.is-rv-anim-go { animation:module-app-layer-rise .45s ease-out both; animation-delay:calc(var(--x) * 9ms); }
  .module-app-layer--motion .module-app-layer__data-story-tile-dots>em.is-rv-anim-go,
  .module-app-layer--motion .module-app-layer__data-story-tile-bullet>em.is-rv-anim-go { animation:module-app-layer-rise .5s ease-out .9s both; }
  /* 막대 채워지기(가로) */
  .module-app-layer--motion .module-app-layer__data-story-tile-bullet>i.is-rv-anim-go,
  .module-app-layer--motion .module-app-layer__data-story-tile-bars>.module-app-layer__proportion-bar-track>i.is-rv-anim-go,
  .module-app-layer--motion .module-app-layer__data-story-tile-gauge>i.is-rv-anim-go,
  .module-app-layer--motion .module-app-layer__data-story-tile-diverging-bar--up.is-rv-anim-go { transform-origin:left center; animation:module-app-layer-grow-x .9s ease-out .15s both; }
  .module-app-layer--motion .module-app-layer__data-story-tile-diverging-bar--down.is-rv-anim-go { transform-origin:right center; animation:module-app-layer-grow-x .9s ease-out .15s both; }
  /* 세로 막대·봉·세로선 자라기 */
  .module-app-layer--motion .module-app-layer__data-story-tile-rank>i.is-rv-anim-go { transform-origin:center bottom; animation:module-app-layer-grow-y .8s ease-out both; }
  .module-app-layer--motion .module-app-layer__data-story-tile-candles>i.is-rv-anim-go,
  .module-app-layer--motion .module-app-layer__data-story-tile-lollipops>i.is-rv-anim-go { transform-origin:center center; animation:module-app-layer-grow-y .7s ease-out both; }
  .module-app-layer--motion .module-app-layer__data-story-tile-rank>i:nth-child(2), .module-app-layer--motion .module-app-layer__data-story-tile-candles>i:nth-child(2), .module-app-layer--motion .module-app-layer__data-story-tile-lollipops>i:nth-child(2) { animation-delay:.06s; }
  .module-app-layer--motion .module-app-layer__data-story-tile-rank>i:nth-child(3), .module-app-layer--motion .module-app-layer__data-story-tile-candles>i:nth-child(3), .module-app-layer--motion .module-app-layer__data-story-tile-lollipops>i:nth-child(3) { animation-delay:.12s; }
  .module-app-layer--motion .module-app-layer__data-story-tile-rank>i:nth-child(4), .module-app-layer--motion .module-app-layer__data-story-tile-candles>i:nth-child(4), .module-app-layer--motion .module-app-layer__data-story-tile-lollipops>i:nth-child(4) { animation-delay:.18s; }
  .module-app-layer--motion .module-app-layer__data-story-tile-rank>i:nth-child(5), .module-app-layer--motion .module-app-layer__data-story-tile-candles>i:nth-child(5), .module-app-layer--motion .module-app-layer__data-story-tile-lollipops>i:nth-child(5) { animation-delay:.24s; }
  .module-app-layer--motion .module-app-layer__data-story-tile-rank>i:nth-child(n+6), .module-app-layer--motion .module-app-layer__data-story-tile-candles>i:nth-child(n+6), .module-app-layer--motion .module-app-layer__data-story-tile-lollipops>i:nth-child(n+6) { animation-delay:.3s; }
  /* 칸 차례로 채워짐(와플 = 줄마다 · 히트맵 = 8칸마다) */
  .module-app-layer--motion .module-app-layer__data-story-tile-waffle>i.is-rv-anim-go,
  .module-app-layer--motion .module-app-layer__data-story-tile-heat>i.is-rv-anim-go { animation:module-app-layer-pop .4s ease-out both; }
  .module-app-layer--motion .module-app-layer__data-story-tile-waffle>i:nth-child(n+7), .module-app-layer--motion .module-app-layer__data-story-tile-heat>i:nth-child(n+9) { animation-delay:.08s; }
  .module-app-layer--motion .module-app-layer__data-story-tile-waffle>i:nth-child(n+13), .module-app-layer--motion .module-app-layer__data-story-tile-heat>i:nth-child(n+17) { animation-delay:.16s; }
  .module-app-layer--motion .module-app-layer__data-story-tile-waffle>i:nth-child(n+19), .module-app-layer--motion .module-app-layer__data-story-tile-heat>i:nth-child(n+25) { animation-delay:.24s; }
  .module-app-layer--motion .module-app-layer__data-story-tile-waffle>i:nth-child(n+25), .module-app-layer--motion .module-app-layer__data-story-tile-heat>i:nth-child(n+33) { animation-delay:.32s; }
  .module-app-layer--motion .module-app-layer__data-story-tile-waffle>i:nth-child(n+31), .module-app-layer--motion .module-app-layer__data-story-tile-heat>i:nth-child(n+41) { animation-delay:.4s; }
  /* 첫 관측 점 한 번 맥동 · 순위 상자 나타남 */
  .module-app-layer--motion .module-app-layer__data-story-tile-spark-single>i.is-rv-anim-go { animation:module-app-layer-pulse-once 1.1s ease-out .2s both; }
  .module-app-layer--motion .module-app-layer__headline-stat-rank.is-rv-anim-go { animation:module-app-layer-rise .6s ease-out .3s both; }
  /* 도넛 채워지기 — --p 는 그대로, 등록한 새 속성(--module-app-layer-donut-sweep 0→1)을 곱한다 */
  .module-app-layer--motion .module-app-layer__data-story-tile-donut>i.is-rv-anim-go { background:conic-gradient(var(--acc) calc(var(--p, 0) * var(--module-app-layer-donut-sweep) * 1%), var(--line2) 0); animation:module-app-layer-donut-sweep 1.1s ease-out both; }
  /* 추이선 그려지기(대표·칸 스파크) — 선 = 그려짐 · 아래 면 = 옅게 나타남 */
  .module-app-layer--motion .module-app-layer__mini-trend-sparkline>polyline[fill="none"].is-rv-anim-go { stroke-dasharray:1200; animation:module-app-layer-draw 1.2s ease-out both; }
  .module-app-layer--motion .module-app-layer__mini-trend-sparkline>polyline[stroke="none"].is-rv-anim-go { animation:module-app-layer-fade 1s ease-out .4s both; }
}
@media (prefers-reduced-motion:reduce) {
  .module-app-layer__quick-fact-grid--move>.module-app-layer__quick-fact-card,
  .module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-link) { transition:none; }
}

/* ══ 🆕 2026-09-28 HBB조 — 앱층 새 변형 5종(이름 있는 막대 · 순위 막대 · 다조각 도넛 · 범위 게이지 · 추이선) ══════════════════════
   보류 원천 = docs/ledger/platform/_보고-HBA-유가앱층교체-20260928.md §4 · 설계 M3(추이선)·M5(이름 있는 막대)·M6(다조각 도넛)·M7(범위 게이지)
   🔴 추가만 — 이 블록의 선택자는 마크업이 «새로» 찍는 요소(viz=rows 행 · donut_multi · range · --trend 타일)만 잡는다. 기존 선택자 값 변경 0.
   🔴 척도 계산 0 — 막대 길이(w)·위치(marker_x)·조각 몫(percent)·추이 좌표(points)는 데이터(원자·파생)가 준다. calc 는 «단위 바꾸기·자리 옮기기»만.
   🔴 테두리 한 겹(타일 자신의 1px 만) · 글자 13px 이상 · 색 = 사이트 토큰만 · 부호 있는 변동 = var(--up)/var(--dn). */

/* 이름 있는 막대 · 순위 막대(viz=rows) — 줄마다 [순번] 이름 · 값 / 막대. 라이브 tcggrail 동기화 규칙(.data-story-tile-rows … > b·em·i 칸 이름)에 빠진 틀만 더한다 */
.module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row { display:grid; grid-template-columns:minmax(0,1fr) auto; grid-template-areas:"label value" "bar bar"; column-gap:8px; row-gap:3px; align-items:baseline; font-size:13px; line-height:1.35; }
.module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row:has(> .module-app-layer__compact-value-bar-rank) { grid-template-columns:auto minmax(0,1fr) auto; grid-template-areas:"rank label value" "rank bar bar"; }
.module-app-layer__compact-value-bar-rank { grid-area:rank; align-self:center; min-width:2.7em; padding:1px 6px; border-radius:999px; background:var(--surf2); color:var(--ink2); font-size:13px; font-weight:700; text-align:center; }
.module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row>b { min-width:0; overflow:visible; text-overflow:clip; white-space:normal; word-break:keep-all; overflow-wrap:anywhere; font-weight:600; color:var(--ink2); } /* HCU 09-29 · 말줄임(상품·지역 이름 숨김 «토스뱅크 주식회사 토스뱅크 키워봐요…») → 줄바꿈 · 값 em 은 한 줄 유지 */
.module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row>em { font-style:normal; font-weight:700; color:var(--ink); white-space:nowrap; }
.module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row>i { display:block; }
.module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row>i::after { content:""; display:block; height:100%; width:var(--w); background:var(--acc); }
.module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row--current>b { color:var(--acc-i); font-weight:700; }
.module-app-layer__compact-value-bar-row--current>.module-app-layer__compact-value-bar-rank { background:var(--acc-s); color:var(--acc-i); }
.module-app-layer__data-story-tile-rows:has(> .module-app-layer__compact-value-bar-row--current)>.module-app-layer__compact-value-bar-row:not(.module-app-layer__compact-value-bar-row--current)>i::after { background:color-mix(in srgb, var(--acc) 38%, var(--surf2)); }

/* 다조각 도넛(viz=donut_multi) — 조각을 겹겹이 품는다: 조각 i 는 제 몫(--p)만큼 칠하고, 그 안 b 가 제 몫만큼 돌린 판 위에 다음 조각이 선다(누적 각도 계산 0) */
.module-app-layer__data-story-tile-donut-multi { position:relative; flex:none; display:grid; place-items:center; width:84px; height:84px; border-radius:50%; background:var(--surf2); }
.module-app-layer__data-story-tile-donut-multi i,
.module-app-layer__data-story-tile-donut-multi b { position:absolute; inset:0; display:block; border-radius:50%; }
.module-app-layer__data-story-tile-donut-multi i { --segment:var(--line2); background:conic-gradient(var(--segment) calc(var(--p) * 1%), transparent 0); }
.module-app-layer__data-story-tile-donut-multi b { transform:rotate(calc(var(--p) * 3.6deg)); }
.module-app-layer__data-story-tile-donut-multi>i { --segment:var(--c1); }
.module-app-layer__data-story-tile-donut-multi>i>b>i { --segment:var(--c2); }
.module-app-layer__data-story-tile-donut-multi>i>b>i>b>i { --segment:var(--c3); }
.module-app-layer__data-story-tile-donut-multi>i>b>i>b>i>b>i { --segment:var(--c5); }
.module-app-layer__data-story-tile-donut-multi>i>b>i>b>i>b>i>b>i { --segment:var(--c4); }
.module-app-layer__data-story-tile-donut-multi>i>b>i>b>i>b>i>b>i>b>i { --segment:var(--ink2); }
.module-app-layer__data-story-tile-donut-multi::after { content:""; position:absolute; inset:15px; border-radius:50%; background:var(--surf); }
.module-app-layer__data-story-tile-donut-multi>em { position:relative; z-index:1; font-style:normal; font-size:13px; font-weight:800; color:var(--ink); }
.module-app-layer__data-story-tile-donut-multi+.module-app-layer__data-story-tile-donut-legend>span>i { background:var(--line2); }
.module-app-layer__data-story-tile-donut-multi+.module-app-layer__data-story-tile-donut-legend>span:nth-child(1)>i { background:var(--c1); }
.module-app-layer__data-story-tile-donut-multi+.module-app-layer__data-story-tile-donut-legend>span:nth-child(2)>i { background:var(--c2); }
.module-app-layer__data-story-tile-donut-multi+.module-app-layer__data-story-tile-donut-legend>span:nth-child(3)>i { background:var(--c3); }
.module-app-layer__data-story-tile-donut-multi+.module-app-layer__data-story-tile-donut-legend>span:nth-child(4)>i { background:var(--c5); }
.module-app-layer__data-story-tile-donut-multi+.module-app-layer__data-story-tile-donut-legend>span:nth-child(5)>i { background:var(--c4); }
.module-app-layer__data-story-tile-donut-multi+.module-app-layer__data-story-tile-donut-legend>span:nth-child(6)>i { background:var(--ink2); }
.module-app-layer__data-story-tile-donut-multi+.module-app-layer__data-story-tile-donut-legend>span>em { white-space:nowrap; }

/* 범위 속 위치 게이지(viz=range) — 트랙 = 최저~최고 · 점 = 이 값(marker_x) · 기준선 = ref_lines(불릿과 같은 규칙) · 양끝 값 = axis_items */
.module-app-layer__data-story-tile-range { position:relative; display:block; height:12px; margin:8px 7px 24px; border-radius:6px; background:var(--surf2); }
.module-app-layer__data-story-tile-range>i { position:absolute; top:50%; left:calc(var(--x) * 1%); width:14px; height:14px; margin:-7px 0 0 -7px; border-radius:50%; background:var(--acc); }
.module-app-layer__data-story-tile-range>.module-app-layer__data-story-tile-ref { top:-4px; bottom:-4px; }
.module-app-layer__data-story-tile-range>.module-app-layer__data-story-tile-ref>span { top:calc(100% + 3px); left:0; transform:translateX(-50%); padding:0; background:none; }
.module-app-layer__data-story-tile-range>.module-app-layer__data-story-tile-ref--end>span { transform:translateX(-100%); }
.module-app-layer__data-story-tile-range>.module-app-layer__data-story-tile-ref--ref-2>span { top:calc(100% + 19px); } /* HCU 09-29 · 표지 둘이 같은 줄에서 겹침 → 둘째 표지를 한 줄 아래로 */
.module-app-layer__data-story-tile-range:has(>.module-app-layer__data-story-tile-ref--ref-2) { margin-bottom:40px; }

/* 추이선 타일(trend_tile · 설계 M3) — 선 + 아래 음영 + 끝 점 강조 · 세로 눈금 = 최고·최저 값(단위) · 가로 = 공시일 · 선 색 = 변동 방향(상승 --up · 하락 --dn) · 말풍선 0
   좌표 = derived trend-series 산출(x 66~700 · y 18~220 안) — viewBox 는 그 좌표 공간을 그대로 담는 틀일 뿐(값 계산 0) */
.module-app-layer__data-story-tile-delta { display:inline-flex; align-items:center; gap:3px; font-size:13px; font-weight:700; }
/* 🔴 2026-09-28(HBD조 · 지휘자 전달2 · 사용자 눈검수 8 · /fuel/ 「전국 휘발유 평균 7일 추이」) — 선·점이 타일 테두리 밖으로 삐져나갔다.
   원인 = svg 에 너비·높이 속성이 없어(viewBox 만 있음) 브라우저가 viewBox 가로세로비(654:202 ≈ 3.24)로 내재 높이를 계산한다 —
   실제 타일 폭(약 300~380px)에서는 내재 높이가 약 93~117px 로, grid 트랙(auto 높이)이 그 실제 크기를 따라가며 선언한 64px 를 넘는다.
   svg 자신의 overflow:hidden(아래)만으로는 «그 svg 박스 자체»가 이미 커진 뒤라 못 막는다 — 겉 칸에도 overflow:hidden 을 준다.
   되돌리기 = overflow:hidden 두 줄 삭제(백업 style.css.bak_20260928-HBD조). */
.module-app-layer__data-story-tile-trend { --trend:var(--acc); display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:8px; height:64px; overflow:hidden; }
.module-app-layer__data-story-tile-trend--up { --trend:var(--up); }
.module-app-layer__data-story-tile-trend--down { --trend:var(--dn); }
.module-app-layer__data-story-tile-trend-plot { display:block; width:100%; height:100%; overflow:hidden; }
.module-app-layer__data-story-tile-trend-area { fill:var(--trend); fill-opacity:.12; stroke:none; }
.module-app-layer__data-story-tile-trend-line { fill:none; stroke:var(--trend); stroke-width:2; stroke-linejoin:round; stroke-linecap:round; vector-effect:non-scaling-stroke; }
.module-app-layer__data-story-tile-trend-dot { stroke:var(--trend); stroke-width:4; stroke-linecap:round; vector-effect:non-scaling-stroke; }
.module-app-layer__data-story-tile-trend-dot:last-of-type { stroke-width:10; }
.module-app-layer__data-story-tile-trend-ticks { position:relative; min-width:4.4em; }
.module-app-layer__data-story-tile-trend-ticks>span { position:absolute; right:0; top:calc((var(--y) - 18) / 202 * 100%); font-size:13px; line-height:1.2; color:var(--mut); white-space:nowrap; font-variant-numeric:tabular-nums; }
.module-app-layer__data-story-tile-trend-ticks>span:last-child:not(:first-child) { transform:translateY(-100%); }
.module-app-layer__data-story-tile-trend-ticks>span:not(:first-child):not(:last-child) { display:none; }

/* 차례(tiles_order=value-first · 설계 R6) — 값 타일(칩·수치·추이선·이야기 타일) 먼저, 이동 타일(quick_facts) 맨 뒤. 켤 때만(뿌리 수식어) */
.module-app-layer--value-first { display:flex; flex-direction:column; }
.module-app-layer--value-first>* { min-width:0; }
.module-app-layer--value-first>.module-app-layer__quick-fact-title,
.module-app-layer--value-first>.module-app-layer__quick-fact-grid { order:1; }

/* ── 움직임(HAN 방식 그대로 — 뿌리 motion=reveal · 화면에 들어오면 script.js 가 is-rv-anim-go · 줄이기 설정이면 0) ── */
@media (prefers-reduced-motion:no-preference) {
  .module-app-layer--motion .module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row>i.is-rv-anim-go::after { transform-origin:left center; animation:module-app-layer-grow-x .9s ease-out .15s both; }
  .module-app-layer--motion .module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row:nth-child(2)>i.is-rv-anim-go::after { animation-delay:.21s; }
  .module-app-layer--motion .module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row:nth-child(3)>i.is-rv-anim-go::after { animation-delay:.27s; }
  .module-app-layer--motion .module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row:nth-child(n+4)>i.is-rv-anim-go::after { animation-delay:.33s; }
  .module-app-layer--motion .module-app-layer__data-story-tile-donut-multi>i.is-rv-anim-go { animation:module-app-layer-pop .6s ease-out both; }
  .module-app-layer--motion .module-app-layer__data-story-tile-range>i.is-rv-anim-go { animation:module-app-layer-pop .5s ease-out .2s both; }
  .module-app-layer--motion .module-app-layer__data-story-tile-trend-line.is-rv-anim-go { stroke-dasharray:1200; animation:module-app-layer-draw 1.2s ease-out both; }
  .module-app-layer--motion .module-app-layer__data-story-tile-trend-area.is-rv-anim-go { animation:module-app-layer-fade 1s ease-out .4s both; }
  .module-app-layer--motion .module-app-layer__data-story-tile-trend-dot.is-rv-anim-go { animation:module-app-layer-fade .4s ease-out 1s both; }
}
/* 🆕 2026-09-28(HBJ조 · 사용자 눈검수 「현재 페이지 앵커 링크라면 3시 방향 아니고 4:30분 방향이거든」 · 지휘자 전달 13)
   같은 페이지 앵커(href^="#") = 원형 화살표 45도(4시 반 ↘) · 다른 페이지 = 3시(→). 선례 = 위 meta-tile·versus-compare-panel [href^="#"] 규칙.
   템플릿에 modifier 를 붙이지 않고 «링크의 href» 로 가른다(quick-fact-card 등 modifier 가 빠진 자리를 한 번에 덮음) · hover 이동 = 선례와 같은 대각선.
   역방향 = --anchor modifier 가 붙었어도 href 가 다른 페이지면 3시로 되돌린다(modifier 와 실제 링크가 어긋난 자리). */
.module-app-layer__panel a[href^="#"] .u-row-entrance-arrow-badge,
.module-app-layer__panel a.module-app-layer__stat-tile-metric-content[href^="#"]::after,
.module-app-layer__panel a.module-app-layer__cross-axis-summary-link[href^="#"]::after { transform:rotate(45deg); }
.module-app-layer__panel a[href^="#"]:hover .u-row-entrance-arrow-badge,
.module-app-layer__panel a[href^="#"]:focus-visible .u-row-entrance-arrow-badge,
.module-app-layer__panel a.module-app-layer__stat-tile-metric-content[href^="#"]:hover::after,
.module-app-layer__panel a.module-app-layer__stat-tile-metric-content[href^="#"]:focus-visible::after,
.module-app-layer__panel a.module-app-layer__cross-axis-summary-link[href^="#"]:hover::after,
.module-app-layer__panel a.module-app-layer__cross-axis-summary-link[href^="#"]:focus-visible::after { transform:rotate(45deg) translate(1.5px,1.5px); }
.module-app-layer__panel a:not([href^="#"]) .module-app-layer__row-entrance-arrow-badge--anchor { transform:none; }
.module-app-layer__panel a:not([href^="#"]):hover .module-app-layer__row-entrance-arrow-badge--anchor,
.module-app-layer__panel a:not([href^="#"]):focus-visible .module-app-layer__row-entrance-arrow-badge--anchor { transform:translateX(2px); }
/* 🆕 2026-09-28(HCD조 · 사용자 승인 · 품목 동등 원칙 ② «타일 전부 앵커») — 수치 셀(composition-donut-stat-cell)의 url 칸.
   마크업·배지 = 대표 칸(headline-stat-block) 링크 그대로(같은 .module-app-layer__headline-stat-link · ::after 가 칸 전체를 덮음 · 위 2069~2075 규칙의 셀판).
   url 없는 셀은 :has() 가 걸리지 않아 모양 그대로(회귀 0) · 화살표 방향은 바로 위 [href^="#"] 규칙(같은 페이지 = 4시 반)이 가른다. */
.module-app-layer__composition-donut-stat-cell:has(> .module-app-layer__headline-stat-link) { position:relative; transition:background .16s ease, border-color .16s ease; }
.module-app-layer__composition-donut-stat-cell:has(> .module-app-layer__headline-stat-link)>.module-app-layer__mini-trend-key { padding-right:26px; }
.module-app-layer__composition-donut-stat-cell:has(> .module-app-layer__headline-stat-link:hover) { border-color:var(--acc); background:var(--acc-s); }
.module-app-layer__composition-donut-stat-cell:has(> .module-app-layer__headline-stat-link:focus-visible) { border-color:var(--acc); background:var(--acc-s); outline:2px solid var(--acc); outline-offset:2px; }
@media (prefers-reduced-motion:reduce) {
  .module-app-layer__composition-donut-stat-cell:has(> .module-app-layer__headline-stat-link) { transition:none; }
}
/* 🆕 2026-09-29(HCN조 · 지시서 _지시서-HCN-앱층H2·머리칸배치-20260929.md 과제 8 · 사용자 /deposit/time-deposit/12m/ 「구분선이 없고, 전체를 사용해야 하지 않는 것 같은데?
   원형 화살표 위치를 보니까」 · 「이건 모듈 단위로 수정하라고 했는데?」) — hub 판(composition-donut-stat-panel) «배치 속성만»(글자 크기 0 · 마크업 0).
   원인 = 판 격자가 «머리 1 + 셀 3» 전제의 4칸 고정(:1152 1.5fr 1fr 1fr 1fr)이라 칸이 넷보다 적으면 오른쪽이 비고(머리 1칸 = 판의 1/3 · 화살표가 판 가운데),
          판 안 머리 칸은 테두리 0(:1584)이라 머리 칸끼리 구분선이 없었다(실측 _sandbox/HCN-앱층H2-20260929/shot/before/_measure.json).
   ① 칸 4개 이하 = 첫 칸 1.5 · 나머지 1 비율로 «있는 만큼» 판 전체를 채운다(4개면 예전 1.5·1·1·1 과 같음 = 회귀 0 · 5개 판은 그대로 — 좁은 폭 넘침 방지).
   ② 머리 칸만 있는 판 = 같은 너비로 나란히(1개 = 판 전체 → 화살표가 판 오른쪽 끝).
   ③ 머리 칸끼리 구분선 = 셀 구분선(:1582 border-left 1px var(--line))과 같은 선.
   ④ 좁은 화면(≤720px) = 예전처럼 2열 · 홀수 개의 마지막 칸은 한 줄 전체(빈 자리 0) · 2행부터 윗선(:1505 셀 규칙의 머리 칸판).
   axis(axstats)·entity(summary-metric-five-column-grid)는 다른 클래스라 무접촉. 되돌리기 = style.css.bak_20260929-HCN */
.module-app-layer__composition-donut-stat-panel:not(:has(> :nth-child(5))) { grid-template-columns:minmax(0,1.5fr); grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); }
.module-app-layer__composition-donut-stat-panel:not(:has(> .module-app-layer__composition-donut-stat-cell)) { grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); }
.module-app-layer__composition-donut-stat-panel>.module-app-layer__headline-stat-block+.module-app-layer__headline-stat-block { border-left:1px solid var(--line); }
@media (max-width:720px) {
.module-app-layer__composition-donut-stat-panel:not(:has(> :nth-child(5))),
.module-app-layer__composition-donut-stat-panel:not(:has(> .module-app-layer__composition-donut-stat-cell)) { grid-auto-flow:row; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.module-app-layer__composition-donut-stat-panel>:last-child:nth-child(odd) { grid-column:1 / -1; }
.module-app-layer__composition-donut-stat-panel>.module-app-layer__headline-stat-block:nth-child(odd) { border-left:0; }
.module-app-layer__composition-donut-stat-panel>.module-app-layer__headline-stat-block:nth-child(n+3) { border-top:1px solid var(--line); }
}
/* 🔴 2026-09-29 지휘자 — 사용자 /deposit/ 「구분 여백이 없어. 안에 2개 타일 카드 사이에」 · 모듈 단위 수정 지시
   원인 = 머리 칸만 있는 판(셀 0)이 «겉틀 1개 + 안쪽 1px 구분선»이라, 바로 아래 타일 카드(따로 테두리 · gap 7px · :1386)와 모양이 달라 붙어 보임
          + 겉틀 안에 칸을 넣은 구조 = «테두리 한 겹 = 카드만 · 겉틀 0» 규칙 위반.
   처방 = 셀 없는 판만: 판 겉틀·배경 0 + 간격 7px(타일 격자와 같은 값) · 머리 칸마다 타일과 같은 테두리·모서리·배경 · 위 HCN 구분선 규칙 무효화.
   머리 + 셀 섞인 판(도넛·셀 판)은 무접촉. 되돌리기 = style.css.bak_20260929-지휘자-머리칸카드 */
.module-app-layer__composition-donut-stat-panel:not(:has(> .module-app-layer__composition-donut-stat-cell)) { border:0; background:transparent; border-radius:0; overflow:visible; gap:7px; }
.module-app-layer__composition-donut-stat-panel:not(:has(> .module-app-layer__composition-donut-stat-cell))>.module-app-layer__headline-stat-block { border:1px solid var(--line2); border-radius:var(--r-s); background:var(--surf); }
.module-app-layer__composition-donut-stat-panel:not(:has(> .module-app-layer__composition-donut-stat-cell))>.module-app-layer__headline-stat-block+.module-app-layer__headline-stat-block { border-left:1px solid var(--line2); }
@media (max-width:720px) {
.module-app-layer__composition-donut-stat-panel:not(:has(> .module-app-layer__composition-donut-stat-cell))>.module-app-layer__headline-stat-block:nth-child(odd) { border-left:1px solid var(--line2); }
.module-app-layer__composition-donut-stat-panel:not(:has(> .module-app-layer__composition-donut-stat-cell))>.module-app-layer__headline-stat-block:nth-child(n+3) { border-top:1px solid var(--line2); }
}

/* 🔴 2026-09-29 지휘자 — 사용자 「도넛 차트에서는 이웃하는 색상이 비슷하지 않도록 해. 구분이 잘 안 돼」
   원인 = 조각 차례 c1 보라(#5B4CE8) → c2 청록(#08788E) = 둘 다 진하고 밝기 비슷 → 두 조각 도넛(예 정기예금 vs 적금)에서 구분 안 됨.
   처방 = 차례를 보라 → 주황(c3) → 청록(c2) → 분홍(c5) → 회색(c4)로(이웃끼리 색감·밝기 모두 다름) · 조각(:2192~2196)과 범례(:2201~2205) 같은 차례. 되돌리기 = style.css.bak_20260929-지휘자-도넛색 */
.module-app-layer__data-story-tile-donut-multi>i>b>i { --segment:var(--c3); }
.module-app-layer__data-story-tile-donut-multi>i>b>i>b>i { --segment:var(--c2); }
.module-app-layer__data-story-tile-donut-multi+.module-app-layer__data-story-tile-donut-legend>span:nth-child(2)>i { background:var(--c3); }
.module-app-layer__data-story-tile-donut-multi+.module-app-layer__data-story-tile-donut-legend>span:nth-child(3)>i { background:var(--c2); }

/* 🆕 2026-10-01 R2B조(PL-APP-MOD-01 · 사용자 09-29 「승인」 · 범위 = 이 2건만 · 되돌리기 = style.css.bak_20261001-R2B)
   ① 추이선 타일 = 이야기 타일 판(격자) 안 첫 칸 — 칸 수가 홀수면 마지막 타일이 두 열을 다 써서 «넓은 화면 빈칸 0»(추이선 홀로 선 판도 같은 규칙 · 옛 = 반 폭만 쓰고 옆이 빔).
      추이선 타일이 든 판에만 걸린다(:has) — 추이선 없는 이야기 판은 옛 그대로.
   ② 비교군 최선 값 = 값 글자만 빨강 굵게(셸 토큰 --compare-good · 색 하드코딩 0). 표지(best)는 자료가 준다 — 공동 1위 = 모두 · 전 행 같음 = 아무도 안 줌(표시층 계산 0). */
.module-app-layer__lens-entry-panel-group:has(> .module-app-layer__data-story-tile--trend)>.module-app-layer__data-story-tile:last-child:nth-child(odd) { grid-column:1 / -1; }
.module-app-layer__stat-tile-value--best,
.module-app-layer__data-story-tile-value--best,
.module-app-layer__data-story-tile-rows>.module-app-layer__compact-value-bar-row--best>em { color:var(--compare-good); font-weight:800; }
/* 🆕 2026-10-01(EYE1-MOD · A2 · 사용자 「앱층 붙어서 나오는 거 분리해. 타일 카드 여백 있어야 해」 · /seafood/ · /oil/wti/)
   원인 = 머리 칸 + 셀이 섞인 hub 판(composition-donut-stat-panel)이 «겉틀 1개 + 안쪽 1px 구분선»이라 타일이 붙어 보임(셀 없는 판만 09-29 에 카드화됨).
   처방 = 셀이 있는 판도 같은 방식: 겉틀·배경 0 + 간격 7px · 칸(headline-stat-block·composition-donut-stat-cell)마다 카드 테두리 한 겹·모서리·배경.
   안쪽 구분선(border-left/top)은 선택자 겹쳐 쓰기로 무효 · 마우스 올림·키보드 초점의 색 변화는 아래에서 되살림 · 상태 칸(유료·불가)은 배경 무접촉. 되돌리기 = style.css.bak_20261001-EYE1-MOD */
.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel { border:0; background:transparent; border-radius:0; overflow:visible; gap:7px; }
.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel>.module-app-layer__headline-stat-block.module-app-layer__headline-stat-block,
.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel>.module-app-layer__composition-donut-stat-cell.module-app-layer__composition-donut-stat-cell { border-style:solid; border-width:1px; border-color:var(--line2); border-radius:var(--r-s); }
.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel>.module-app-layer__headline-stat-block.module-app-layer__headline-stat-block,
.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel>.module-app-layer__composition-donut-stat-cell.module-app-layer__composition-donut-stat-cell:not(.module-app-layer__state-paid-source):not(.module-app-layer__state-unavailable-source) { background:var(--surf); }
.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel>.module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-link:hover),
.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel>.module-app-layer__composition-donut-stat-cell.module-app-layer__composition-donut-stat-cell:has(> .module-app-layer__headline-stat-link:hover),
.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel>.module-app-layer__headline-stat-block:has(> .module-app-layer__headline-stat-link:focus-visible),
.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel.module-app-layer__composition-donut-stat-panel>.module-app-layer__composition-donut-stat-cell.module-app-layer__composition-donut-stat-cell:has(> .module-app-layer__headline-stat-link:focus-visible) { border-color:var(--acc); background:var(--acc-s); }

/* ══ 🆕 2026-10-09 앱층 타일 승격(PR VIZ-PROMOTE · 사용자 10-09 「범용 모듈로 승격」) — 본문판 크기 토큰 ═══════════════════
   쓰는 곳 = 승격 범용 모듈 15종(core/modules/display/{dot-strip·hero-value-with-rank·lollipop·rank-columns·rank-standing-tile·podium·waffle·
   single-observation-point·range-bars·bullet·heatmap-grid·diverging-bars·map-pin-list·grade-filter-list·action-buttons}).
   그 모듈들은 뿌리에 .module-app-layer--content 를 달고, 앱층 index.html 의 «조각»을 부분 틀({{> app-layer:조각}})로 그대로 쓴다 — 마크업 복사 0.
   🔴 덮어쓰기만 — 이 블록은 위 규칙을 «고치지 않는다». 앱층 링크 타일(.module-app-layer__data-story-tile 단독)은 이 선택자에 걸리지 않는다(회귀 0).
   🔴 링크·화살표 배지는 조각 밖이라 본문판에 구조적으로 0 · 호버 들림 0 · 색 = 사이트 토큰만(hex 0) · 글자 13px 이상. 크기만 키운다 (그림 높이 64~74 → 160~180px · 점 8 → 11~12px · 칸 14 → 22px · 이름 칸 5em → 8~10em). */
.module-app-layer__panel.module-app-layer--content { margin-bottom:0; }
.module-app-layer--content .module-app-layer__data-story-tile { gap:12px; padding:18px 18px 16px; }
.module-app-layer--content .module-app-layer__data-story-tile:hover { transform:none; border-color:var(--line2); }
.module-app-layer--content .module-app-layer__data-story-tile-question { min-height:0; font-size:15px; }
.module-app-layer--content .module-app-layer__data-story-tile-value { font-size:32px; }
.module-app-layer--content .module-app-layer__data-story-tile-value em { font-size:15px; }
.module-app-layer--content .module-app-layer__data-story-tile-axis,
.module-app-layer--content .module-app-layer__data-story-tile-meta { font-size:14px; min-height:0; }
.module-app-layer--content .module-app-layer__data-story-tile-dots { height:160px; }
.module-app-layer--content .module-app-layer__data-story-tile-dots>i { bottom:calc(var(--level) * 9px + 1px); width:11px; height:11px; margin-left:-5.5px; }
.module-app-layer--content .module-app-layer__data-story-tile-ref>span { font-size:15px; }
.module-app-layer--content .module-app-layer__data-story-tile-bullet { height:28px; margin-top:10px; }
.module-app-layer--content .module-app-layer__data-story-tile-bullet>i { top:6px; bottom:6px; }
.module-app-layer--content .module-app-layer__data-story-tile-lollipops { height:180px; gap:6px; }
.module-app-layer--content .module-app-layer__data-story-tile-lollipop::after { width:12px; height:12px; margin-left:-6px; }
.module-app-layer--content .module-app-layer__data-story-tile-lollipop--up::after { bottom:calc(50% + var(--h) * .44% - 6px); }
.module-app-layer--content .module-app-layer__data-story-tile-lollipop--down::after { top:calc(50% + var(--h) * .44% - 6px); }
.module-app-layer--content .module-app-layer__data-story-tile-lollipop--missing::after { margin-top:-6px; }
.module-app-layer--content .module-app-layer__data-story-tile-rank { height:180px; gap:6px; }
.module-app-layer--content .module-app-layer__data-story-tile-diverging { gap:9px; }
.module-app-layer--content .module-app-layer__data-story-tile-diverging-row { grid-template-columns:minmax(0,10em) 1fr auto; font-size:15px; }
.module-app-layer--content .module-app-layer__data-story-tile-diverging-track { height:14px; }
.module-app-layer--content .module-app-layer__data-story-tile-waffle { grid-template-columns:repeat(6,22px); gap:5px; }
.module-app-layer--content .module-app-layer__data-story-tile-waffle>i { width:22px; height:22px; border-radius:4px; }
.module-app-layer--content .module-app-layer__data-story-tile-waffle-count { font-size:22px; }
.module-app-layer--content .module-app-layer__data-story-tile-heat { grid-template-columns:8em repeat(var(--columns), minmax(0,1fr)); gap:5px; }
.module-app-layer--content .module-app-layer__data-story-tile-heat-cell { height:36px; }
.module-app-layer--content .module-app-layer__data-story-tile-heat-column,
.module-app-layer--content .module-app-layer__data-story-tile-heat-row { font-size:14px; }
.module-app-layer--content .module-app-layer__data-story-tile-spark-single { height:80px; }
.module-app-layer--content .module-app-layer__data-story-tile-spark-single>i { width:14px; height:14px; margin:-7px 0 0 -7px; }
.module-app-layer--content .module-app-layer__headline-stat-value { font-size:44px; }
.module-app-layer--content .module-app-layer__headline-stat-key { font-size:15px; }
@media (max-width:720px) {
  .module-app-layer--content .module-app-layer__data-story-tile-heat { grid-template-columns:5.2em repeat(var(--columns), minmax(0,1fr)); gap:3px; } /* 360px: 열이 많으면 데이터 표로 대체(설계 §멈출 조건 ③) */
  .module-app-layer--content .module-app-layer__data-story-tile-diverging-row { grid-template-columns:minmax(0,6em) 1fr auto; }
  .module-app-layer--content .module-app-layer__range-row { grid-template-columns:minmax(0,1fr) auto; row-gap:4px; } /* 2026-10-09 360px: 막대가 35px 로 눌리던 것(이름·값 위줄 · 막대 아래줄) */
  .module-app-layer--content .module-app-layer__range-name { grid-area:1/1; }
  .module-app-layer--content .module-app-layer__range-value { grid-area:1/2; }
  .module-app-layer--content .module-app-layer__range-track { grid-area:2/1/3/3; }
  .module-app-layer--content .module-app-layer__map-row { flex-wrap:wrap; }
  .module-app-layer--content .module-app-layer__map-rings { width:150px; height:150px; }
  .module-app-layer--content .module-app-layer__map-list { flex:1 1 100%; }
}

/* ══ 🆕 2026-10-09 앱층 타일 승격 — 샘플에만 있던 이야기 타일 4종을 앱층에 먼저 추가(설계 §5) ═══════════════════════
   모양 원천 = docs/design/platform/_시안/앱층-부품/앱층-타일-샘플.html 의 해당 카드 CSS(L69·L169·L190·L197-198·L103-104)를 «그대로» 옮김 · 새 디자인 0.
   🔴 선택자 전부 «새 이름»(rank-sentence · podium · range-rows · map-row · grade-filter) — 기존 규칙은 한 줄도 안 바꿨다 · 색 = 사이트 토큰만 · 글자 13px 이상.
   🔴 순위 상자 = 기존 headline-stat-rank 재사용(샘플 .osc 와 같은 그림). 샘플 --crit(빨강) = var(--dn) · --c6(회색) = var(--mut). */
/* 순위상자-문장(viz=rank_sentence) */
.module-app-layer__rank-sentence-list { display:grid; gap:10px; }
.module-app-layer__rank-sentence { display:flex; gap:10px; align-items:flex-start; }
.module-app-layer__rank-sentence>.module-app-layer__headline-stat-rank { flex:none; min-width:74px; }
.module-app-layer__rank-sentence>p { margin:0; font-size:14px; line-height:1.5; color:var(--ink2); }
/* 시상대(viz=podium) — 기둥 높이 = 데이터가 준 백분율(h) */
.module-app-layer__podium { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; align-items:end; height:190px; }
.module-app-layer__podium-col { display:flex; flex-direction:column; justify-content:flex-end; height:100%; text-align:center; min-width:0; }
.module-app-layer__podium-col>small { font-size:13px; line-height:1.3; color:var(--ink2); }
.module-app-layer__podium-col>b { font-size:16px; margin:2px 0 3px; }
.module-app-layer__podium-col>i { display:flex; align-items:flex-start; justify-content:center; max-height:56px; min-height:30px; border-radius:6px 6px 0 0; background:var(--acc-s); }
.module-app-layer__podium-col--first>i { background:var(--acc); }
.module-app-layer__podium-col>i>em { font-style:normal; font-size:13px; font-weight:800; padding-top:4px; color:var(--acc-i); }
.module-app-layer__podium-col--first>i>em { color:var(--surf); }
/* 구간막대(viz=range_rows) — 막대 = 최저~최고 · 점 = 평균 */
.module-app-layer__range-rows { display:grid; gap:7px; }
.module-app-layer__range-row { display:grid; grid-template-columns:minmax(0,5.2em) 1fr auto; gap:8px; align-items:center; font-size:13px; }
.module-app-layer__range-name { white-space:normal; word-break:keep-all; overflow-wrap:anywhere; }
.module-app-layer__range-track { position:relative; height:12px; border-radius:6px; background:var(--surf2); }
.module-app-layer__range-track>i { position:absolute; top:2px; bottom:2px; border-radius:4px; background:var(--acc); opacity:.45; }
.module-app-layer__range-track>b { position:absolute; top:0; width:12px; height:12px; margin-left:-6px; border-radius:50%; background:var(--acc-i); } /* 2026-10-09 원 = 폭·높이 같게(옛 10×12 길쭉) */
.module-app-layer__range-value { font-weight:700; text-align:right; }
/* 지도핀-목록(viz=map_pins) — 고리 = 거리 간격 · 핀 방향은 표시용 */
.module-app-layer__map-row { display:flex; gap:10px; align-items:center; }
.module-app-layer__map-rings { flex:none; width:112px; height:112px; }
.module-app-layer__map-ring { fill:none; stroke:var(--line2); stroke-dasharray:2 3; }
.module-app-layer__map-ring--outer { stroke-dasharray:0; }
.module-app-layer__map-center { fill:var(--ink); }
.module-app-layer__map-pin { fill:var(--acc); stroke:var(--surf); stroke-width:1.5; }
.module-app-layer__map-pin--far { fill:var(--mut); }
.module-app-layer__map-list { display:grid; gap:5px; flex:1; min-width:0; }
.module-app-layer__map-list-row { min-width:0; display:flex; align-items:center; gap:8px; padding:7px 9px; border:1px solid var(--line); border-radius:8px; font-size:14px; }
.module-app-layer__map-list-rank { display:inline-grid; place-items:center; min-width:19px; height:19px; border-radius:5px; background:var(--acc-s); color:var(--acc-i); font-size:13px; }
.module-app-layer__map-list-name { flex:1; min-width:0; word-break:keep-all; overflow-wrap:anywhere; }
.module-app-layer__map-list-name>small { display:block; font-size:13px; color:var(--mut); }
.module-app-layer__map-list-value { flex:none; font-weight:800; }
/* 목록-등급필터(viz=grade_filter) — 라디오 :checked + :has() · 스크립트 0 · 칸 번호 0=전체 1~4=등급(data-grade) */
.module-app-layer__grade-filter { position:relative; display:grid; gap:9px; }
.module-app-layer__grade-radio { position:absolute; opacity:0; pointer-events:none; }
.module-app-layer__grade-tabs { display:flex; flex-wrap:wrap; gap:6px; }
.module-app-layer__grade-tabs>label { font-size:13px; font-weight:700; padding:4px 11px; border-radius:20px; border:1px solid var(--line2); background:var(--surf); color:var(--ink2); cursor:pointer; }
.module-app-layer__grade-rows { display:grid; gap:5px; }
.module-app-layer__grade-row { min-width:0; display:flex; align-items:center; gap:8px; padding:7px 9px; border:1px solid var(--line); border-radius:8px; font-size:14px; }
.module-app-layer__grade-pill { flex:none; font-size:13px; font-weight:800; padding:1px 6px; border-radius:5px; background:var(--surf2); border:1px solid var(--line2); color:var(--ink2); }
.module-app-layer__grade-pill--premium { background:var(--acc-s); border-color:transparent; color:var(--acc-i); }
.module-app-layer__grade-name { flex:1; min-width:0; word-break:keep-all; overflow-wrap:anywhere; }
.module-app-layer__grade-name>small { display:block; font-size:13px; color:var(--mut); }
.module-app-layer__grade-value { flex:none; font-weight:800; }
.module-app-layer__grade-tail { font-size:13px; color:var(--mut); }
.module-app-layer__grade-filter:has(.module-app-layer__grade-radio[data-grade="0"]:checked) .module-app-layer__grade-tabs>label[data-grade="0"],
.module-app-layer__grade-filter:has(.module-app-layer__grade-radio[data-grade="1"]:checked) .module-app-layer__grade-tabs>label[data-grade="1"],
.module-app-layer__grade-filter:has(.module-app-layer__grade-radio[data-grade="2"]:checked) .module-app-layer__grade-tabs>label[data-grade="2"],
.module-app-layer__grade-filter:has(.module-app-layer__grade-radio[data-grade="3"]:checked) .module-app-layer__grade-tabs>label[data-grade="3"],
.module-app-layer__grade-filter:has(.module-app-layer__grade-radio[data-grade="4"]:checked) .module-app-layer__grade-tabs>label[data-grade="4"] { background:var(--acc); border-color:var(--acc); color:var(--surf); }
.module-app-layer__grade-filter:has(.module-app-layer__grade-radio[data-grade="1"]:checked) .module-app-layer__grade-row:not([data-grade="1"]),
.module-app-layer__grade-filter:has(.module-app-layer__grade-radio[data-grade="2"]:checked) .module-app-layer__grade-row:not([data-grade="2"]),
.module-app-layer__grade-filter:has(.module-app-layer__grade-radio[data-grade="3"]:checked) .module-app-layer__grade-row:not([data-grade="3"]),
.module-app-layer__grade-filter:has(.module-app-layer__grade-radio[data-grade="4"]:checked) .module-app-layer__grade-row:not([data-grade="4"]) { display:none; }
.module-app-layer__grade-filter:has(.module-app-layer__grade-radio:focus-visible) .module-app-layer__grade-tabs { outline:2px solid var(--acc); outline-offset:2px; }
/* 본문판 크기(위 «본문판 크기 토큰» 블록과 같은 방식 — 덮어쓰기만) */
.module-app-layer--content .module-app-layer__rank-sentence>p { font-size:16px; }
.module-app-layer--content .module-app-layer__podium { height:260px; }
.module-app-layer--content .module-app-layer__podium-col>i { max-height:90px; min-height:40px; }
.module-app-layer--content .module-app-layer__podium-col>small,.module-app-layer--content .module-app-layer__podium-col>i>em { font-size:15px; }
.module-app-layer--content .module-app-layer__range-row { grid-template-columns:minmax(0,8em) 1fr auto; font-size:15px; }
.module-app-layer--content .module-app-layer__range-track { height:18px; border-radius:9px; }
.module-app-layer--content .module-app-layer__range-track>b { width:18px; height:18px; margin-left:-9px; } /* 2026-10-09 원 = 폭·높이 같게(옛 14×18 길쭉) */
.module-app-layer--content .module-app-layer__map-rings { width:180px; height:180px; }
.module-app-layer--content .module-app-layer__map-list-row,.module-app-layer--content .module-app-layer__grade-row { font-size:16px; padding:10px 12px; }
.module-app-layer--content .module-app-layer__grade-tabs>label { font-size:15px; padding:6px 14px; }

/* 🆕 2026-10-09 기준선 표지 색 구분(분포점줄 app-dot-strip · 불릿 · 범위 — .module-app-layer__data-story-tile-ref 를 쓰는 세 타일 공용)
   사용자 원문 «항목들 선/글자 색상 구분이 잘 되도록» · «검정,파랑,초록... 거의 구분이 안 돼» · «선과 글자가 색상이 동일하게 매칭되어야 하지 않아?» · «다른 색상으로 사용하는 것이 있는 것 같은데?»
   옛 문제: ①자기(acc 남보라)·상위(mut 어두운 회색)·전국(c2 청록)이 모두 어둡고 명도가 비슷해 가는 선·작은 글자에서 안 갈렸다(청록↔회색 ΔE 21) ②선과 글자 색이 달랐다(ref-1 선 --mut ↔ 글자 --ink2 · ref-3 선 --c3 ↔ 글자 --warn).
   규칙: ①표지마다 색상(hue)이 뚜렷이 다르고 명도 차도 큼 ②등락·유리 판정 없는 표지에 빨강·파랑(등락 색) 안 씀 ③선 모양도 다름(굵은 실선 · 점선 · 점 · 가는 실선)
         ④선(또는 점) 색 = 그 표지 글자 색 — 같은 토큰 하나를 둘 다에(--ref-N-ink 도 --ref-N 과 같은 값) · 글자만 따로 진하게/연하게 바꾸지 않음 · 바탕 대비가 모자라면 그 토큰 자체를 대비 되는 색으로 고름(전부 --surf 대비 4.5:1 이상) ⑤색 = 사이트 공용 토큰만(hex 0).
   값: 자기 --acc 실선 · 상위 지역(ref-1) --warn 점선 · 전국(ref-2) --c2 점 · 그 밖(ref-3) --ink 가는 실선. 값 바꾸는 곳 = 위 .module-app-layer__panel 의 --ref-N 한 줄(세 타일 함께 바뀜) + 아래 선 모양. 승격 모듈 dot-strip·bullet 은 앱층 조각을 쓰므로 그대로 공유한다. */
.module-app-layer__data-story-tile-ref { border-left-width:3px; }
.module-app-layer__data-story-tile-ref--ref-1 { border-left-style:dashed; }
.module-app-layer__data-story-tile-ref--ref-2 { border-left-style:dotted; }
.module-app-layer__data-story-tile-ref--ref-3 { border-left-style:solid; border-left-width:2px; } /* 이중선(double 4px)은 1px 두 줄 사이가 비어 «채워지지 않은 선»으로 보였다(2026-10-09 «울산 1870 선이 채워지지 않았다») → 가는 실선 */

/* 2026-10-09 행동 카드 줄(action-cards 조각 · 본문 짝 = action-buttons) — 샘플 타일 «단추-행동» 그대로: 제목·부제 + 아이콘 카드 2장. 색은 토큰만 · 글자 13px 이상. */
.module-app-layer__action-cards { display:grid; gap:0; min-width:0; }
.module-app-layer__action-cards-subtitle { display:block; font-size:13px; color:var(--mut); margin:3px 0 8px; line-height:1.4; }
.module-app-layer__action-pair { display:grid; gap:7px; grid-template-columns:1fr 1fr; }
.module-app-layer__action-card { display:grid; justify-items:center; gap:1px; padding:10px 8px; border:1px solid transparent; border-radius:var(--r-s); background:var(--surf2); color:inherit; text-decoration:none; text-align:center; min-width:0; }
.module-app-layer__action-card:hover, .module-app-layer__action-card:focus-visible { border-color:var(--acc); }
.module-app-layer__action-card svg { width:22px; height:22px; color:var(--acc); }
.module-app-layer__action-card b { font-size:14px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.module-app-layer__action-card span { font-size:13px; color:var(--mut); }
.module-app-layer__action-cards .module-app-layer__data-story-tile-question { font-size:14px; font-weight:700; color:var(--ink); line-height:1.35; min-height:0; } /* 2026-10-09 지휘자 그림 판정: 샘플 .tk(14px 굵게 · 글자색 ink) 와 같게 — 옛 값은 13px 옅은 회색 */
/* 전화 카드 색 = 샘플 --ok(초록) 짝. 긍정 초록 토큰이 없고 --up/--dn 은 등락 색이라(시세는 --up = 상승 빨강) 등락이 아닌 곳에 못 쓴다 → 비등락 계열색 --c2(청록)로 둔다. */
.module-app-layer__action-card--tel { border-color:var(--c2); background:color-mix(in srgb, var(--c2) 11%, var(--surf)); }
.module-app-layer__action-card--tel svg, .module-app-layer__action-card--tel b { color:var(--c2); }
.module-app-layer--content .module-app-layer__action-card { padding:14px 10px; }
.module-app-layer--content .module-app-layer__action-card svg { width:26px; height:26px; }
.module-app-layer--content .module-app-layer__action-card b { font-size:16px; }
.module-app-layer--content .module-app-layer__action-cards-subtitle { font-size:14px; }
/* 2026-10-09 표지 글자가 다른 표지 선에 가려지던 것 수리(지휘자 그림 판정 «사하구 1,816원 위로 부산 점선이 지나감») — 표지 글자(span · 바탕 --surf)를 모든 표지 선 위에 올린다.
   원인: 선(em 의 border-left)은 뒤에 오는 표지가 앞 표지 글자 위에 그린다(글자 span 은 z-index 자동이라 em 과 같은 층). 글자 span 에 z-index:1 → 글자 바탕이 선을 덮는다.
   불릿·범위 표지는 글자 바탕이 없고(background:none) 선 밑에 놓여 영향 0. */
.module-app-layer__data-story-tile-ref>span { z-index:1; }

/* ══ 🆕 2026-10-09 앱층 44종 완성(PR VIZ-PROMOTE · 사용자 10-09 「앱층은 44종」) — 샘플에만 있던 이야기 타일 18종 ═══════════════════
   모양 원천 = docs/design/platform/_시안/앱층-부품/앱층-타일-샘플.html <style> L16~L204 의 해당 규칙을 «그대로» 옮김 · 새 디자인 0 · 이름만 module-app-layer__ 접두.
   viz 이름 = app-<짝 범용 모듈[-변형]> (접두 app- 를 떼면 짝 이름). 색 = 사이트 토큰만(hex 0) · 글자 13px 이상.
   색 대응: 샘플 --paper=--surf · --sunk=--surf2 · --accent=--acc(-s -i) · --line-2=--line2 · --muted=--mut · --ink-2=--ink2 ·
            샘플 --ok(초록) = --c2 (긍정 초록 토큰 없음 · 등락 색 --up/--dn 은 등락 칸 T2 변동 칩에만) · 샘플 --crit(빨강) = --c3/--c5 (등락 아닌 자리) · --c6 = --mut.
   기존 규칙은 한 줄도 안 고쳤다(새 이름만). */
.module-app-layer__data-story-tile--sheet { display:block; padding:11px 12px 12px; }
.module-app-layer__data-story-tile--sheet .module-app-layer__data-story-tile-question { display:block; font-size:14px; font-weight:700; color:var(--ink); line-height:1.35; min-height:0; padding-right:26px; }
.module-app-layer__data-story-tile-summary { display:block; font-size:13px; color:var(--mut); margin:3px 0 8px; line-height:1.4; }
.module-app-layer__lens-entry-panel-group > .module-app-layer__data-story-tile--wide { flex:1 1 100%; }
.module-app-layer__tile-sub { margin:6px 0 0; font-size:13px; color:var(--ink2); }
.module-app-layer__tone--1 { --tone:var(--acc); } .module-app-layer__tone--2 { --tone:var(--c2); } .module-app-layer__tone--3 { --tone:var(--c3); } .module-app-layer__tone--4 { --tone:var(--c4); } .module-app-layer__tone--5 { --tone:var(--c5); }
/* T2 큰값-변화 · T3 큰값-대표 */
.module-app-layer__big { margin:0; font-size:30px; font-weight:800; letter-spacing:-.03em; line-height:1.05; font-variant-numeric:tabular-nums; }
.module-app-layer__big small { font-size:15px; margin-left:2px; }
.module-app-layer__big--ok { color:var(--c2); }
.module-app-layer__delta-chips { display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 0; }
.module-app-layer__delta { display:inline-flex; align-items:baseline; gap:3px; font-size:15px; font-weight:800; padding:3px 9px; border-radius:20px; font-variant-numeric:tabular-nums; }
.module-app-layer__delta em { font-style:normal; font-size:13px; font-weight:600; margin-left:3px; }
.module-app-layer__delta--up { color:var(--up); background:var(--up-s); } .module-app-layer__delta--down { color:var(--dn); background:var(--dn-s); }
.module-app-layer__herorow { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.module-app-layer__herorow .module-app-layer__big { flex:none; }
.module-app-layer__hero-meta { flex:none; font-size:13px; color:var(--mut); text-align:right; line-height:1.4; }
/* T5 실물-대표카드 */
.module-app-layer__item-hero { display:flex; gap:12px; align-items:center; }
.module-app-layer__card-frame { flex:none; display:grid; align-content:center; justify-items:center; gap:2px; width:84px; aspect-ratio:63/88; border-radius:7px; border:1px solid var(--line2); background:linear-gradient(160deg,var(--acc-s),var(--surf)); font-size:13px; color:var(--ink2); }
.module-app-layer__card-frame b { font-size:15px; color:var(--ink); }
.module-app-layer__item-facts { display:grid; gap:5px; margin:0; min-width:0; flex:1; }
.module-app-layer__item-facts div { display:flex; justify-content:space-between; gap:10px; font-size:14px; }
.module-app-layer__item-facts dt { color:var(--mut); font-size:13px; } .module-app-layer__item-facts dd { margin:0; font-weight:800; font-variant-numeric:tabular-nums; }
/* T14 가로막대-다층비율 */
.module-app-layer__layer-bars { list-style:none; margin:0; padding:0; display:grid; gap:5px; }
.module-app-layer__layer-bars li { display:grid; grid-template-columns:minmax(0,7.5em) 1fr auto; gap:8px; align-items:center; font-size:13px; }
.module-app-layer__layer-bars-key { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.module-app-layer__layer-bars-track { height:9px; border-radius:5px; background:var(--surf2); overflow:hidden; }
.module-app-layer__layer-bars-track i { display:block; height:100%; background:var(--acc); border-radius:5px; }
.module-app-layer__layer-bars-track i.module-app-layer__layer-bars-fill--ok { background:var(--c2); } .module-app-layer__layer-bars-track i.module-app-layer__layer-bars-fill--muted { background:var(--line2); }
.module-app-layer__layer-bars-value { font-weight:700; text-align:right; font-variant-numeric:tabular-nums; }
/* T15 누적막대-구성 */
.module-app-layer__stack-bar { display:flex; height:14px; border-radius:7px; overflow:hidden; margin:4px 0 8px; }
.module-app-layer__stack-bar i { display:block; height:100%; background:var(--tone); }
.module-app-layer__legend { list-style:none; margin:0; padding:0; font-size:13px; display:grid; gap:2px; }
.module-app-layer__legend i { display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:5px; vertical-align:-1px; background:var(--tone); }
.module-app-layer__legend--wrap { display:flex; flex-wrap:wrap; gap:3px 12px; }
/* T17 도넛-분모고정 */
.module-app-layer__donutrow { display:flex; align-items:center; gap:12px; }
.module-app-layer__donut { flex:none; position:relative; width:78px; height:78px; border-radius:50%; display:grid; place-items:center; }
.module-app-layer__donut::after { content:""; position:absolute; inset:12px; border-radius:50%; background:var(--surf); }
.module-app-layer__donut b { position:relative; z-index:1; font-size:15px; }
.module-app-layer__donut-line { margin:0; font-size:14px; font-weight:700; } .module-app-layer__donut-line span { font-size:13px; font-weight:400; color:var(--mut); }
/* T21 추이선-두선비교 */
.module-app-layer__spark-two { width:100%; height:56px; display:block; }
.module-app-layer__spark-line { stroke:var(--tone); } .module-app-layer__spark-dot { fill:var(--tone); }
.module-app-layer__day-legend { display:flex; flex-wrap:wrap; gap:4px 12px; margin:6px 0 0; font-size:13px; color:var(--mut); }
.module-app-layer__sw { display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:4px; vertical-align:-1px; }
.module-app-layer__day-legend .module-app-layer__sw[class*="tone--"] { background:var(--tone); }
.module-app-layer__sw--ok { background:var(--c2); opacity:.5; } .module-app-layer__sw--night { background:var(--acc); opacity:.4; } .module-app-layer__sw--now { background:var(--c5); }
.module-app-layer__sw--mark { background:var(--acc); opacity:.7; } .module-app-layer__sw--busy { background:var(--acc); opacity:.2; }
/* T26 바늘게이지-분포모양 */
.module-app-layer__needle { display:block; width:100%; max-width:190px; height:auto; margin:4px auto 0; }
.module-app-layer__needle-arc--1 { stroke:var(--c2); } .module-app-layer__needle-arc--2 { stroke:var(--c3); } .module-app-layer__needle-arc--3 { stroke:var(--c5); }
.module-app-layer__needle-line { stroke:var(--ink); } .module-app-layer__needle-pivot { fill:var(--ink); }
/* T28 산점도 */
.module-app-layer__scatter { height:104px; }
.module-app-layer__scatter-axis { stroke:var(--line2); }
.module-app-layer__scatter-dot { fill:var(--mut); } .module-app-layer__scatter-dot--near { fill:var(--acc); }
/* T30 대결-두대상 */
.module-app-layer__versus { display:grid; grid-template-columns:1fr auto 1fr; gap:8px; align-items:center; margin-top:4px; }
.module-app-layer__versus-side { display:grid; gap:1px; padding:8px; border:1px solid var(--line2); border-radius:var(--r-s); text-align:center; min-width:0; }
.module-app-layer__versus-side em { font-style:normal; font-size:13px; color:var(--mut); }
.module-app-layer__versus-side b { font-size:20px; font-variant-numeric:tabular-nums; }
.module-app-layer__versus-side small { font-size:13px; color:var(--ink2); line-height:1.35; }
.module-app-layer__versus-side--win { border-color:var(--c2); } .module-app-layer__versus-side--win b { color:var(--c2); }
.module-app-layer__versus-mark { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; border:2px solid var(--ink2); font-size:13px; font-weight:800; }
/* T32 시간축-구간 · T33 시간축-눈금 */
.module-app-layer__day-track { position:relative; display:block; height:22px; border-radius:5px; background:var(--surf2); overflow:hidden; }
.module-app-layer__day-axis i { position:absolute; top:0; bottom:0; }
.module-app-layer__day-band { background:var(--c2); opacity:.32; border-radius:4px; }
.module-app-layer__day-band--night { background:var(--acc); opacity:.24; }
.module-app-layer__day-busy { background:var(--acc); opacity:.16; border-radius:4px; }
.module-app-layer__day-mark { top:3px !important; bottom:3px !important; width:2px; margin-left:-1px; background:var(--acc); opacity:.55; border-radius:2px; }
.module-app-layer__day-mark--next { top:0 !important; bottom:0 !important; width:3px; opacity:1; }
.module-app-layer__day-now { width:3px; margin-left:-1px; background:var(--c5); }
/* T35 목록-잘림줄 */
.module-app-layer__list-items { list-style:none; margin:0; padding:0; display:grid; gap:5px; }
.module-app-layer__list-items li { min-width:0; display:flex; align-items:center; gap:8px; padding:7px 9px; border:1px solid var(--line); border-radius:8px; font-size:14px; }
.module-app-layer__list-rank { display:inline-grid; place-items:center; min-width:19px; height:19px; margin-right:5px; border-radius:5px; background:var(--acc-s); color:var(--acc-i); font-size:13px; }
.module-app-layer__list-name { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.module-app-layer__list-name small { display:block; font-size:13px; color:var(--mut); }
.module-app-layer__list-value { font-weight:700; font-variant-numeric:tabular-nums; }
.module-app-layer__list-more { margin:6px 0 0; font-size:13px; color:var(--mut); }
/* T37 벤토-갈래 */
.module-app-layer__bento-cells { display:grid; gap:7px; grid-template-columns:repeat(3,minmax(0,1fr)); flex:1 1 100%; }
.module-app-layer__bento-cell { position:relative; display:block; min-width:0; padding:9px 26px 10px 9px; border:1px solid var(--line2); border-radius:var(--r-s); background:var(--surf); color:inherit; text-decoration:none; }
.module-app-layer__bento-cell:hover { border-color:var(--acc); }
.module-app-layer__bento-cell--large { grid-column:span 2; grid-row:span 2; display:flex; flex-direction:column; justify-content:center; }
.module-app-layer__bento-key { display:block; font-size:13px; font-weight:600; color:var(--mut); line-height:1.3; }
.module-app-layer__bento-value { display:block; margin-top:3px; font-size:19px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.module-app-layer__bento-cell--large .module-app-layer__bento-value { font-size:30px; }
.module-app-layer__bento-sub { display:block; margin-top:3px; font-size:13px; color:var(--mut); }
.module-app-layer__bento-cell .u-row-entrance-arrow-badge { top:8px; right:6px; }
/* T40 슬라이더-계산 */
.module-app-layer__slider-calc input { width:100%; margin:4px 0 0; accent-color:var(--acc); }
.module-app-layer__calc-out { display:flex; justify-content:space-between; align-items:baseline; gap:10px; margin:8px 0 0; font-size:14px; }
.module-app-layer__calc-value { font-size:23px; font-weight:800; color:var(--acc); font-variant-numeric:tabular-nums; }
/* T42 글자-표지 · T43 글자-사실격자 */
.module-app-layer__tag-row { display:flex; flex-wrap:wrap; gap:6px; margin:0; }
.module-app-layer__tag { font-size:13px; font-weight:700; padding:2px 9px; border-radius:6px; background:var(--acc-s); color:var(--acc-i); }
.module-app-layer__fact-cells { display:grid; gap:6px; grid-template-columns:repeat(2,minmax(0,1fr)); margin:0; }
.module-app-layer__fact-cells div { padding:7px 9px; border:1px solid var(--line); border-radius:8px; min-width:0; }
.module-app-layer__fact-cells dt { font-size:13px; color:var(--mut); }
.module-app-layer__fact-cells dd { margin:0; font-size:16px; font-weight:800; font-variant-numeric:tabular-nums; }
.module-app-layer__fact-cells dd.module-app-layer__fact-tail { font-size:13px; font-weight:400; color:var(--ink2); }
@media (max-width:430px) { .module-app-layer__bento-cells { grid-template-columns:repeat(2,minmax(0,1fr)); } .module-app-layer__bento-cell--large { grid-column:span 2; grid-row:auto; } }
@media (prefers-reduced-motion:reduce) { .module-app-layer__slider-calc input { transition:none; } }

/* 🆕 2026-10-09 글자 최소 보장(사용자 10-09 «글자 사이즈를 최소 사이즈로 가독성이 있도록») — 문장형 보조 글(질문·풀이·곁말·범례·꼬리)은 14px 이상(짧은 이름표 13px · 본문 16px 은 그대로). 렌더 실측으로 13px 이던 자리만. 좁은 칸은 줄바꿈으로 처리(글자를 줄이지 않는다) */
.module-app-layer__data-story-tile-question,
.module-app-layer__data-story-tile-summary,
.module-app-layer__data-story-tile-meta,
.module-app-layer__data-story-tile-value em,
.module-app-layer__data-story-tile-axis span,
.module-app-layer__tile-sub,
.module-app-layer__headline-stat-rank span,
.module-app-layer__headline-stat-note,
.module-app-layer__podium-col small,
.module-app-layer__donut-line span,
.module-app-layer__versus-side small,
.module-app-layer__day-legend span,
.module-app-layer__list-more,
.module-app-layer__grade-name small,
.module-app-layer__grade-tail,
.module-app-layer__bento-sub,
.module-app-layer__action-cards-subtitle,
.module-app-layer__card-attribute-summary-line,
.module-app-layer__data-story-tile-delta { font-size:14px; }

/* 🆕 2026-10-09 간격 보장(사용자 10-09 «글자 사이 간격») — 값·이름표 바로 아래 설명 글 위 간격 ≥ 6px(실측 0~4px 이던 자리) · PL-APP-MOD-01 · CO-05 */
.module-app-layer__headline-stat-rank span { display:block; margin-top:6px; }
.module-app-layer__action-cards-subtitle { margin-top:6px; }
.module-app-layer__action-card b { margin-top:6px; }
.module-app-layer__action-card span { margin-top:6px; }
.module-app-layer__data-story-tile-donut-legend em, .module-app-layer__data-story-tile-donut-legend span { font-size:14px; }
.module-app-layer__podium-col b { margin-top:6px; }

/* ── 조 AL2(11-04) 절 머리 보강 — 범용 h2(module-app-layer__lens-entry-panel-title) 줄 오른쪽 끝에 «○○ 전체 보기 →» 링크(__lens-entry-panel-more). DOM 순서 = h2 → 링크(글 복사·낭독 순서) · 한 칸 격자에 둘을 겹쳐 놓고 링크를 오른쪽 위에 둠 · 링크 글자 수 = 변수 --lens-entry-panel-more-n(제목 첫 줄이 링크 밑으로 안 들어가게 float 빈칸 폭). 새 클래스만 추가(기존 규칙 바이트 동일) ── */
.module-app-layer__lens-entry-panel-head{display:grid;margin:0}
.module-app-layer__lens-entry-panel-head>h2.module-app-layer__lens-entry-panel-title{grid-area:1/1;text-wrap:wrap}   /* 범용 h2 의 text-wrap:balance 는 크롬에서 float 를 비켜 가지 않아(실측 11-04) 이 머리에서만 wrap */
.module-app-layer__lens-entry-panel-head>h2.module-app-layer__lens-entry-panel-title::before{content:"";float:right;height:1.35em;width:calc(var(--lens-entry-panel-more-n,0)*12.8px + 16px)}
.module-app-layer__lens-entry-panel-head>.module-app-layer__lens-entry-panel-more{grid-area:1/1;justify-self:end;align-self:start;margin:74px 0 0 12px;padding:0;font-size:15px;line-height:1.6}
@media(max-width:820px){.module-app-layer__lens-entry-panel-head>.module-app-layer__lens-entry-panel-more{margin-top:52px}}
@media(max-width:600px){.module-app-layer__lens-entry-panel-head>.module-app-layer__lens-entry-panel-more{margin-top:41px}}
@media(max-width:560px){.module-app-layer__lens-entry-panel-head>.module-app-layer__lens-entry-panel-more{margin-top:42px;font-size:13px}.module-app-layer__lens-entry-panel-head>h2.module-app-layer__lens-entry-panel-title::before{width:calc(var(--lens-entry-panel-more-n,0)*11.2px + 12px)}}
.module-app-layer__lens-entry-panel-more{font-weight:700;text-decoration:none;white-space:nowrap}
.module-app-layer__lens-entry-panel-more::after{content:" →"}
.module-app-layer__lens-entry-panel-more:hover,.module-app-layer__lens-entry-panel-more:focus-visible{text-decoration:underline}

/* core/modules/display/toc/style.css */

@media (max-width: 768px) {
}
.module-toc {
    margin: 30px 0;
    padding: 20px 25px;
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border-left: 4px solid #0284c7;
    border-radius: 8px;
}
.module-toc__title, .module-toc__title {
    font-size: 1.2em;
    font-weight: 700;
    color: #0c4a6e;
    margin: 0 0 15px;
}
.module-toc__list, .module-toc__list {
    list-style: none;
    padding: 0;
    margin: 0;
    counter-reset: toc-counter;
}
.module-toc__list li, .module-toc__list li {
    margin: 8px 0;
    padding-left: 0;
    line-height: 1.6;
    counter-increment: toc-counter;
    display: flex;
    align-items: baseline;
}
.module-toc__list li::before, .module-toc__list li::before {
    content: counter(toc-counter) ". ";
    color: #075985;
    font-weight: 500;
    margin-right: 8px;
    white-space: nowrap;
    flex-shrink: 0;
}
.module-toc__item--level-2 a, .module-toc__level--2 a {
    color: #075985;
    flex: 1;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease;
}
.module-toc__item--level-2 a:hover, .module-toc__level--2 a:hover {
    color: #0284c7;
    text-decoration: underline;
}
@media (max-width: 768px) {
.module-toc__list li, .module-toc__list li { margin: 12px 0; line-height: 1.7; }
}

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-toc__item--level-3, .module-toc__level-3 { margin-left: 16px; }
  .module-toc__item--level-3 a, .module-toc__level-3 a { color: #0369a1; flex: 1; text-decoration: none; font-size: 0.95em; }
  .module-toc__item--level-3 a:hover, .module-toc__level-3 a:hover { color: #0284c7; text-decoration: underline; }
/* ── 동기화 블록 끝 (sync-live) ── */

/* 🔴 2026-09-09 — 목차 행의 링크가 «글자 너비»만 차지해 오른쪽 여백이 죽어 있었다.
   그릇(li)이 가로 flex 이고 그 안에 번호(::before)와 링크가 나란히 놓이는데,
   링크에 늘어나라는 말이 없어 남은 폭이 «링크가 아닌 자리»로 남았다.
   사용자 확정 규칙 = 「목록 행은 행 전체가 링크」. 판정식 = row-fill-check.mjs */
.module-toc__list li > a { flex: 1 1 auto; min-width: 0; }


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
@media (max-width: 768px) {
  .module-toc__list li { margin: 12px 0; line-height: 1.7; }   /* modules.css:547 */
  .module-toc__list li { margin: 12px 0; line-height: 1.7; }   /* modules.css:547 */
}
.module-toc { margin: 30px 0; padding: 20px 25px; background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%); border-left: 4px solid #0284c7; border-radius: 8px; }   /* modules.css:462 */
.module-toc__title { font-size: 1.2em; font-weight: 700; color: #0c4a6e; margin-bottom: 15px; }   /* modules.css:475 */
.module-toc__title { font-size: 1.2em; font-weight: 700; color: #0c4a6e; margin-bottom: 15px; }   /* modules.css:475 */
.module-toc__list { list-style: none; padding: 0; margin: 0; counter-reset: toc-counter; }   /* modules.css:483 */
.module-toc__list { list-style: none; padding: 0; margin: 0; counter-reset: toc-counter; }   /* modules.css:483 */
.module-toc__list li { margin: 8px 0; padding-left: 0; line-height: 1.6; counter-increment: toc-counter; display: flex; align-items: baseline; }   /* modules.css:491 */
.module-toc__list li { margin: 8px 0; padding-left: 0; line-height: 1.6; counter-increment: toc-counter; display: flex; align-items: baseline; }   /* modules.css:491 */
.module-toc__list li::before { content: counter(toc-counter) ". "; color: #075985; font-weight: 500; margin-right: 8px; white-space: nowrap; flex-shrink: 0; }   /* modules.css:501 */
.module-toc__list li::before { content: counter(toc-counter) ". "; color: #075985; font-weight: 500; margin-right: 8px; white-space: nowrap; flex-shrink: 0; }   /* modules.css:501 */
.module-toc__item--level-2 a { color: #075985; flex: 1; text-decoration: none; font-weight: 500; transition: all 0.2s ease; }   /* modules.css:511 */
.module-toc__level--2 a { color: #075985; flex: 1; text-decoration: none; font-weight: 500; transition: all 0.2s ease; }   /* modules.css:511 */
.module-toc__item--level-2 a:hover { color: #0284c7; text-decoration: underline; }   /* modules.css:520 */
.module-toc__level--2 a:hover { color: #0284c7; text-decoration: underline; }   /* modules.css:520 */
.module-toc__item--level-3 { margin-left: 16px; }   /* modules.css:526 */
.module-toc__item--level-3 a { color: #0369a1; flex: 1; text-decoration: none; font-size: 0.95em; }   /* modules.css:531 */
.module-toc__item--level-3 a:hover { color: #0284c7; text-decoration: underline; }   /* modules.css:539 */

/* core/modules/display/link-card-grid/style.css */
/* link-card-grid/style.css — link-grid 의 카드(variant=card) 변형을 형제 모듈로 분리 이관.
   재료 = core/modules/display/link-grid/style.css(원본 link-grid.php variant='card' 분기의 CSS —
   link-grid/module.jsonc coverage_gap.note_variants_included_despite_structure 가 "형제 모듈 분리 시
   재사용 가능하도록" 마크업 없이 미리 옮겨 둔 규칙). 새 CSS 창작 0 — 값은 원본 그대로, 선택자
   접두만 module-link-grid → link-card-grid 로 바꿨다(§9-3).
   제외(이번 회차 범위 밖·excluded_this_round 참조) = card-cta 전용 규칙 · thumb(썸네일) 전용 규칙 ·
   box(info-box 결합) 규칙 · icon(이모지/이미지 파일명) 텍스트 아이콘 규칙 · chips 규칙.
   기저 그리드 값(display:grid·list-style:none·margin·padding)은 원래 .module-link-grid 공통 규칙과
   .module-link-grid--cards 재정의가 함께 만든 "유효 계산값"을 한 규칙으로 병합했다(캐스케이드 해소 —
   값 창작 0 · link-grid/style.css 원문 두 규칙을 그대로 합친 것). */

.link-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 140px), 1fr));
  gap: 8px;
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
}
.link-card-grid--cols-2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
.link-card-grid--cols-3 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 185px), 1fr)); }
.link-card-grid--cols-4 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 145px), 1fr)); }

.link-card-grid__item { display: flex; }

.link-card-grid__card {
  position: relative;
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 16px 12px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  text-decoration: none;
  color: #1e293b;
  transition: border-color .2s, box-shadow .2s, transform .15s;
}
.link-card-grid__card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: transparent;
  border-radius: 8px 8px 0 0;
  transition: background .2s;
}
/* 라이브 :6836-6846 .module-related__card::before */
.link-card-grid__card:hover {
  border-color: #3b82f6;
  box-shadow: 0 2px 8px rgba(59,130,246,0.1);
  transform: translateY(-2px);
  text-decoration: none;
}
.link-card-grid__card:hover::before { background: #3b82f6; }
/* 라이브 :6848-6856 .module-related__card:hover · :hover::before */
.link-card-grid__card:focus-visible {
  outline: 2px solid var(--color-primary, #1a73e8);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--color-primary-light, #e8f0fe);
}
/* 라이브 :6978-6986 .module-related__card:focus-visible */
@media (max-width: 768px) {
  .link-card-grid { grid-template-columns: repeat(2, 1fr); }
}
/* 라이브 :7014-7020 — 768px 에서 «2열」로 줄인다(정렬은 항상 가운데 그대로 — 라이브에 좌측정렬 분기 없음). */
@media (max-width: 640px) {
  .link-card-grid { grid-template-columns: 1fr; }
}
/* 라이브 :7022-7028 */
@media (max-width: 480px) {
  .link-card-grid { grid-template-columns: 1fr; }
}
/* 라이브 :7030-7038 */

.link-card-grid__card-icon { font-size: 34px; margin-bottom: 8px; line-height: 1; }
.link-card-grid__card-icon--svg {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: rgba(87, 71, 224, .10);
  color: #3B2DBF;
  flex: 0 0 auto;
}
.link-card-grid__card-icon--svg svg {
  width: 21px;
  height: 21px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.1;
  stroke-linecap: round;
  stroke-linejoin: round;
}
/* .link-card-grid__svg-fill = icon_svg 슬롯이 넘기는 <svg> 내부에서 "채움" 도형(테두리가 아니라
   면으로 그려야 하는 조각)에 붙이는 관례 클래스 — 부르는 쪽이 이 클래스명을 알고 있어야 한다
   (module.jsonc slots.items.icon_svg 참조). 원본 라이브 선택자는 .f(한 글자 — §9-2 위반)였다. */
.link-card-grid__card-icon--svg svg .link-card-grid__svg-fill,
.link-card-grid__card-icon--svg svg rect { fill: currentColor; stroke: none; }

.link-card-grid__card-title {
  display: block;
  font-size: 1rem;
  font-weight: 700;
  color: #1e293b;
  line-height: 1.3;
  margin-bottom: 6px;
  overflow-wrap: break-word;
  word-break: keep-all;
}

.link-card-grid__card-value { font-size: 19px; font-weight: 800; letter-spacing: -.025em; line-height: 1.2; margin-top: 2px; }
.link-card-grid__card-value--up { color: var(--lp-up, #16a34a); }
.link-card-grid__card-value--down { color: var(--lp-down, #dc2626); }

.link-card-grid__card-desc {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden;
  font-size: 0.9rem;
  color: #4b5563;
  margin-top: 6px;
  line-height: 1.5;
  overflow-wrap: break-word;
  word-break: keep-all;
}
.link-card-grid__card-meta { color: #64748b; font-size: 14px; font-weight: 600; line-height: 1.45; margin-top: 3px; }
.link-card-grid__card-desc, .link-card-grid__card-meta { text-align: left; align-self: stretch; }
@media (prefers-color-scheme: dark) {
  .link-card-grid__card-meta { color: #94a3b8; }
}

.link-card-grid__card-badge {
  display: inline-block;
  align-self: flex-start;
  margin-top: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  background: rgba(100, 116, 139, .15);
  color: #475569;
}
.link-card-grid__card-badge--paid { background: rgba(87, 71, 224, .14); color: #3B2DBF; }
.link-card-grid__card-badge--never { background: rgba(220, 38, 38, .14); color: #b91c1c; }

.link-card-grid--green .link-card-grid__card { background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%); border-color: #86efac; }
.link-card-grid--amber .link-card-grid__card { background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%); border-color: #fcd34d; }
.link-card-grid--rose .link-card-grid__card { background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%); border-color: #fca5a5; }
.link-card-grid--purple .link-card-grid__card { background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%); border-color: #d8b4fe; }
.link-card-grid--gray .link-card-grid__card { background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%); border-color: #cbd5e1; }

/* 🔴 2026-09-14 라이브대조 — 화살표 배지(u-row-entrance-arrow-badge) 규칙 삭제.
   라이브 module-related__card 원본 마크업에는 화살표 표식이 없다(사용자가 붙여 준 원문 대조 확정).
   index.html 에서 그 배지 마크업을 뺀 짝 — 죽은 선택자를 남기지 않는다.
   다른 모듈(kpi-card·movers-board·app-layer)의 u-row-entrance-arrow-badge 규칙은 각자 자기완결
   사본이라 이 삭제와 무관(건드리지 않음). */

/* 🔴 2026-09-14 라이브수치 = «기본값»(지휘자 정정 지시 — 변형(modifier) 신설 «취소»).
   경위: card-grid 되돌림 후속으로 한 차례 이 값들을 변형(--related)으로 격리하려 했으나,
   module.jsonc:39 amendment_20260914 이 이미 적어 둔 사실 — 「이 모듈(link-card-grid)이 곧 라이브
   related.php 의 개명 이식본이다」(module.jsonc:35 renamed_classes.reason 도 동일) — 를 놓친
   판단이었다. link-card-grid 는 «다른 스타일을 고를 수 있는 범용 모듈»이 아니라 «module-related__*
   의 새 이름»이므로, 라이브와의 수치 차이는 «변형 선택지»가 아니라 «이식 오차»이고 기본값이
   라이브와 같아야 맞다(지휘자 정정 — 변형 블록은 만든 적 없음, grep 0건으로 그대로 확인됨).
   그래서 아래 값 전부를 «기본값»에 직접 적용했다(값 발명 0 · 전부 라이브 원문 인용):
     .link-card-grid            grid-template-columns minmax 180px→200px · margin 8px 0 0→24px 0 20px
                                 (라이브 :6811-6816 .module-related__grid)
     .link-card-grid__card      ::before(신설)·:hover::before(신설)·:focus-visible(신설)
                                 (라이브 :6836-6856 · :6978-6986)
     .link-card-grid            @media 768/640/480px → 컬럼 2열/1열/1열로 교체(우리 쪽 구 규칙이던
                                 "정렬만 바꾸기"는 삭제 — 라이브엔 그 분기가 없다)
                                 (라이브 :7014-7038)
     .link-card-grid__card-icon font-size 34px→36px · margin-bottom 8px→10px
                                 (라이브 :6858-6862 .module-related__card__icon)
     .link-card-grid__card-title color #1e293b→#1e40af · margin-bottom 없음→6px · font-size 1rem→16px(동치)
                                 (라이브 :6864-6870 .module-related__card__title)
     .link-card-grid__card-desc font-size .9rem(14.4px)→15px · color #4b5563→#475569
                                 (라이브 :6871-6875 .module-related__card__desc)
   grid-template-columns 는 min(100%,Npx) 래퍼를 유지했다 — 좁은 화면 넘침 방지용 기존 안전장치이고
   숫자만 라이브 값으로 바꿨다(래퍼 자체는 라이브에 없는 우리 쪽 보강, 수치 발명이 아님).
   이 모듈은 이 저장소 안에서 25곳(14 파일)에 쓰인다 — 기본값이 바뀌면 그 자리들도 함께 바뀐다.
   그것이 범용(=개명 이식) 모듈의 뜻이고, 막을 일이 아니다(지휘자 확정) — 목록은
   docs/ledger/platform/_보고-라이브카드-기본값교정-20260914.md ④ 참조.
   이모지→그림 변환은 이 파일 범위가 아니다 — related.php:44-48(esc_html 그대로 글자 출력) +
   site-shell.php:59-67(twemoji.parse(document.body) 전역 스크립트가 사후 변환) 두 층 중 후자는
   core/presets/shell/** 소관이라 이번 회차(그 트리 수정 금지) 범위 밖. 보고서 ⑤ 참조. */

/* 🔴 2026-09-27 지휘자(사용자 「4열로 해」 · 「4열 배열 vs 현재 6열 배열」 A72) — 넓은 화면 고정 4열(열 수를 따로 고른 --cols-2·--cols-3 제외 ·
   --cols-4 도 이제 진짜 4열) · 좁은 화면은 기존 규칙(2열·1열). 되돌리기 = .bak_20260927-지휘자-4열 */
@media (min-width: 641px) {
  .link-card-grid:not(.link-card-grid--cols-2):not(.link-card-grid--cols-3) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* 🔴 2026-09-27 HY조 — 카드 «원형 화살표 링크 배지» 복구(사용자 09-27 「링크 표시 원형 화살표 적용」 · 「링크 카드라는 것을 잘 알지 못 할 것 같아」).
   위 09-14 주석(라이브 원문에 화살표 없음 → 배지 삭제)을 사용자 직접 지시로 뒤집는다 — 라이브 = 최저선이고 이 배지는 «더하기»다.
   이 모듈을 쓰는 자리 전건에 배지가 붙는다(링크 있는 카드만). 클래스 = 이 모듈 접두(u-row-entrance-arrow-badge 는 앱층 자기완결 사본이라 쓰지 않는다).
   모양·각도 = 앱층 기준 표본 그대로(app-layer/style.css:1301-1305 · 1682-1698) — 같은 페이지 앵커(href^="#")만 45도(↘) · 다른 페이지는 →.
   폴백 값 = _global.css:1570-1572. 되돌리기 = .bak_20260927-HY조 */
.link-card-grid__card-link-badge { position: absolute; top: 10px; right: 10px; display: grid; place-items: center; width: 19px; height: 19px; border-radius: 50%; background: var(--acc-s, #EEEBFE); color: var(--acc-i, #3B2DBF); font-size: 13px; font-weight: 800; line-height: 1; transition: transform .13s ease, background .13s ease, color .13s ease; }
.link-card-grid__card:hover .link-card-grid__card-link-badge, .link-card-grid__card:focus-visible .link-card-grid__card-link-badge { background: var(--acc, #5747E0); color: #fff; transform: translateX(2px); }
.link-card-grid__card[href^="#"] .link-card-grid__card-link-badge { transform: rotate(45deg); }
.link-card-grid__card[href^="#"]:hover .link-card-grid__card-link-badge, .link-card-grid__card[href^="#"]:focus-visible .link-card-grid__card-link-badge { transform: rotate(45deg) translateX(2px); }
@media (prefers-reduced-motion: reduce) {
  .link-card-grid__card-link-badge { transition: none; }
}

/* 🆕 2026-10-09 간격 보장(사용자 10-09 «글자 사이 간격») — 값·이름표 바로 아래 설명 글 위 간격 ≥ 6px(실측 0~4px 이던 자리) · PL-APP-MOD-01 · CO-05 */
.link-card-grid__card-meta { margin-top:6px; }

/* 🆕 2026-11-06 움직이는 아이콘(사용자 승인 «유형 카드 + 움직이는 아이콘») — 아이콘 칸에 data-icon-motion="bounce" 를 주면 작게 위아래로 통통 튄다(새 클래스 0 · 속성으로만 켬).
   카드 순서대로 0.2초씩 늦게 시작해 번갈아 튄다 · 기기가 «움직임 줄이기»면 정지(아이콘은 그대로 보임) */
.link-card-grid__card-icon--svg[data-icon-motion="bounce"] { animation: link-card-grid-icon-bounce 1.6s ease-in-out infinite; transform-origin: 50% 100%; }
.link-card-grid__item:nth-child(2) .link-card-grid__card-icon--svg[data-icon-motion="bounce"] { animation-delay: .2s; }
.link-card-grid__item:nth-child(3) .link-card-grid__card-icon--svg[data-icon-motion="bounce"] { animation-delay: .4s; }
.link-card-grid__item:nth-child(4) .link-card-grid__card-icon--svg[data-icon-motion="bounce"] { animation-delay: .6s; }
@keyframes link-card-grid-icon-bounce { 0%, 100% { transform: translateY(0) scale(1); } 45% { transform: translateY(-5px) scale(1.1); } }
@media (prefers-reduced-motion: reduce) { .link-card-grid__card-icon--svg[data-icon-motion] { animation: none; } }

/* core/modules/display/share-buttons/style.css */
/* share-buttons/style.css — 라이브 CSS 원문 재구성(2026-09-08 fable2) · 재료 = _sandbox/모듈최종형식-20260907/_live-all.css(주석 제거본 = tcggrail·modoocard assets/css 7파일)
   규칙 = 계열 2종에 걸린 라이브 규칙 64개(@media 안 8개) · 같은 선택자 여러 벌은 «전부 순서대로» · @media 껍데기 보존 · 페이지 문맥 조상(landing-page 계열 여섯 이름)만 떼고 규칙은 살림 · 값 창작 0
   계열 = module-share-buttons module-share-buttons
   🔴 2026-09-14 정정 — 위 "계열 2종"은 «같은 이름의 서로 다른 두 모듈»이다: 모두의카드 구 모듈(item-modules.css:9033·
   modules.css:4388 — 평범한 <button> 자식·배경 항상 파랑 var(--color-primary)·호버 rose #f43f5e)과
   시세 라이브 카드형 모듈(modules.css:6631 .module-social-share — 흰 카드·호버에서만 계열색)이 둘 다
   .module-share-buttons 로 이름이 같아져 한 파일에 합쳐졌다. 지금 마크업(index.html)은 카드형(__btn·
   __social-btn--*)인데 구 모듈의 태그 선택자 `.module-share-buttons button`이 specificity가 더 높아(0,1,1
   > __btn 의 0,1,0) URL 복사 <button>에만 얹혀 배경을 비호버에도 파랑으로 덮었다 — 시안이 아니라 충돌.
   그 배경·색 선언은 2026-09-14 제거(레이아웃 값은 그대로 — 이번 회차 범위 밖). */
.module-share-buttons button {
  /* 2026-09-14 — flex·padding·min-height·border-radius·border·font-size·font-weight·transition 제거(무력화):
     구 모듈 태그 선택자가 카드형 __btn(0,1,0)보다 specificity 높아(0,1,1) 모습을 덮던 원인.
     cursor:pointer 만 남김(태그 자체 속성 — __btn 과 값 동일·충돌 없음). 대조표 = 보고서 참조. */
  cursor:pointer;
}
@media (prefers-reduced-motion: reduce) {
}
@media (max-width: 768px) {
}
.module-share-buttons { display:flex; gap:8px; margin-top:8px; }
.module-share-buttons[hidden] { display:none !important; }
.module-share-buttons button { cursor:pointer; }
.module-share-buttons {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.module-share-buttons[hidden] { display: none !important; }
.module-share-buttons button {
  /* 2026-09-14 — 위 두 벌과 동일 사유로 무력화. cursor:pointer 만 남김. */
  cursor: pointer;
}
.module-share-buttons__calc-toggle-btn:focus-visible, .module-share-buttons__calc-btn:focus-visible, .module-share-buttons__calc-input:focus-visible, .module-share-buttons__calc-select:focus-visible, .module-share-buttons button:focus-visible, .module-share-buttons__briefing-cta:focus-visible, .module-share-buttons__briefing-links a:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
.module-share-buttons__calc-btn, .module-share-buttons__calc-toggle-btn, .module-share-buttons__briefing-cta, .module-share-buttons button {
    transition: none !important;
  }
}
.module-share-buttons {
    margin: 40px 0 0;
    padding: 20px 24px;
    background: #f9fafb;
    border-radius: 12px;
    border: 1px solid transparent; /* HAR조 2026-09-27 테두리 한 겹 — 겉틀 선 0(버튼 테두리만) · 구획 = 바탕 #f9fafb · 원래 #e5e7eb */
}
.module-share-buttons__title {
    font-size: 16px;
    font-weight: 700;
    margin: 0 0 12px;
    color: #111827;
}
.module-share-buttons__buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.module-share-buttons__btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    color: #374151;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
}
.module-share-buttons__btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
}
.module-share-buttons__btn--twitter:hover { background: #000000; color: #ffffff; border-color: #000000; }
.module-share-buttons__btn--facebook:hover { background: #1877f2; color: #ffffff; border-color: #1877f2; }
.module-share-buttons__btn--linkedin:hover { background: #0a66c2; color: #ffffff; border-color: #0a66c2; }
.module-share-buttons__btn--kakao:hover { background: #fee500; color: #3c1e1e; border-color: #fee500; }
.module-share-buttons__btn--reddit:hover { background: #ff4500; color: #ffffff; border-color: #ff4500; }
.module-share-buttons__btn--copy:hover { background: #1e40af; color: #ffffff; border-color: #1e40af; }
.module-share-buttons__btn--pinterest:hover { background: #e60023; color: #ffffff; border-color: #e60023; }
.module-share-buttons__btn--threads:hover { background: #000000; color: #ffffff; border-color: #000000; }
.module-share-buttons__btn--whatsapp:hover { background: #25d366; color: #ffffff; border-color: #25d366; }
.module-share-buttons__btn--telegram:hover { background: #229ed9; color: #ffffff; border-color: #229ed9; }
.module-share-buttons__btn--tumblr:hover { background: #001935; color: #ffffff; border-color: #001935; }
.module-share-buttons__btn--line:hover { background: #06c755; color: #ffffff; border-color: #06c755; }
.module-share-buttons__btn > span[aria-hidden] {
    font-weight: 700;
    font-size: 14px;
}
@media (max-width: 768px) {
.module-share-buttons { padding: 16px; margin: 32px 0 0; }
.module-share-buttons__label { display: none; }
.module-share-buttons__btn { padding: 10px 12px; }
}

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* ── 동기화 블록 끝 (sync-live) ── */

/* 🔴 2026-09-11 복원 — 이름 정리 과정에서 빠진 규칙. 출처 = _assets/modules/share-buttons/12fd25e0/style.css
   본문 그대로 옮김(값 창작 0). 제목이 버튼과 같은 줄에 오던 것과, 마지막 버튼이 남은 폭을 채우던 것이 이 둘로 잡힌다. */
.module-share-buttons__title { font-size: 16px; font-weight: 700; margin: 0 0 12px; color: #111827; }
.module-share-buttons__buttons { display: flex; flex-wrap: wrap; gap: 8px; }

/* 🔴 2026-09-11 — 뿌리가 display:flex 라 제목(__title)과 버튼묶음(__buttons)이 «한 줄»에 놓였다.
   마크업이 h3 + div 두 자식이므로 세로로 쌓아야 한다. 값은 기존 gap·padding 유지. */
.module-share-buttons { display: block; }

/* 🔴 2026-09-11 창D — 사용자 지적 ① 「URL 복사」 버튼이 남은 폭을 다 차지한다.
   원인 = 레거시 규칙 `.module-share-buttons button { flex:1 }` 이 __buttons 안의 <button> 에도 걸린다.
     그 규칙은 «버튼이 뿌리의 직계였던» 옛 마크업용이다(계산기 계열 2버튼). 지금 마크업은
     h3 + div.__buttons 이고 버튼마다 __btn 이 붙는다. <a> 는 button 이 아니라 안 걸려서
     «복사 버튼만» 늘어난다 — 사용자가 본 그대로다.
   🔴 값을 창작하지 않는다 = flex 의 «초기값»으로 되돌릴 뿐이다.
     근거 = 라이브 계보 _assets/modules/share-buttons/35ae7041/style.css 의 .module-social-share__btn
            (display:inline-flex + padding 으로 «글자 너비»가 되고 flex 속성이 아예 없다). */
.module-share-buttons__buttons button { flex: 0 1 auto; }

/* 🔴 2026-09-23 — «구 모듈 규칙 재유입» 제거.
   09-22 자동 이식(pull-live-module-css)이 라이브 modules.css:3610~4049 의 `.module-share-buttons` 를
   떠 왔는데, 그것은 «우리 모듈의 라이브 원본»이 아니라 «이름만 같은 다른 모듈»(모두의카드 구 계열 —
   뿌리가 flex · <button> 직계 · 배경 항상 파랑)이다. 우리 모듈의 라이브 원본은 `.module-social-share` 다
   (개명사전 _이식-모듈개명사전.json).
   그래서 2026-09-14 에 «이유를 적고 무력화했던» 선언 둘이 그대로 되살아났고 증상도 그대로 돌아왔다 —
   ① `flex: 1` → 「URL 복사」 단추가 남은 폭을 차지 ② `background: var(--color-primary)` → 미호버에도 파랑.
   같은 사유로 09-23 에 내가 손으로 넣은 `.module-share-buttons button:hover` 도 뺀다(그 역시 구 모듈 것).
   🔴 재발 방지 = pull-live-module-css.mjs 가 «개명한 이름»으로 대조하도록 고쳤다(라이브 이름으로 비교하면
      우리에 이미 있는 규칙도 「없다」고 보고 두 벌을 만든다 — 실측 `.module-share-buttons button` 10벌). */

/* core/modules/display/table/style.css */
/* table/style.css — 라이브 CSS 원문 재구성(2026-09-08 fable2) · 재료 = _sandbox/모듈최종형식-20260907/_live-all.css(주석 제거본 = tcggrail·modoocard assets/css 7파일)
   규칙 = 계열 6종에 걸린 라이브 규칙 663개(@media 안 20개) · 같은 선택자 여러 벌은 «전부 순서대로» · @media 껍데기 보존 · 페이지 문맥 조상(landing-page 계열 여섯 이름)만 떼고 규칙은 살림 · 값 창작 0
   계열 = module-table module-table-wrap module-comparison module-table-caption module-table__print-variant-availability-list module-table__print-variant-shine-map-grid */
.module-table__scroll-hint { text-align: center; font-size: 16px !important; font-weight: 700; color: #2563eb !important; line-height: 1.4 !important; padding: 2px 0; margin: -10px 0 32px 0 !important; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important; display: none !important; }




.module-table__table-caption { caption-side:top; text-align:left; font-size: 16px; font-weight: 700; color: #1e293b; background:#f8fafc; padding:10px 14px; border-left:4px solid var(--color-primary,#3b82f6); margin-bottom:0; border-radius:4px 4px 0 0; margin: 24px 0 8px 0; }
.module-table td:first-child { border-left:0; text-align: left; }

@media (max-width:760px) {
}
.module-table td, .module-table th { font-variant-numeric: tabular-nums; font-size: inherit; /* 🔴 2026-09-23 color 제거 — 파일 끝 라이브 정본 블록과 중복(게이트 지시: 정본 쪽 값으로 맞춘다) */ }

.module-table caption, .module-table__caption { caption-side: top; text-align: left; border-left:0; font-size: 16px; font-weight: 700; color: #0f172a; background: #f8fafc; padding: 10px 14px; margin-bottom: 10px; border-radius: 4px; }
.module-table--full { width: 100%; margin-top: 32px; }
.module-table--salary thead {
  background:transparent; color:inherit; border-bottom:0;
}
.module-table--salary tbody tr:nth-child(even) {
  background:transparent;
}



.module-table td, .module-table th {
  font-size: inherit; font-variant-numeric: tabular-nums; /* 🔴 2026-09-23 color 제거 — 파일 끝 라이브 정본 블록과 중복(게이트 지시: 정본 쪽 값으로 맞춘다) */ }
.module-table a.module-table__btn:focus-visible {
  outline:2px solid var(--color-primary); outline-offset:2px; background:var(--color-primary-bg,#eff6ff); border-color:var(--color-primary); text-decoration:none;
}
@media (max-width: 640px) {
}

@media print {
}
.module-table__table-caption {
  font-size:15px; font-weight:700; color:#0f172a; margin: 24px 0 8px 0; caption-side:top; text-align:left; background:#f8fafc; padding:10px 14px; border-left:4px solid var(--color-primary,#3b82f6); margin-bottom:0; border-radius:4px 4px 0 0;
}
.module-table {
  display: table !important; width:100% !important; table-layout:auto; margin:16px 0 8px; border-collapse:collapse !important; border-spacing:0 !important; font-size:15px; min-width:540px; border:1px solid rgba(0,0,0,.1) !important; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin; scrollbar-color:#94a3b8 #f1f5f9;
}


@media (max-width: 640px) {
}

@media (max-width: 640px) {

}
.module-table__ico-cell { display: inline-flex; align-items: center; justify-content: flex-start; gap: 6px; }


@media (max-width:640px) {
}
.module-table a.module-table__inline-purchase-button:link, .module-table a.module-table__inline-purchase-button:visited, a.module-table__inline-purchase-button:link, a.module-table__inline-purchase-button:visited {
  color: var(--ink);
  text-decoration: none;
}
.module-table a.module-table__inline-purchase-button--best:link, .module-table a.module-table__inline-purchase-button--best:visited, a.module-table__inline-purchase-button--best:link, a.module-table__inline-purchase-button--best:visited {
  color: #fff;
}
.module-table a.module-table__inline-purchase-button:not(.module-table__link):hover, .module-table a.module-table__inline-purchase-button:not(.module-table__link):focus-visible, .module-table a.module-table__inline-purchase-button:not(.module-table__link):active, a.module-table__inline-purchase-button:hover, a.module-table__inline-purchase-button:focus-visible, a.module-table__inline-purchase-button:active {
  background: var(--acc);
  border-color: var(--acc);
  color: #fff;
  text-decoration: none;
}
.module-table__scroll-hint {
  text-align: center;
  font-size: 15px;
  font-weight: 700;
  color: var(--acc-i);
  line-height: 1.4;
  padding: 2px 0;
  margin: 6px 0 0;
}
.module-table__scroll-hint--top {
  margin: 0 0 7px;
}
.module-table__scroll-hint {
  margin: 7px 0 16px;
}
.module-table__scroll-hint--top {
  margin: 0 0 8px;
}

.module-table__note, .module-table__card-grid-page, .module-popup__thumb-effect-layer, .module-table__sibling-axis-link-grid {
  margin-bottom: 14px;
}
body.module-table__spoke-page .module-table td:first-child, body.module-table__spoke-page .module-table__table td:first-child { font-weight: 700 }
.module-table__scroll-wrap.module-table__bordered-wrapper { margin:0; }
/* 🔴 2026-09-13 — 감싸개의 `border` 를 뺐다(사용자: 「캡션이 테이블 테두리 «안»에 있어서는 안 돼.
   그냥 독립되도록」). 브라우저 조상 사슬 실측으로 갈렸다:
     개발본  DIV.module-table__scroll-wrap  🔴 테두리=1px solid · 라운드=8px
     라이브  DIV.module-table__scroll-wrap       테두리 «없음»   · 라운드=8px
   라이브 modules.css 원문 = `.module-table__scroll-wrap { overflow-x:auto; width:100% }` — border 0건.
   🔴 감싸개에 테두리가 있으면 그 «안»에 표와 <caption> 이 함께 갇혀 캡션이 독립돼 보이지 않는다.
      표(.module-table)는 자기 테두리를 그대로 갖는다 — 뺀 것은 «감싸개»의 테두리뿐이다.
   값 창작 0 — 라이브에 없는 선언을 되돌리는 것이다. border-radius 는 라이브에도 있어 남긴다. */
.module-table__scroll-wrap { overflow-x:auto; max-width:100%; -webkit-overflow-scrolling:touch; margin:16px 0 8px; border-radius:8px; scrollbar-width:thin; scrollbar-color:#94a3b8 #f1f5f9; }
.module-table--salary { width:100%; border-collapse:collapse; font-size:16px; margin:16px 0 8px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin; scrollbar-color:#94a3b8 #f1f5f9; }
.module-table--salary thead { background:#e2e8f0; color:#1e293b; border-bottom:2px solid #94a3b8; }
.module-table--salary th { padding:12px 10px; font-weight:700; text-align:center; color:#1e293b; }
.module-table--salary td { padding:11px 10px; text-align:right; border-bottom:1px solid var(--color-border-light); color:var(--color-text-body); }
.module-table--salary td:first-child:has(a) { text-align:center; }
.module-table--salary tbody tr:nth-child(even) { background:var(--color-bg-subtle); }
.module-table--salary tbody tr:hover { background:#f1f5f9; }
.module-table--salary .module-table__col-highlight { font-weight:700; color:#0f172a; }
.module-table--salary thead .module-table__col-highlight { color:#92400e; background:#fef3c7 !important; }
.module-table--salary tr.module-table__row-highlight { background:#f3f4f6; }
.module-table tr.module-table__row-highlight { background:#f3f4f6; }
.module-table--salary tr.module-table__row-highlight td { font-weight:600; background:#f3f4f6 !important; }
.module-table tr.module-table__row-highlight td { font-weight:600; background:#f9fafb; }
.module-table--salary tr.module-table__row-highlight--current { background:#eff6ff !important; }
.module-table tr.module-table__row-highlight--current { background:#eff6ff !important; }
.module-table--salary tr.module-table__row-highlight--current td { font-weight:600; background:#eff6ff !important; }
.module-table tr.module-table__row-highlight--current td { font-weight:600; background:#eff6ff !important; }
.module-table tr.module-table__row-highlight--green { background:#ecfccb !important; font-weight:600; }
.module-table tr.module-table__row-highlight--green td { background:#ecfccb !important; font-weight:600; }
.module-table tr.module-table__row-highlight--yellow { background:#fef3c7 !important; font-weight:600; }
.module-table tr.module-table__row-highlight--yellow td { background:#fef3c7 !important; font-weight:600; }
.module-table tr.module-table__row-highlight--red { background:#fee2e2 !important; font-weight:600; }
.module-table tr.module-table__row-highlight--red td { background:#fee2e2 !important; font-weight:600; }
.module-table tr.module-table__row-highlight--green-soft { background:#f0fdf4 !important; }
.module-table tr.module-table__row-highlight--green-soft td { background:#f0fdf4 !important; }
.module-table tr.module-table__row-highlight--red-soft { background:#fef2f2 !important; }
.module-table tr.module-table__row-highlight--red-soft td { background:#fef2f2 !important; }

.module-table tr.module-table__row-inactive td { opacity:0.4; }

.module-table td:has(a.module-table__hub-matrix-link) { text-align:center !important; }
.module-table th:has(a.module-table__hub-matrix-link) { text-align:center !important; }

.module-table--salary tr.module-table__subtotal td { background:var(--color-bg-subtle); font-weight:600; border-bottom:1px solid var(--color-border); }
.module-table--salary tr.module-table__total-2 td { background:var(--color-primary-light); font-weight:700; color:var(--color-primary-dark); }
.module-table--salary tbody tr:last-child td { border-bottom:2px solid var(--color-border) !important; }
.module-table { width:100% !important; border-collapse:collapse !important; border-spacing:0 !important; table-layout:auto; font-size:15px; min-width:540px; margin:16px 0 8px; border:1px solid rgba(0,0,0,.1) !important; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin; scrollbar-color:#94a3b8 #f1f5f9; }
/* 🔴 2026-09-23 — `border-bottom:0` 제거(라이브 `.module-table thead { border-bottom:2px solid #94a3b8 }` 와 다툼). */
.module-table thead { background:transparent; color:inherit; }
.module-table__table-caption { caption-side:top; text-align:left; font-size:15px; font-weight:700; color:#0f172a; background:#f8fafc; padding:10px 14px; border-left:4px solid var(--color-primary,#3b82f6); margin-bottom:0; border-radius:4px 4px 0 0; }
/* 🔴 2026-09-13 — 위 :434 와 같은 사유로 라이브 값에 맞췄다(사용자 제공 원문). 창작 0. */
.module-table caption { caption-side:top; text-align:left; font-size:16px; font-weight:700; color:#0f172a; background:#f8fafc; padding:10px 14px; border-left:0; margin-bottom:10px; border-radius:4px; }
.module-table:has(caption) { margin-top:24px; }
/* 🔴 2026-09-23 — 칸 테두리 선언 제거(라이브는 th 의 위·좌·우 테두리를 0 !important 로 끈다). */
.module-table th { padding:9px 14px; text-align:center; font-size:13px; letter-spacing:.05em; text-transform:uppercase; color:var(--mut); font-weight:700; }
.module-table th:first-child { border-left:0; }
/* 🔴 2026-09-23 제거 — 위에서 칸 테두리를 안 그리므로 그것을 지우는 규칙도 필요 없다. */
/* 🔴 2026-09-23 — 칸 테두리 선언 제거. 라이브는 `td { border-bottom:1px solid #e5e7eb !important; 나머지 0 !important }` 로 «가로선 하나»만 그린다. */
.module-table td { padding:9px 14px; text-align:left; font-size:15px; color:inherit; }
.module-table td:not(.module-table__cell--center):not(.module-table__cell--note):not(:first-child) { text-align:right; }
.module-table td:first-child { border-left:0; }
/* 🔴 2026-09-23 제거 — 같은 사유. */
.module-table td:first-child { text-align:left; }
.module-table td:first-child:has(a:not(.module-table__link)) { text-align:left; }

.module-table a:not(.module-table__link) { text-decoration:none; color:var(--color-primary); }
.module-table a:not(.module-table__link):hover { text-decoration:none; color:var(--color-primary-dark); }
.module-table a.module-table__btn { display:inline-block; padding:6px 10px; border:1px solid var(--color-border,#cbd5e1); border-radius:6px; background:var(--color-bg-subtle,#f8fafc); color:var(--color-primary); font-weight:600; text-decoration:none; transition:background 0.15s ease,border-color 0.15s ease; min-height:36px; line-height:1.4; }
.module-table a.module-table__btn:hover { background:var(--color-primary-bg,#eff6ff); border-color:var(--color-primary); text-decoration:none; outline:none; }
.module-table a.module-table__btn:focus-visible { background:var(--color-primary-bg,#eff6ff); border-color:var(--color-primary); text-decoration:none; outline:2px solid var(--color-primary); outline-offset:2px; }
.module-table td:has(>a.module-table__btn) { text-align:center; }
.module-table td:has(>strong>a.module-table__btn) { text-align:center; }
.module-table td:first-child:has(a.module-table__btn) { text-align:center; }
.module-table tbody tr:nth-child(even) { background:transparent; }
.module-table tbody tr:nth-child(even) td { background:transparent; }
.module-table tbody tr:hover { background:var(--surf); }
.module-table tr:hover td { background:var(--surf); }
.module-table .module-table__col-highlight { font-weight:700; color:#0f172a; }
.module-table thead .module-table__col-highlight { color:#92400e; background:#fef3c7 !important; }
.module-table tr.module-table__subtotal td { background:var(--color-bg-subtle); font-weight:600; border-bottom:1px solid var(--color-border); }
.module-table tr.module-table__row-subtotal td { background:var(--color-bg-subtle); font-weight:600; border-bottom:1px solid var(--color-border); }
.module-table tr.module-table__total-2 td { background:var(--color-primary-light); font-weight:700; color:var(--color-primary-dark); }
.module-table tbody tr:last-child td { /* 🔴 2026-09-23 border-bottom 제거 — 파일 끝 라이브 정본 블록과 중복(게이트 지시: 정본 쪽 값으로 맞춘다) */ }
.module-table--salary.module-table__center-first td:first-child { text-align:center; }
.module-table.module-table__center-first td:first-child { text-align:center; }
.module-table--credit-map { background:#ecfdf5; border-left:4px solid #10b981; padding:14px 18px; margin:14px 0; border-radius:0 6px 6px 0; font-size:13.5px; line-height:1.7; }
.module-table__scroll-wrap>table { margin:0; }
.module-table__scroll-hint { text-align:center; font-size:15px; font-weight:700; color:var(--acc-i); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif !important; line-height:1.4; padding:2px 0; margin:7px 0 16px; }
.module-table__scroll-hint--top { margin:0 0 8px; }
.module-table__scroll-wrap+.module-table__scroll-hint:not(.module-table__scroll-hint--top) { margin-top:14px !important; }
.module-table__table-wrap+.module-table__scroll-hint:not(.module-table__scroll-hint--top) { margin-top:14px !important; }
.module-table__scroll-hint--top+.module-table__scroll-wrap { margin-top:2px !important; }
.module-table__scroll-hint--top+.module-table__table-wrap { margin-top:2px !important; }
.module-table__scroll-hint:last-child { margin-bottom:0 !important; }
:is(.module-table__content-section-block)>.module-table__scroll-hint:nth-child(n+2) { margin-top:7px; }
.module-table__print-variant-shine-map-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }
.module-table__print-variant-shine-map-grid>* { min-width:0; }
.module-table__print-variant-shine-map-grid-content { padding:13px 15px; background:var(--surf); border:1px solid var(--line2); border-radius:var(--r-s); }
.module-table__print-variant-shine-map-grid-key { margin:0 0 9px; font-size:13px; font-weight:800; letter-spacing:.04em; color:var(--mut); }
.module-table__print-variant-shine-map-grid-subtitle { margin:10px 0 0; font-size:15px; color:var(--ink2); line-height:1.65; }
.module-table__print-variant-shine-map-grid-subtitle b { color:var(--ink); font-weight:800; }
.module-table__print-variant-availability-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:6px; }
.module-table__print-variant-availability-list-image { display:flex; align-items:center; gap:9px; font-size:14px; font-weight:800; color:var(--mut); }
.module-table__print-variant-availability-list-image--active { color:var(--ink); }
.module-table__print-variant-availability-list-image em { margin-left:auto; font-style:normal; font-size:13px; font-weight:600; color:var(--mut); white-space:nowrap; overflow:visible; text-overflow:clip; }
.module-table__print-variant-availability-list-swatch { flex:0 0 auto; width:17px; height:17px; border-radius:5px; border:1.5px solid var(--line2); background:repeating-linear-gradient(135deg,transparent 0 3px,var(--line2)3px 5px); }
.module-table__print-variant-availability-list-image--active .module-table__print-variant-availability-list-swatch { background:var(--acc); border-color:var(--acc); }
@media (max-width:760px) {
.module-table__print-variant-shine-map-grid { grid-template-columns:1fr; }
}
.module-table td.module-table__spec-list-number-cell { text-align:right; font-variant-numeric:tabular-nums; font-weight:700; white-space:nowrap; }
.module-table th.module-table__spec-list-number-cell { text-align:right; font-variant-numeric:tabular-nums; font-weight:700; white-space:nowrap; }
.module-table td.module-table__wrap-column { white-space:normal; }
.module-table th.module-table__wrap-column { white-space:normal; }
.module-table td, .module-table th { font-variant-numeric: tabular-nums; }
.module-table, .module-table__table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;

    border: 0 !important;
    table-layout: auto;

    font-size: 17px;
    margin: 16px 0 8px;
}

.module-table td.module-table__cell--center, .module-table__table td.module-table__cell--center {
    text-align: center !important;
}
.module-table td.module-table__cell--note, .module-table__table td.module-table__cell--note {
    text-align: left !important;
}
.module-table thead, .module-table__head {
    background: #e2e8f0;
    color: #1e293b;
    border-bottom: 2px solid #94a3b8;
}
.module-table caption, .module-table__caption {
    caption-side: top;
    text-align: left;
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
    background: #f8fafc;
    padding: 10px 14px;

    margin-bottom: 10px;
    border-radius: 4px;
}
.module-table__caption { margin-top: 24px; }
.module-table th, .module-table__table th {
    padding: 12px 10px;
    font-weight: 700;
    text-align: center;

    border-top: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important; /* 🔴 2026-09-23 color 제거 — 파일 끝 라이브 정본 블록과 중복(게이트 지시: 정본 쪽 값으로 맞춘다) */ }
.module-table td, .module-table__table td, .module-table__cell {
    padding: 11px 10px;
    text-align: right;
    border-bottom: 1px solid #e5e7eb !important;
    color: #374151;

    border-top: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
}
.module-table tbody tr:nth-child(even) td { background: #f8fafc; }
.module-table tr:hover td { background: #f1f5f9; }
.module-table a { text-decoration: none; color: #3b82f6; }
.module-table a:hover { text-decoration: none; color: #1d4ed8; }
.module-table__note, .module-table__notes {
    text-align: left;
    font-size: 1rem;
    color: #94a3b8;
    margin-top: 6px;
}
.module-table__note-ic { margin-right: 3px; }
.module-table__note--warn {
    display: inline-block;
    padding: 3px 9px;
    border-radius: var(--r-s);
    background: var(--warn-s);
    color: var(--warn);
    font-weight: 600;
    border: 1px solid color-mix(in srgb, var(--warn) 30%, transparent);
}
.module-table__row--highlight td { background: #fef3c7; font-weight: 600; }
.module-table__row--group td {
    background: #f1f5f9;
    font-weight: 700;
    color: #1e293b;
    border-top: 2px solid #94a3b8;
}
.module-table__wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 16px 0;
    border-radius: 8px;
}
.module-table--compact td, .module-table--compact th { padding: 6px 8px; }
.module-table--full { width: 100%; }
.module-table--reference {
    margin: 24px 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    border-radius: 8px;
}
.module-table--reference table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
.module-table--reference th {
    padding: 10px;
    background: #e2e8f0;
    color: #1e293b;
    font-weight: 700;
    text-align: center;
    border-bottom: 2px solid #94a3b8;
}
.module-table--reference td {
    padding: 8px 10px;
    text-align: right;
    border-bottom: 1px solid #e5e7eb;
    color: #374151;
}
.module-table--reference td:first-child {
    text-align: left;
}
.module-table__row--here { background: #eff6ff; font-weight: 700; }
.module-table__row--best td { font-weight: 700; }
.module-table__table-scroll-wrap, .module-table__scroll-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 16px 0;
    border-radius: 8px;
}
.module-table--salary {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
  margin: 16px 0 8px;
}
.module-table--salary thead {
  background: #e2e8f0;
  color: #1e293b;
  border-bottom: 2px solid #94a3b8;
}
.module-table--salary th {
  padding: 12px 10px;
  font-weight: 700;
  text-align: center;
  color: #1e293b;
}
.module-table--salary td {
  padding: 11px 10px;
  text-align: right;
  border-bottom: 1px solid var(--color-border-light);
  color: var(--color-text-body);
}
.module-table--salary td:first-child:has(a) {
  text-align: center;
}
.module-table--salary tbody tr:nth-child(even) {
  background: var(--color-bg-subtle);
}
.module-table--salary tbody tr:hover {
  background: #f1f5f9;
}
.module-table--salary .module-table__col-highlight {
  font-weight: 700;
  color: #0f172a;
}
.module-table--salary thead .module-table__col-highlight {
  color: #92400e;
  background: #fef3c7 !important;
}
.module-table--salary tr.module-table__row-highlight, .module-table tr.module-table__row-highlight {
  background: #f3f4f6;
}
.module-table--salary tr.module-table__row-highlight td, .module-table tr.module-table__row-highlight td {
  font-weight: 600;
  background: #f3f4f6 !important;
}
.module-table--salary tr.module-table__row-highlight--current, .module-table tr.module-table__row-highlight--current {
  background: #eff6ff !important;
}
.module-table--salary tr.module-table__row-highlight--current td, .module-table tr.module-table__row-highlight--current td {
  font-weight: 600;
  background: #eff6ff !important;
}
.module-table tr.module-table__row-highlight--green, .module-table tr.module-table__row-highlight--green td {
  background: #ecfccb !important;
  font-weight: 600;
}
.module-table tr.module-table__row-highlight--yellow, .module-table tr.module-table__row-highlight--yellow td {
  background: #fef3c7 !important;
  font-weight: 600;
}
.module-table tr.module-table__row-highlight--red, .module-table tr.module-table__row-highlight--red td {
  background: #fee2e2 !important;
  font-weight: 600;
}
.module-table tr.module-table__row-highlight--green-soft, .module-table tr.module-table__row-highlight--green-soft td {
  background: #f0fdf4 !important;
}
.module-table tr.module-table__row-highlight--red-soft, .module-table tr.module-table__row-highlight--red-soft td {
  background: #fef2f2 !important;
}
.module-table tr.module-table__row-inactive, .module-table tr.module-table__row-inactive td {
  opacity: 0.4;
}

body .module-table th.module-table__td-center, body .module-table td.module-table__td-center, .module-table tbody td.module-table__td-center, .module-table thead th.module-table__td-center, .module-table th.module-table__td-center, .module-table td.module-table__td-center, .module-table td:has(a.module-table__hub-matrix-link), .module-table th:has(a.module-table__hub-matrix-link) {
  text-align: center !important;
}

.module-table--salary tr.module-table__subtotal td {
  background: var(--color-bg-subtle);
  font-weight: 600;
  border-bottom: 1px solid var(--color-border);
}
.module-table--salary tr.module-table__total-2 td {
  background: var(--color-primary-light);
  font-weight: 700;
  color: var(--color-primary-dark);
}
.module-table--salary tbody tr:last-child td {
  border-bottom: 2px solid var(--color-border) !important;
}
.module-table, table, .module-table__section-body table {
  width: 100% !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: auto;
  font-size: 16px;
  margin: 16px 0 8px;

  border-top: 1px solid #dbeafe !important;
  border-bottom: 1px solid #dbeafe !important;
  border-left: none !important;
  border-right: none !important;
}
.module-table thead {
  background: #e2e8f0;
  color: #1e293b;
  border-bottom: 2px solid #94a3b8;
}
/* 🔴 2026-09-13 — 라이브 스타일로 맞췄다(사용자 제공 원문 · 「이 스타일로 해」).
   이 블록은 «뒤에 오는 벌»이라 앞의 :16·:219(이미 라이브와 같은 값)를 덮고 있었다.
   증상: 「캡션이 아래 테이블과 바로 붙어 있다」 — margin-bottom:0 이 원인.
   라이브 원문:
     .module-table caption, .module-table__caption {
       caption-side:top; text-align:left; font-size:16px; font-weight:700;
       color:#0f172a; background:#f8fafc; padding:10px 14px;
       margin-bottom:10px; border-radius:4px; }
     .module-table__caption { margin-top:24px; }
   🔴 바뀐 것 넷 — font-size 15→16 · margin-bottom 0→10px · border-radius 4px4px0 0→4px(사방)
      · border-left 4px 파란 줄 «제거»(라이브에 없다). 값 창작 0.
   ⚠️ 라이브는 캡션을 표 «밖»의 <div class="module-table__caption"> 으로 낸다.
      우리는 표 «안»의 <caption> 이라 margin 이 border-collapse 와 만나 덜 먹을 수 있다 —
      배포 뒤 브라우저 계산값으로 실측해 10px 이 실제로 벌어지는지 확인한다(산문 판정 금지). */
.module-table__table-caption, .module-table caption {
  caption-side: top;
  text-align: left;
  font-size: 16px;
  font-weight: 700;
  color: #0f172a;
  background: #f8fafc;
  padding: 10px 14px;
  border-left: 0;
  margin-bottom: 10px;
  border-radius: 4px;
}
.module-table:has(caption) {
  margin-top: 24px;
}
.module-table th, table th, .module-table__section-body table th {
  padding: 12px 10px;
  font-weight: 700;
  text-align: center;
  border-right: 1px solid #cbd5e1 !important; /* 🔴 2026-09-23 color 제거 — 파일 끝 라이브 정본 블록과 중복(게이트 지시: 정본 쪽 값으로 맞춘다) */ }
/* 11-08 사용자 «테이블 오른쪽 세로 열려있는 건 이전에도 있었어. 원천 개선해. 재발 방지» — 범위 없는 «table th/td:last-child» 를 뺌(기계 이식 때 범위가 떨어져 사이트의 모든 표 마지막 칸 오른쪽 선을 지웠음) · 범용 표(.module-table) 꼴은 그대로 · 관문 = 범위 없는 표 선택자 늘어남 0 */
.module-table th:last-child, .module-table__section-body table th:last-child {
  border-right: none !important;
}
.module-table td, table td, .module-table__section-body table td {
  padding: 11px 10px;
  text-align: right;
  border-bottom: 1px solid var(--color-border-light);
  color: var(--color-text-body);
  border-right: 1px solid #dbeafe !important;
}
.module-table td:last-child, .module-table__section-body table td:last-child {
  border-right: none !important;
}
.module-table td:first-child {
  text-align: left;
}
.module-table td:first-child:has(a:not(.module-table__link)) {
  text-align: left;
}
.module-table td:first-child:has(a.module-table__inline-purchase-button) {
  text-align: center;
}

.module-table td, .module-table th {
  font-size: inherit; /* 🔴 2026-09-23 color 제거 — 파일 끝 라이브 정본 블록과 중복(게이트 지시: 정본 쪽 값으로 맞춘다) */ }
.module-table a:not(.module-table__link) {
  text-decoration: none;
  color: var(--color-primary);
}
.module-table a:not(.module-table__link):hover {
  text-decoration: none;
  color: var(--color-primary-dark);
}
.module-table a.module-table__btn {
  display: inline-block;
  padding: 6px 10px;
  border: 1px solid var(--color-border, #cbd5e1);
  border-radius: 6px;
  background: var(--color-bg-subtle, #f8fafc);
  color: var(--color-primary);
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease;
  min-height: 36px;
  line-height: 1.4;
}
.module-table a.module-table__btn:hover, .module-table a.module-table__btn:focus-visible {
  background: var(--color-primary-bg, #eff6ff);
  border-color: var(--color-primary);
  text-decoration: none;
  outline: none;
}
.module-table a.module-table__btn:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}
.module-table td:has(> a.module-table__btn), .module-table td:has(> strong > a.module-table__btn), .module-table td:first-child:has(a.module-table__btn) {
  text-align: center;
}
.module-table tbody tr:nth-child(even) {
  background: var(--color-bg-subtle);
}
.module-table tbody tr:hover {
  background: #f1f5f9;
}
.module-table .module-table__col-highlight {
  font-weight: 700;
  color: #0f172a;
}
.module-table thead .module-table__col-highlight {
  color: #92400e;
  background: #fef3c7 !important;
}
.module-table tr.module-table__row-highlight td {
  background: #f9fafb;
  font-weight: 600;
}
.module-table tr.module-table__subtotal td, .module-table tr.module-table__row-subtotal td {
  background: var(--color-bg-subtle);
  font-weight: 600;
  border-bottom: 1px solid var(--color-border);
}
.module-table tr.module-table__total-2 td {
  background: var(--color-primary-light);
  font-weight: 700;
  color: var(--color-primary-dark);
}
.module-table tbody tr:last-child td { /* 🔴 2026-09-23 border-bottom 제거 — 파일 끝 라이브 정본 블록과 중복(게이트 지시: 정본 쪽 값으로 맞춘다) */ }
.module-table--salary.module-table__center-first td:first-child, .module-table.module-table__center-first td:first-child {
  text-align: center;
}
.module-table--credit-map {
  background: #ecfdf5;
  border-left: 4px solid #10b981;
  padding: 14px 18px;
  margin: 14px 0;
  border-radius: 0 6px 6px 0;
  font-size: 13.5px;
  line-height: 1.7;
}
.module-table__scroll-wrap, .module-table__calc-detail, .module-table--salary, .module-table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #94a3b8 #f1f5f9;
}
.module-table__scroll-wrap {
  margin: 16px 0 8px;
}
.module-table__scroll-wrap > table {
  margin: 0;
}
.module-table__scroll-hint {
  display: none !important;
  text-align: center;
  font-size: 16px !important;
  font-weight: 700;
  color: #2563eb !important;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  line-height: 1.4 !important;
  padding: 2px 0;
  margin: -10px 0 32px 0 !important;
}
.module-table__scroll-hint--top {
  margin: 0 0 10px 0 !important;
}
.module-table__scroll-wrap + .module-table__scroll-hint:not(.module-table__scroll-hint--top), .module-table__table-wrap + .module-table__scroll-hint:not(.module-table__scroll-hint--top) {
  margin-top: 14px !important;
}
.module-table__scroll-hint--top + .module-table__scroll-wrap, .module-table__scroll-hint--top + .module-table__table-wrap {
  margin-top: 2px !important;
}
.module-table__scroll-hint:last-child {
  margin-bottom: 0 !important;
}
.module-table__scroll-hint.is-table-scroll-hint-active {
  display: block !important;
}
.module-table__calc-detail table, .module-table__calc-detail td, .module-table__calc-detail th, .module-table--salary, .module-table--salary td, .module-table--salary th, .module-table__calc-detail td, .module-table--salary td, .module-table__calc-detail th, .module-table__calc-detail td, .module-table__scroll-wrap th, .module-table__scroll-wrap td, .module-table--salary th, .module-table--salary td, .module-table th, .module-table td {
  white-space: nowrap !important;
}
table, .module-table__scroll-wrap table, .module-table__table-wrap table {
  width: auto !important;
  min-width: 100% !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: auto !important;
  display: table !important;
}
.module-table__scroll-wrap { overflow-x: auto; width: 100%; }
.module-table tr.module-table__tr-current td, .module-table tr.module-table__tr-current td, .module-table__table tr.module-table__tr-current td, table tr.module-table__tr-current td {
    background: #eff6ff !important;
    font-weight: 600;
}
@media (max-width: 640px) {
.module-table__calc-result-box .module-table, .module-table__table-wrap .module-table { min-width: 420px; }
.module-table__table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.module-table__calc-detail::-webkit-scrollbar, .module-table__scroll-wrap::-webkit-scrollbar, .module-table__pyung::-webkit-scrollbar, .module-table__area-type::-webkit-scrollbar, .module-table--salary::-webkit-scrollbar, .module-table::-webkit-scrollbar {
    height: 6px;
  }
.module-table__calc-detail::-webkit-scrollbar-track, .module-table__scroll-wrap::-webkit-scrollbar-track, .module-table__pyung::-webkit-scrollbar-track, .module-table__area-type::-webkit-scrollbar-track, .module-table--salary::-webkit-scrollbar-track, .module-table::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 3px;
  }
.module-table__calc-detail::-webkit-scrollbar-thumb, .module-table__scroll-wrap::-webkit-scrollbar-thumb, .module-table__pyung::-webkit-scrollbar-thumb, .module-table__area-type::-webkit-scrollbar-thumb, .module-table--salary::-webkit-scrollbar-thumb, .module-table::-webkit-scrollbar-thumb {
    background: #94a3b8;
    border-radius: 3px;
  }
}
.module-table__change-item {
  background: #fff;
  border: 1px solid var(--color-border);
  border-left: 4px solid var(--color-border);
  border-radius: var(--color-radius-sm);
  padding: 18px 16px;
  transition: box-shadow .2s, border-color .2s;
}
.module-table__change-item:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
}
.module-table__change-item--up {
  border-left-color: #dc2626;
}
.module-table__change-item--down {
  border-left-color: #059669;
}
.module-table__change-item--good {
  border-left-color: #2563eb;
}
.module-table__change-item-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}
.module-table__change-item-name {
  font-size: 17px;
  font-weight: 800;
  color: var(--color-text-primary);
  flex: 1;
}
.module-table__change-item-badge {
  font-size: 13px;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 20px;
  white-space: nowrap;
  flex-shrink: 0;
}
.module-table__change-item-badge--up {
  color: #dc2626;
  background: #fef2f2;
}
.module-table__change-item-badge--down {
  color: #059669;
  background: #ecfdf5;
}
.module-table__change-item-badge--good {
  color: #2563eb;
  background: #eff6ff;
}
.module-table__change-item-values {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  font-size: 16px;
  font-weight: 700;
}
.module-table__change-item-before {
  color: var(--color-text-muted);
  text-decoration: line-through;
}
.module-table__change-item-arrow {
  color: var(--color-text-muted);
  font-size: 14px;
}
.module-table__change-item-after {
  color: var(--color-text-primary);
  font-size: 18px;
}
.module-table__change-item--up .module-table__change-item-after {
  color: #dc2626;
}
.module-table__change-item--down .module-table__change-item-after {
  color: #059669;
}
.module-table__change-item--good .module-table__change-item-after {
  color: #2563eb;
}
.module-table__change-item-delta {
  font-size: 13px;
  font-weight: 700;
  padding: 2px 8px;
  border-radius: 4px;
  white-space: nowrap;
  margin-left: auto;
}
.module-table__change-item-delta--up {
  color: #dc2626;
  background: #fef2f2;
}
.module-table__change-item-delta--good {
  color: #2563eb;
  background: #eff6ff;
}
.module-table__change-item-effect {
  font-size: 16px;
  font-weight: 600;
  padding: 8px 12px;
  border-radius: 6px;
  margin-bottom: 10px;
  line-height: 1.5;
}
.module-table__change-item-effect--up {
  background: #fef2f2;
  color: #991b1b;
  border-left: 3px solid #dc2626;
}
.module-table__change-item-effect--good {
  background: #eff6ff;
  color: #1e40af;
  border-left: 3px solid #3b82f6;
}
.module-table__change-item-effect strong {
  font-weight: 800;
}
.module-table__change-item-desc {
  font-size: 16px;
  line-height: 1.65;
  color: var(--color-text-secondary);
  margin: 0;
}
.module-table__change-item-desc strong {
  color: var(--color-text-primary);
  font-weight: 600;
}
.module-table__change-item-icon {
  font-size: 20px;
  line-height: 1;
  flex-shrink: 0;
}
.module-table__change-item-impact {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.module-table__change-item-impact-label {
  font-size: 16px; /* HBS 09-28 · 12px → 13px · HBY 09-28 · 13px → 16px(설명 문장 = 내용 글자 · 지휘자 판정) */
  font-weight: 600;
  color: var(--color-text-muted);
  white-space: nowrap;
  min-width: 36px;
}
.module-table__change-item-impact-bar {
  flex: 1;
  height: 6px;
  background: var(--color-border-light);
  border-radius: 3px;
  overflow: hidden;
}
.module-table__change-item-impact-fill {
  height: 100%;
  border-radius: 3px;
  transition: width .6s ease-out;
}
.module-table__change-item-impact-fill--high {
  background: linear-gradient(90deg, #ef4444, #dc2626);
}
.module-table__change-item-impact-fill--mid {
  background: linear-gradient(90deg, #fb923c, #f97316);
}
.module-table__change-item-impact-fill--low {
  background: linear-gradient(90deg, #fbbf24, #f59e0b);
}
.module-table__change-item-impact-fill--good {
  background: linear-gradient(90deg, #60a5fa, #3b82f6);
}
.module-table__change-item-impact-text {
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  min-width: 28px;
  text-align: right;
}
.module-table__change-item--up .module-table__change-item-impact-text {
  color: #dc2626;
}
.module-table__change-item--good .module-table__change-item-impact-text {
  color: #2563eb;
}
.module-table__method-card > table, .module-table__method-card > .module-table__scroll-wrap {
  width: 100%;
}

.module-table tr.module-table__row-current td {
  font-weight: 700;
  color: var(--color-primary-dark);
}
.module-table__section--nearby .module-table td:first-child {
  text-align: center;
}
.module-table td:has(.module-table__hub-nav-current):not(.module-table__td-notes), .module-table td:has(.module-table__link):not(.module-table__td-notes) {
  text-align: center;
}
.module-table__link {
  display: inline-block;
  font-size: 15px;
  font-weight: 700;
  color: var(--color-primary-dark);
  background: var(--color-primary-light);
  border: 1.5px solid color-mix(in srgb, var(--color-primary) 35%, transparent);
  padding: 8px 16px;
  min-height: 44px;
  line-height: 26px;
  border-radius: var(--color-radius-sm);
  white-space: nowrap;
  text-decoration: none;
  box-shadow: 0 1px 3px rgba(0,0,0,.04);
  transition: background .2s, color .2s, transform .15s, box-shadow .15s;
}
.module-table__link:hover, .module-table__content a.module-table__link:hover {
  background: var(--color-primary-dark);
  color: #fff !important;
  border-color: var(--color-primary-dark);
  transform: translateY(-1px);
  box-shadow: 0 3px 10px color-mix(in srgb, var(--color-primary) 30%, transparent);
}
.module-table__link:active, .module-table__content a.module-table__link:active {
  transform: translateY(0) scale(.97);
  background: var(--color-primary-dark);
  border-color: var(--color-primary-dark);
  color: #fff !important;
  box-shadow: none;
}
.module-table__result-card-link:focus-visible, .module-table__link:focus-visible, .module-table__cta--back a:focus-visible, .module-table__related-card:focus-visible, .module-table__related-card:focus-visible, .module-table__steps-content a:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--color-primary-light);
}
@media print {
.module-table__result-card-link, .module-table__link {
    display: none;
  }
}
.module-table__calc-content-section > h3, .module-table__calc-result > h3, .module-table__scroll-wrap > h3 {
  font-size: 18px !important;
  font-weight: 700 !important;
  margin: 24px 0 12px 0 !important;
  line-height: 1.4 !important;
  color: #1e293b;
}
.module-table__table-caption {
  font-size: 16px;
  font-weight: 700;
  color: #1e293b;
  margin: 24px 0 8px 0;
}
.module-table {
  display: table !important;
  width: 100% !important;
  table-layout: auto;
  margin: 16px 0 8px;
}
.module-table__scroll-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.module-table__content a.module-table__link:hover { text-decoration: none; }
.module-table__content table, .module-table__content .module-table, .module-table__content section table, .module-table__content div table, table {
  width: 100% !important; min-width: 100%; border-collapse: collapse; margin: 16px 0;
}
.module-table__content .module-table__scroll-wrap, .module-table__content .module-table__table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
#state-specific-analysis .module-table__related-card .module-table__link {
  display: block;
  margin-top: 8px;
  width: 100%;
  text-align: center;
  pointer-events: none;
}
#state-specific-analysis .module-table__related-card:hover .module-table__link {
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
  transform: translateY(-1px);
  box-shadow: 0 3px 10px color-mix(in srgb, var(--color-primary) 30%, transparent);
}
.module-table tbody tr th[scope="row"], .module-table tbody tr td, .module-table tbody tr th[scope="row"], .module-table tbody tr td {
  border-bottom: 1px solid #e5e7eb !important;
}
.module-table tbody tr:last-child th[scope="row"], .module-table tbody tr:last-child td, .module-table tbody tr:last-child th[scope="row"], .module-table tbody tr:last-child td { /* 🔴 2026-09-23 border-bottom 제거 — 파일 끝 라이브 정본 블록과 중복(게이트 지시: 정본 쪽 값으로 맞춘다) */ }
.module-table.module-table__hub-matrix tbody tr th[scope="row"], .module-table.module-table__hub-matrix tbody tr td, .module-table.module-table__hub-matrix tbody tr th[scope="row"], .module-table.module-table__hub-matrix tbody tr td {
  border-bottom: 1px solid #e5e7eb !important;
}

.module-table__section--scenarios .module-table, .module-table__section--scenarios .module-table {
  width: 100% !important;
  margin: 16px 0 !important;
  table-layout: auto !important;
}
.module-table__section--scenarios .module-table th, .module-table__section--scenarios .module-table td, .module-table__section--scenarios .module-table th, .module-table__section--scenarios .module-table td {
  padding: 10px 12px !important;
  text-align: right !important;
  font-size: 15px !important;
}
.module-table__section--scenarios .module-table thead th, .module-table__section--scenarios .module-table thead th {
  background: #1a73e8 !important;
  color: #fff !important;
  text-align: center !important;
}
.module-table__section--scenarios .module-table tbody th[scope="row"], .module-table__section--scenarios .module-table tbody th[scope="row"] {
  text-align: left !important;
  background: #f9fafb !important;
  font-weight: 600 !important;
  color: #111827 !important;
}
.module-table--compact {
  font-size: 14px;
}
.module-table--compact th, .module-table--compact td {
  padding: 8px 10px;
}
.module-table__row--highlight td {
  background: #eff6ff !important;
  font-weight: 600;
}
.module-table__total td {
  font-weight: 700;
  border-top: 2px solid #94a3b8;
  background: #f8fafc;
}
.module-table__net td {
  font-weight: 700;
  border-top: 2px solid #22c55e;
  background: #f0fdf4;
  color: #15803d;
}
.module-table__section--state-comparison .module-table td:first-child, .module-table__section--state-comparison .module-table th:first-child {
  text-align: left !important;
  vertical-align: middle;
}
.module-table td:first-child:not(.module-table__td-notes) {
  text-align: center;
}

.module-table--full {
  margin-top: 32px;
}
@media (max-width: 640px) {
.module-table__content .module-table__scroll-wrap, .module-table__content .module-table__table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

@media (max-width: 640px) {

}
.module-table__ico-cell { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }

.module-table td:has(.module-table__ico-cell), .module-table__table td:has(.module-table__ico-cell) { text-align: left !important; }
.module-table__ico-cell { justify-content: flex-start; }
.module-table__review-links .module-table__link::after { content:' →'; margin-left:5px; font-weight:700; opacity:.6; display:inline-block; transition:transform .18s ease, opacity .18s ease; }
.module-table__review-links .module-table__link:hover::after { opacity:1; transform:translateX(2px); }

@media (max-width:640px) {
.module-table__review-links /* 🔴 2026-09-23 제거 — 여기 `.module-table__link { white-space:normal }` 을 «전역»으로 넣었던 것이
   텍스트 버튼 링크를 줄바꿈시켰다(사용자 지적 「줄바꿈없이 길어지면 스크롤바가 생기도록 해」).
   🔴 라이브 원문은 범위가 좁다 — modules.css:12266 `.module-review-links .module-table__link { white-space:normal }`.
   라이브 기본값은 `.module-table__link { … white-space: nowrap … }`(modules.css:6515)이고,
   길어지면 `.module-table__scroll-wrap { overflow-x:auto }` 가 가로 스크롤을 준다. 그 기본값을 되살린다. */
}
.module-table__card-spotlight-dp-prodlink:not(.module-table__link), .module-table__content a.module-table__card-spotlight-dp-prodlink:not(.module-table__link), .module-table a.module-table__card-spotlight-dp-prodlink:not(.module-table__link), .module-table__info-box.module-table__info-box a.module-table__card-spotlight-dp-prodlink:not(.module-table__link), .module-table__entry-content .module-table__section a.module-table__card-spotlight-dp-prodlink:not(.module-table__link) {
    font-weight: 700;
    color: var(--color-primary-dark);
    text-decoration: none;
    padding: 2px 4px;
    border-radius: 4px;
    transition: background .15s, color .15s;
}
.module-table__card-spotlight-dp-prodlink:not(.module-table__link):hover, .module-table__content a.module-table__card-spotlight-dp-prodlink:not(.module-table__link):hover, .module-table a.module-table__card-spotlight-dp-prodlink:not(.module-table__link):hover, .module-table__info-box.module-table__info-box a.module-table__card-spotlight-dp-prodlink:not(.module-table__link):hover, .module-table__entry-content .module-table__section a.module-table__card-spotlight-dp-prodlink:not(.module-table__link):hover {
    background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff);
    color: var(--color-primary-dark);
    text-decoration: none;
}
.module-table__card-spotlight-dp-prodlink:not(.module-table__link):hover::after { opacity: 1; transform: translateX(2px); }
.module-table__card-spotlight-dp-prodlink:not(.module-table__link):active { opacity: .75; }
.module-table td.module-table__cell--bar { position: relative; }
.module-table__cellbar {
  position: absolute;
  top: 2px; left: 0; bottom: 2px;
  background: rgba(26, 115, 232, .12);
  border-radius: 0 4px 4px 0;
  z-index: 0;
  pointer-events: none;
}
.module-table__cellbar-text {
  position: relative;
  z-index: 1;
  display: block;
}
.module-table__scroll-hint.module-table__scroll-active { display: block !important; }

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-table, .module-table__longtail-page table, .module-table__section-body table { width: 100% !important; border-collapse: collapse !important; border-spacing: 0 !important; table-layout: auto; font-size: 16px; margin: 16px 0 8px; border-top: 1px solid #dbeafe !important; border-bottom: 1px solid #dbeafe !important; border-left: none !important; border-right: none !important; }
  .module-table th, .module-table__longtail-page table th, .module-table__section-body table th { padding: 12px 10px; font-weight: 700; text-align: center; border-right: 1px solid #cbd5e1 !important; /* 🔴 2026-09-23 color 제거 — 파일 끝 라이브 정본 블록과 중복(게이트 지시: 정본 쪽 값으로 맞춘다) */ }
  .module-table th:last-child, .module-table__longtail-page table th:last-child, .module-table__section-body table th:last-child { border-right: none !important; }
  .module-table td, .module-table__longtail-page table td, .module-table__section-body table td { padding: 11px 10px; text-align: right; border-bottom: 1px solid var(--color-border-light); color: var(--color-text-body); border-right: 1px solid #dbeafe !important; }
  .module-table td:last-child, .module-table__longtail-page table td:last-child, .module-table__section-body table td:last-child { border-right: none !important; }
  .module-table__longtail-page table, .module-table__longtail-page .module-table__scroll-wrap table, .module-table__longtail-page .module-table__table-wrap table { width: auto !important; min-width: 100% !important; border-collapse: collapse !important; border-spacing: 0 !important; table-layout: auto !important; display: table !important; }
  .module-table__longtail-page .module-table__scroll-wrap { overflow-x: auto; width: 100%; max-width: 100%; -webkit-overflow-scrolling: touch; }
  .module-table tr.module-table__tr-current td, .module-table tr.module-table__tr-current td, .module-table__table tr.module-table__tr-current td, .module-table__longtail-page table tr.module-table__tr-current td { background: #eff6ff !important; font-weight: 600; }
  .module-table__longtail-page .module-table { display: table !important; width: 100% !important; table-layout: auto; margin: 16px 0 8px; }
  .module-table__content table, .module-table__content .module-table, .module-table__content section table, .module-table__content div table, .module-table__longtail-page table { width: 100% !important; min-width: 100%; border-collapse: collapse; margin: 16px 0; }
  .module-table tbody tr th[scope="row"], .module-table tbody tr td, .module-table__longtail-page .module-table tbody tr th[scope="row"], .module-table__longtail-page .module-table tbody tr td { border-bottom: 1px solid #e5e7eb !important; }
  .module-table tbody tr:last-child th[scope="row"], .module-table tbody tr:last-child td, .module-table__longtail-page .module-table tbody tr:last-child th[scope="row"], .module-table__longtail-page .module-table tbody tr:last-child td { /* 🔴 2026-09-23 border-bottom 제거 — 파일 끝 라이브 정본 블록과 중복(게이트 지시: 정본 쪽 값으로 맞춘다) */ }
  .module-table.module-table__hub-matrix tbody tr th[scope="row"], .module-table.module-table__hub-matrix tbody tr td, .module-table__longtail-page .module-table.module-table__hub-matrix tbody tr th[scope="row"], .module-table__longtail-page .module-table.module-table__hub-matrix tbody tr td { border-bottom: 1px solid #e5e7eb !important; }
  .module-table__section--scenarios .module-table, .module-table__longtail-page .module-table__section--scenarios .module-table { width: 100% !important; margin: 16px 0 !important; table-layout: auto !important; }
  .module-table__section--scenarios .module-table th, .module-table__section--scenarios .module-table td, .module-table__longtail-page .module-table__section--scenarios .module-table th, .module-table__longtail-page .module-table__section--scenarios .module-table td { padding: 10px 12px !important; text-align: right !important; font-size: 15px !important; }
  .module-table__section--scenarios .module-table thead th, .module-table__longtail-page .module-table__section--scenarios .module-table thead th { background: #1a73e8 !important; color: #fff !important; text-align: center !important; }
  .module-table__section--scenarios .module-table tbody th[scope="row"], .module-table__longtail-page .module-table__section--scenarios .module-table tbody th[scope="row"] { text-align: left !important; background: #f9fafb !important; font-weight: 600 !important; color: #111827 !important; }
/* ── 동기화 블록 끝 (sync-live) ── */

/* hand-fix:table:프라이즈 견줌 */
/* ── 프라이즈 견줌 (2026-09-08 사용자 지적: 「무슨 의미인지 알 수가 없어」) ──
 * 🔴 이 구획은 라이브에 «없다» — 라이브 HTML 전체에 ● 가 0개이고 대응 계열도 0이다.
 *    우리가 만든 것인데 클래스·CSS 없이 네 줄을 쌓아 놓아 점만 흩어져 보였다.
 * 두 줄을 «나란히» 세워 세로로 견주게 한다 — 이름 · 점 · 숫자 세 칸.
 * 점은 한눈에 세는 장치이고, 옆의 숫자가 그것을 글로 확정한다(점만으로는 확정이 안 된다).
 */
.module-table__prize-pip-compare { margin: 12px 0 0; }
.module-table__prize-pip-compare-title { margin: 0 0 8px; font-size: 13px; font-weight: 700; color: var(--mut, #64748b); }
.module-table__prize-pip-compare-row { display: grid; grid-template-columns: 76px auto 1fr; align-items: center; gap: 10px; padding: 6px 0; }
.module-table__prize-pip-compare-row + .module-table__prize-pip-compare-row { border-top: 1px dashed var(--line2, #d7dee8); }
.module-table__prize-pip-compare-label { font-size: 13px; font-weight: 700; color: var(--ink2, #334155); }
.module-table__prize-pip-compare-pips { display: inline-flex; gap: 5px; }
.module-table__prize-pip-compare-pips > i { width: 13px; height: 13px; border-radius: 50%; background: var(--acc, #3b82f6); display: block; }
.module-table__prize-pip-compare-row--base .module-table__prize-pip-compare-pips > i { background: var(--line2, #cbd5e1); }
.module-table__prize-pip-compare-count { font-size: 14px; font-weight: 800; color: var(--ink, #1f2937); font-variant-numeric: tabular-nums; }
.module-table__prize-pip-compare-row--base .module-table__prize-pip-compare-count { color: var(--mut, #64748b); font-weight: 700; }
.module-table__prize-pip-compare-note { margin: 8px 0 0; font-size: 13px; color: var(--mut, #64748b); line-height: 1.6; }


/* ── 짝 맞추기 — 마크업이 찍는데 규칙이 없던 이름 (2026-09-10 창D) ────────── */
/* 🔴 짝 맞추기(2026-09-10 창D) — 변형 표식 — 원본에 선언 없음.
   마크업이 이 이름을 찍는데 규칙이 없어 «자리»만 만든다. 생김새는 «창작하지 않는다»
   (선례 = display/pdf-embed/style.css .module-pdf-embed__title). */
.module-table__prize-pip-compare-row--self {
}


/* ── v2.4(modules-v2.4-20260909) 에만 있던 규칙 보충 — 이름만 지금 이름으로 · 값은 v2.4 그대로 (2026-09-11 창D) ── */
@media print {
.module-table__result-card-link, .module-table__link, .module-table__cta--back {
  display: none;
}
}

/* 🔴🔴 2026-09-22 — 라이브 원문 이식(사용자 확정 「가격 빨강처리된 것이 로컬 설계인데 안 된 것
   전수 검수해서 수정해」). 정본 = F:/레퍼런스/시세/generatepress_child/assets/css/modules.css:2399~
   — «선택자·값 한 글자도 바꾸지 않았다».

   🔴 왜 빠졌었나(원인) — 이 세 클래스는 «모듈 마크업»이 아니라 «데이터»로 들어온다.
     굽는 쪽(core/build/atoms/opinet-webbulk-csv.mjs)이 표 셀 값을 완성 HTML 로 만들면서
     `<a class="module-table__link">`·`<span class="price-low">` 를 «문자열 안에» 넣는다
     (표 모듈 계약 §11-1 「표시용 완성 문자열은 데이터로」).
     ⇒ 모듈 index.html 에는 그 클래스가 «한 번도 나오지 않는다». 그래서 모듈 CSS 를 라이브에서
     옮길 때 «마크업에 있는 선택자»만 따라갔고 이 셋은 통째로 누락됐다.
   🔴 재발 방지 = 「우리가 «데이터»로 내보내는 클래스」를 분모로 CSS 실재를 대조한다.
     실측 명령(이 회차에 쓴 것 그대로):
       grep -rhoE 'class=\?"[a-z][a-z0-9_ -]*' core/build/atoms/*.mjs sites/*/manifests
       → 각 이름이 core/modules/*/*/style.css 에 있는지 확인. 없으면 FAIL.
     이 census 로 오늘 10개 중 CSS 없는 것 4종을 찾았다(price-low·module-table__link 외 2종은
     라이브 CSS 에도 없어 별건). */
.price-low  { color: #dc2626; font-weight: 700; }   /* 최저가·저렴(절약 신호) */
.price-high { color: #475569; }
/* 🔴 2026-09-23 제거 — 여기 `.module-table__link { white-space:normal }` 을 «전역»으로 넣었던 것이
   텍스트 버튼 링크를 줄바꿈시켰다(사용자 지적 「줄바꿈없이 길어지면 스크롤바가 생기도록 해」).
   🔴 라이브 원문은 범위가 좁다 — modules.css:12266 `.module-review-links .module-table__link { white-space:normal }`.
   라이브 기본값은 `.module-table__link { … white-space: nowrap … }`(modules.css:6515)이고,
   길어지면 `.module-table__scroll-wrap { overflow-x:auto }` 가 가로 스크롤을 준다. 그 기본값을 되살린다. */

/* 🔴🔴 2026-09-23 사용자 지적 「가격은 셀 내에서 오른쪽 정렬」 — 라이브 원본 그대로 이식.
   출처 = 시세 로컬 assets/css/modules.css:2405~2407 (주석 원문 「이름(보통 링크) + 값(오른쪽).
   한 셀에 명칭+값 동거 시 (2026-06-18)」). 우리 배달 CSS 에 이 세 줄이 «0건»이라
   sib-low 표의 「주유소명 가격원」이 한 줄로 붙어 왼쪽으로 몰려 있었다. 한 글자도 바꾸지 않았다. */
.cell-split { display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.cell-split > :first-child { text-align: left; min-width: 0; overflow-wrap: anywhere; }
.cell-split .cell-val { white-space: nowrap; flex: 0 0 auto; }   /* 오른쪽 값(가격 등) — 줄바꿈 방지 */

/* 로컬 modules.css:2421~2422 — 정렬 유틸리티(표 셀이 쓴다). 우리에 없어 함께 이식. */
.align-left   { text-align: left; }
.align-right  { text-align: right; }


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
@media (max-width: 640px) {
  .module-calc-result__box .module-table { min-width: 420px; }   /* modules.css:4220 */
  .module-table-wrap .module-table { min-width: 420px; }   /* modules.css:4220 */
  .module-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }   /* modules.css:4224 */
  .module-content .module-table__scroll-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }   /* modules.css:7743 */
  .module-content .module-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }   /* modules.css:7743 */
}
@media (max-width:640px) {
  .module-review-links /* 🔴 2026-09-23 제거 — 여기 `.module-table__link { white-space:normal }` 을 «전역»으로 넣었던 것이
   텍스트 버튼 링크를 줄바꿈시켰다(사용자 지적 「줄바꿈없이 길어지면 스크롤바가 생기도록 해」).
   🔴 라이브 원문은 범위가 좁다 — modules.css:12266 `.module-review-links .module-table__link { white-space:normal }`.
   라이브 기본값은 `.module-table__link { … white-space: nowrap … }`(modules.css:6515)이고,
   길어지면 `.module-table__scroll-wrap { overflow-x:auto }` 가 가로 스크롤을 준다. 그 기본값을 되살린다. */   /* modules.css:11509 */
}
.module-table td.td-notes { text-align: left !important; font-size: inherit !important; color: inherit !important; }   /* modules.css:290 */
.module-table__table td.td-notes { text-align: left !important; font-size: inherit !important; color: inherit !important; }   /* modules.css:290 */
.module-table td.td-center { text-align: center !important; }   /* modules.css:299 */
.module-table__table td.td-center { text-align: center !important; }   /* modules.css:299 */
.module-table--salary .col-highlight { font-weight: 700; color: #0f172a; }   /* modules.css:3033 */
.module-table--salary thead .col-highlight { color: #92400e; background: #fef3c7 !important; }   /* modules.css:3037 */
.module-table--salary tr.row-highlight { background: #f3f4f6; }   /* modules.css:3041 */
.module-table tr.row-highlight { background: #f3f4f6; }   /* modules.css:3041 */
.module-table--salary tr.row-highlight td { font-weight: 600; background: #f3f4f6 !important; }   /* modules.css:3047 */
.module-table tr.row-highlight td { font-weight: 600; background: #f3f4f6 !important; }   /* modules.css:3047 */
.module-table--salary tr.row-highlight--current { background: #eff6ff !important; }   /* modules.css:3052 */
.module-table tr.row-highlight--current { background: #eff6ff !important; }   /* modules.css:3052 */
.module-table--salary tr.row-highlight--current td { font-weight: 600; background: #eff6ff !important; }   /* modules.css:3057 */
.module-table tr.row-highlight--current td { font-weight: 600; background: #eff6ff !important; }   /* modules.css:3057 */
.module-table tr.row-highlight--green { background: #ecfccb !important; font-weight: 600; }   /* modules.css:3062 */
.module-table tr.row-highlight--green td { background: #ecfccb !important; font-weight: 600; }   /* modules.css:3062 */
.module-table tr.row-highlight--yellow { background: #fef3c7 !important; font-weight: 600; }   /* modules.css:3067 */
.module-table tr.row-highlight--yellow td { background: #fef3c7 !important; font-weight: 600; }   /* modules.css:3067 */
.module-table tr.row-highlight--red { background: #fee2e2 !important; font-weight: 600; }   /* modules.css:3072 */
.module-table tr.row-highlight--red td { background: #fee2e2 !important; font-weight: 600; }   /* modules.css:3072 */
.module-table tr.row-highlight--green-soft { background: #f0fdf4 !important; }   /* modules.css:3077 */
.module-table tr.row-highlight--green-soft td { background: #f0fdf4 !important; }   /* modules.css:3077 */
.module-table tr.row-highlight--red-soft { background: #fef2f2 !important; }   /* modules.css:3082 */
.module-table tr.row-highlight--red-soft td { background: #fef2f2 !important; }   /* modules.css:3082 */
.module-table tr.row-inactive { opacity: 0.4; }   /* modules.css:3086 */
.module-table tr.row-inactive td { opacity: 0.4; }   /* modules.css:3086 */
.module-table th.th-right { text-align: right; }   /* modules.css:3091 */
.module-table td.td-right { text-align: right; }   /* modules.css:3091 */
.module-table th.th-left { text-align: left; }   /* modules.css:3096 */
.module-table td.td-left { text-align: left; }   /* modules.css:3096 */
body .module-table th.td-center { text-align: center !important; }   /* modules.css:3100 */
body .module-table td.td-center { text-align: center !important; }   /* modules.css:3100 */
.module-table tbody td.td-center { text-align: center !important; }   /* modules.css:3100 */
.module-table thead th.td-center { text-align: center !important; }   /* modules.css:3100 */
.module-table th.td-center { text-align: center !important; }   /* modules.css:3100 */
.module-table td.td-center { text-align: center !important; }   /* modules.css:3100 */
.module-table td:has(a.hub-matrix__link) { text-align: center !important; }   /* modules.css:3100 */
.module-table th:has(a.hub-matrix__link) { text-align: center !important; }   /* modules.css:3100 */
.module-table td.td-nearby { text-align: center; }   /* modules.css:3113 */
.module-table--salary tr.subtotal td { background: var(--color-bg-subtle); font-weight: 600; border-bottom: 1px solid var(--color-border); }   /* modules.css:3124 */
.module-table--salary tr.total td { background: var(--color-primary-light); font-weight: 700; color: var(--color-primary-dark); }   /* modules.css:3129 */
.module-table-caption { caption-side: top; text-align: left; font-size: 15px; font-weight: 700; color: #0f172a; background: #f8fafc; padding: 10px 14px; border-left: 4px solid var(--color-primary, #3b82f6); margin-bottom: 0; border-radius: 4px 4px 0 0; }   /* modules.css:3165 */
.module-table td.td-notes { text-align: left; font-size: inherit !important; color: inherit !important; }   /* modules.css:3217 */
.module-table th.td-notes { text-align: left; font-size: inherit !important; color: inherit !important; }   /* modules.css:3217 */
.module-table .col-highlight { font-weight: 700; color: #0f172a; }   /* modules.css:3292 */
.module-table thead .col-highlight { color: #92400e; background: #fef3c7 !important; }   /* modules.css:3296 */
.module-table tr.row-highlight td { background: #f9fafb; font-weight: 600; }   /* modules.css:3300 */
.module-table tr.subtotal td { background: var(--color-bg-subtle); font-weight: 600; border-bottom: 1px solid var(--color-border); }   /* modules.css:3304 */
.module-table tr.row-subtotal td { background: var(--color-bg-subtle); font-weight: 600; border-bottom: 1px solid var(--color-border); }   /* modules.css:3304 */
.module-table tr.total td { background: var(--color-primary-light); font-weight: 700; color: var(--color-primary-dark); }   /* modules.css:3310 */
.module-table--salary.center-first td:first-child { text-align: center; }   /* modules.css:3318 */
.module-table.center-first td:first-child { text-align: center; }   /* modules.css:3318 */
.module-table-wrap + .module-table__scroll-hint:not(.module-table__scroll-hint--top) { margin-top: 14px !important; }   /* modules.css:3963 */
.module-table__scroll-hint--top + .module-table-wrap { margin-top: 2px !important; }   /* modules.css:3968 */
.module-table__scroll-hint.scroll-active { display: block !important; }   /* modules.css:3975 */
.longtail-page .module-table__scroll-wrap table { width: auto !important; min-width: 100% !important; border-collapse: collapse !important; border-spacing: 0 !important; table-layout: auto !important; display: table !important; }   /* modules.css:4000 */
.longtail-page .module-table-wrap table { width: auto !important; min-width: 100% !important; border-collapse: collapse !important; border-spacing: 0 !important; table-layout: auto !important; display: table !important; }   /* modules.css:4000 */
.longtail-page .module-table__scroll-wrap { overflow-x: auto; width: 100%; }   /* modules.css:4013 */
.module-table tr.tr-current td { background: #eff6ff !important; font-weight: 600; }   /* modules.css:4040 */
.module-table tr.tr-current td { background: #eff6ff !important; font-weight: 600; }   /* modules.css:4040 */
.module-table__table tr.tr-current td { background: #eff6ff !important; font-weight: 600; }   /* modules.css:4040 */
.module-table__change-item__header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }   /* modules.css:4704 */
.module-table__change-item__name { font-size: 17px; font-weight: 800; color: var(--color-text-primary); flex: 1; }   /* modules.css:4711 */
.module-table__change-item__badge { font-size: 13px; font-weight: 700; padding: 3px 10px; border-radius: 20px; white-space: nowrap; flex-shrink: 0; }   /* modules.css:4717 */
.module-table__change-item__badge--up { color: #dc2626; background: #fef2f2; }   /* modules.css:4725 */
.module-table__change-item__badge--down { color: #059669; background: #ecfdf5; }   /* modules.css:4729 */
.module-table__change-item__badge--good { color: #2563eb; background: #eff6ff; }   /* modules.css:4733 */
.module-table__change-item__values { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; font-size: 16px; font-weight: 700; }   /* modules.css:4737 */
.module-table__change-item__before { color: var(--color-text-muted); text-decoration: line-through; }   /* modules.css:4745 */
.module-table__change-item__arrow { color: var(--color-text-muted); font-size: 14px; }   /* modules.css:4749 */
.module-table__change-item__after { color: var(--color-text-primary); font-size: 18px; }   /* modules.css:4753 */
.module-table__change-item--up .module-table__change-item__after { color: #dc2626; }   /* modules.css:4757 */
.module-table__change-item--down .module-table__change-item__after { color: #059669; }   /* modules.css:4760 */
.module-table__change-item--good .module-table__change-item__after { color: #2563eb; }   /* modules.css:4763 */
.module-table__change-item__delta { font-size: 13px; font-weight: 700; padding: 2px 8px; border-radius: 4px; white-space: nowrap; margin-left: auto; }   /* modules.css:4766 */
.module-table__change-item__delta--up { color: #dc2626; background: #fef2f2; }   /* modules.css:4775 */
.module-table__change-item__delta--good { color: #2563eb; background: #eff6ff; }   /* modules.css:4779 */
.module-table__change-item__effect { font-size: 16px; font-weight: 600; padding: 8px 12px; border-radius: 6px; margin-bottom: 10px; line-height: 1.5; }   /* modules.css:4783 */
.module-table__change-item__effect--up { background: #fef2f2; color: #991b1b; border-left: 3px solid #dc2626; }   /* modules.css:4793 */
.module-table__change-item__effect--good { background: #eff6ff; color: #1e40af; border-left: 3px solid #3b82f6; }   /* modules.css:4798 */
.module-table__change-item__effect strong { font-weight: 800; }   /* modules.css:4803 */
.module-table__change-item__desc { font-size: 16px; line-height: 1.65; color: var(--color-text-secondary); margin: 0; }   /* modules.css:4806 */
.module-table__change-item__desc strong { color: var(--color-text-primary); font-weight: 600; }   /* modules.css:4813 */
.module-table__change-item__icon { font-size: 20px; line-height: 1; flex-shrink: 0; }   /* modules.css:4817 */
.module-table__change-item__impact { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }   /* modules.css:4824 */
.module-table__change-item__impact-label { font-size: 16px; /* HBS 09-28 · 12px → 13px · HBY 09-28 · 13px → 16px(같은 규칙 두 벌 함께 · 설명 문장 = 내용 글자) */ font-weight: 600; color: var(--color-text-muted); white-space: nowrap; min-width: 36px; }   /* modules.css:4832 */
.module-table__change-item__impact-bar { flex: 1; height: 6px; background: var(--color-border-light); border-radius: 3px; overflow: hidden; }   /* modules.css:4839 */
.module-table__change-item__impact-fill { height: 100%; border-radius: 3px; transition: width .6s ease-out; }   /* modules.css:4846 */
.module-table__change-item__impact-fill--high { background: linear-gradient(90deg, #ef4444, #dc2626); }   /* modules.css:4851 */
.module-table__change-item__impact-fill--mid { background: linear-gradient(90deg, #fb923c, #f97316); }   /* modules.css:4854 */
.module-table__change-item__impact-fill--low { background: linear-gradient(90deg, #fbbf24, #f59e0b); }   /* modules.css:4857 */
.module-table__change-item__impact-fill--good { background: linear-gradient(90deg, #60a5fa, #3b82f6); }   /* modules.css:4860 */
.module-table__change-item__impact-text { font-size: 13px; font-weight: 700; white-space: nowrap; min-width: 28px; text-align: right; }   /* modules.css:4863 */
.module-table__change-item--up .module-table__change-item__impact-text { color: #dc2626; }   /* modules.css:4870 */
.module-table__change-item--good .module-table__change-item__impact-text { color: #2563eb; }   /* modules.css:4873 */
.module-method-card > .module-table__scroll-wrap { width: 100%; }   /* modules.css:5011 */
.module-table tr.row-current { background: var(--color-primary-light); }   /* modules.css:6037 */
.module-table tr.row-current td { font-weight: 700; color: var(--color-primary-dark); }   /* modules.css:6042 */
.module-section--nearby .module-table td:first-child { text-align: center; }   /* modules.css:6046 */
.module-table td:has(.module-hub-nav__current):not(.td-notes) { text-align: center; }   /* modules.css:6050 */
.module-table td:has(.module-table__link):not(.td-notes) { text-align: center; }   /* modules.css:6050 */
.module-content a.module-table__link:hover { background: var(--color-primary-dark); color: #fff !important; border-color: var(--color-primary-dark); transform: translateY(-1px); box-shadow: 0 3px 10px color-mix(in srgb, var(--color-primary) 30%, transparent); }   /* modules.css:6071 */
.module-content a.module-table__link:active { transform: translateY(0) scale(.97); background: var(--color-primary-dark); border-color: var(--color-primary-dark); color: #fff !important; box-shadow: none; }   /* modules.css:6079 */
.module-table-caption { font-size: 16px; font-weight: 700; color: #1e293b; margin: 24px 0 8px 0; }   /* modules.css:6774 */
.longtail-page .module-table { display: table !important; width: 100% !important; table-layout: auto; margin: 16px 0 8px; }   /* modules.css:6844 */
.longtail-page .module-table__scroll-wrap { width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }   /* modules.css:6853 */
.module-content a.module-table__link:hover { text-decoration: none; }   /* modules.css:6951 */
.module-content .module-table { width: 100% !important; min-width: 100%; border-collapse: collapse; margin: 16px 0; }   /* modules.css:6953 */
.module-content .module-table__scroll-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }   /* modules.css:6974 */
.module-content .module-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }   /* modules.css:6974 */
#state-specific-analysis .module-related__card .module-table__link { display: block; margin-top: 8px; width: 100%; text-align: center; pointer-events: none; }   /* modules.css:7013 */
#state-specific-analysis .module-related__card:hover .module-table__link { background: var(--color-primary); color: #fff; border-color: var(--color-primary); transform: translateY(-1px); box-shadow: 0 3px 10px color-mix(in srgb, var(--color-primary) 30%, transparent); }   /* modules.css:7020 */
.longtail-page .module-table tbody tr th[scope="row"] { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7149 */
.longtail-page .module-table tbody tr td { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7149 */
.longtail-page .module-table tbody tr:last-child th[scope="row"] { border-bottom: 2px solid #e5e7eb !important; }   /* modules.css:7159 */
.longtail-page .module-table tbody tr:last-child td { border-bottom: 2px solid #e5e7eb !important; }   /* modules.css:7159 */
.module-table.hub-matrix tbody tr th[scope="row"] { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7165 */
.module-table.hub-matrix tbody tr td { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7165 */
.longtail-page .module-table.hub-matrix tbody tr th[scope="row"] { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7165 */
.longtail-page .module-table.hub-matrix tbody tr td { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7165 */
.longtail-page .module-table__scroll-wrap table.hub-matrix { width: auto !important; min-width: 900px !important; table-layout: auto !important; overflow-x: visible !important; display: table !important; }   /* modules.css:7243 */
.longtail-page .module-table-wrap table.hub-matrix { width: auto !important; min-width: 900px !important; table-layout: auto !important; overflow-x: visible !important; display: table !important; }   /* modules.css:7243 */
.longtail-page .hub-block--rank-x-component .module-table__scroll-wrap table.hub-matrix { min-width: 100% !important; width: auto !important; table-layout: auto !important; }   /* modules.css:7280 */
.longtail-page .hub-block--tis-x-component .module-table__scroll-wrap table.hub-matrix { min-width: 100% !important; width: auto !important; table-layout: auto !important; }   /* modules.css:7280 */
.longtail-page .hub-block--rank-x-type .module-table__scroll-wrap table.hub-matrix { min-width: 100% !important; width: auto !important; table-layout: auto !important; }   /* modules.css:7280 */
.longtail-page .hub-block--state-x-service .module-table__scroll-wrap table.hub-matrix { min-width: 100% !important; width: auto !important; table-layout: auto !important; }   /* modules.css:7280 */
.module-section--scenarios .module-table { width: 100% !important; margin: 16px 0 !important; table-layout: auto !important; }   /* modules.css:7395 */
.longtail-page .module-section--scenarios .module-table { width: 100% !important; margin: 16px 0 !important; table-layout: auto !important; }   /* modules.css:7395 */
.module-section--scenarios .module-table th { padding: 10px 12px !important; text-align: right !important; font-size: 15px !important; }   /* modules.css:7403 */
.module-section--scenarios .module-table td { padding: 10px 12px !important; text-align: right !important; font-size: 15px !important; }   /* modules.css:7403 */
.longtail-page .module-section--scenarios .module-table th { padding: 10px 12px !important; text-align: right !important; font-size: 15px !important; }   /* modules.css:7403 */
.longtail-page .module-section--scenarios .module-table td { padding: 10px 12px !important; text-align: right !important; font-size: 15px !important; }   /* modules.css:7403 */
.module-section--scenarios .module-table thead th { background: #1a73e8 !important; color: #fff !important; text-align: center !important; }   /* modules.css:7411 */
.longtail-page .module-section--scenarios .module-table thead th { background: #1a73e8 !important; color: #fff !important; text-align: center !important; }   /* modules.css:7411 */
.module-section--scenarios .module-table tbody th[scope="row"] { text-align: left !important; background: #f9fafb !important; font-weight: 600 !important; color: #111827 !important; }   /* modules.css:7417 */
.longtail-page .module-section--scenarios .module-table tbody th[scope="row"] { text-align: left !important; background: #f9fafb !important; font-weight: 600 !important; color: #111827 !important; }   /* modules.css:7417 */
.module-section--state-comparison .module-table td:first-child { text-align: left !important; vertical-align: middle; }   /* modules.css:7572 */
.module-section--state-comparison .module-table th:first-child { text-align: left !important; vertical-align: middle; }   /* modules.css:7572 */
.module-table td:first-child:not(.td-notes) { text-align: center; }   /* modules.css:7666 */
.module-table th:first-child:not(.td-notes) { text-align: center; }   /* modules.css:7670 */
.module-table__ico-cell .core-issuer-ico.module-table__cell-ico { width: 20px; height: 20px; flex: 0 0 auto; border-radius: 4px; }   /* modules.css:9877 */
.module-table__ico-cell .core-issuer-ico--txt.module-table__cell-ico { width: 20px; height: 20px; font-size: 13px; /* HBS 09-28 · 8.5px → 13px(20px 글자 아이콘 · 넘침 확인 대상 · 같은 규칙 두 벌 함께) */ border-radius: 4px; }   /* modules.css:10032 */
.module-review-links .module-table__link::after { content:' →'; margin-left:5px; font-weight:700; opacity:.6; display:inline-block; transition:transform .18s ease, opacity .18s ease; }   /* modules.css:11467 */
.module-review-links .module-table__link:hover::after { opacity:1; transform:translateX(2px); }   /* modules.css:11468 */
.module-review-links a.module-table__link.module-review-links__cta { border-radius:999px; padding:10px 20px; background:linear-gradient(135deg, var(--color-primary,#1a73e8), var(--color-primary-dark,#1557b0)); color:#fff; border:1.5px solid transparent; font-weight:800; }   /* modules.css:11483 */
.module-review-links a.module-table__link.module-review-links__cta:hover { background:var(--color-primary-dark,#1557b0); color:#fff; }   /* modules.css:11490 */
.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.module-content a.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.module-table a.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.module-info-box.module-info-box a.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.entry-content .module-section a.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.module-table a.dp-prodlink::after { content: none; }   /* modules.css:11627 */
.module-table td:has(a.dp-prodlink) { text-align: left !important; }   /* modules.css:11629 */
.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.module-content a.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.module-table a.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.module-info-box.module-info-box a.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.entry-content .module-section a.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.dp-prodlink:not(.module-table__link):hover::after { opacity: 1; transform: translateX(2px); }   /* modules.css:11643 */
.dp-prodlink:not(.module-table__link):active { opacity: .75; }   /* modules.css:11645 */


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
.price-low { color: #dc2626; font-weight: 700; }   /* modules.css:2174 */


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
@media (max-width: 640px) {
  .module-calc-result__box .module-table { min-width: 420px; }   /* modules.css:4220 */
  .module-table-wrap .module-table { min-width: 420px; }   /* modules.css:4220 */
  .module-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }   /* modules.css:4224 */
  .module-table__scroll-wrap::-webkit-scrollbar { height: 6px; }   /* modules.css:4225 */
  .module-table--salary::-webkit-scrollbar { height: 6px; }   /* modules.css:4225 */
  .module-table::-webkit-scrollbar { height: 6px; }   /* modules.css:4225 */
  .module-table__scroll-wrap::-webkit-scrollbar-track { background: #f1f5f9; border-radius: 3px; }   /* modules.css:4235 */
  .module-table--salary::-webkit-scrollbar-track { background: #f1f5f9; border-radius: 3px; }   /* modules.css:4235 */
  .module-table::-webkit-scrollbar-track { background: #f1f5f9; border-radius: 3px; }   /* modules.css:4235 */
  .module-table__scroll-wrap::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 3px; }   /* modules.css:4244 */
  .module-table--salary::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 3px; }   /* modules.css:4244 */
  .module-table::-webkit-scrollbar-thumb { background: #94a3b8; border-radius: 3px; }   /* modules.css:4244 */
  .module-content .module-table__scroll-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }   /* modules.css:7743 */
  .module-content .module-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }   /* modules.css:7743 */
}
@media print {
  .module-table__link { display: none; }   /* modules.css:6641 */
}
@media (max-width:640px) {
  .module-review-links .module-table__link { white-space:normal; }   /* modules.css:11509 */
}
.module-table { width: 100%; border-collapse: collapse; border-spacing: 0; border: 0 !important; table-layout: auto; font-size: 17px; margin: 16px 0 8px; }   /* modules.css:274 */
.module-table__table { width: 100%; border-collapse: collapse; border-spacing: 0; border: 0 !important; table-layout: auto; font-size: 17px; margin: 16px 0 8px; }   /* modules.css:274 */
.module-table td.td-notes { text-align: left !important; font-size: inherit !important; color: inherit !important; }   /* modules.css:290 */
.module-table__table td.td-notes { text-align: left !important; font-size: inherit !important; color: inherit !important; }   /* modules.css:290 */
.module-table td.td-center { text-align: center !important; }   /* modules.css:299 */
.module-table__table td.td-center { text-align: center !important; }   /* modules.css:299 */
.module-table td.module-table__cell--center { text-align: center !important; }   /* modules.css:304 */
.module-table__table td.module-table__cell--center { text-align: center !important; }   /* modules.css:304 */
.module-table td.module-table__cell--note { text-align: left !important; }   /* modules.css:309 */
.module-table__table td.module-table__cell--note { text-align: left !important; }   /* modules.css:309 */
.module-table thead { background: #e2e8f0; color: #1e293b; border-bottom: 2px solid #94a3b8; }   /* modules.css:313 */
.module-table__head { background: #e2e8f0; color: #1e293b; border-bottom: 2px solid #94a3b8; }   /* modules.css:313 */
.module-table caption { caption-side: top; text-align: left; font-size: 16px; font-weight: 700; color: #0f172a; background: #f8fafc; padding: 10px 14px; margin-bottom: 10px; border-radius: 4px; }   /* modules.css:320 */
.module-table__caption { caption-side: top; text-align: left; font-size: 16px; font-weight: 700; color: #0f172a; background: #f8fafc; padding: 10px 14px; margin-bottom: 10px; border-radius: 4px; }   /* modules.css:320 */
.module-table:has(caption) { margin-top: 24px; }   /* modules.css:334 */
.module-table__caption { margin-top: 24px; }   /* modules.css:336 */
.module-table th { padding: 12px 10px; font-weight: 700; text-align: center; color: #1e293b; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; }   /* modules.css:339 */
.module-table__table th { padding: 12px 10px; font-weight: 700; text-align: center; color: #1e293b; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; }   /* modules.css:339 */
.module-table td { padding: 11px 10px; text-align: right; border-bottom: 1px solid #e5e7eb !important; color: #374151; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; }   /* modules.css:351 */
.module-table__table td { padding: 11px 10px; text-align: right; border-bottom: 1px solid #e5e7eb !important; color: #374151; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; }   /* modules.css:351 */
.module-table__cell { padding: 11px 10px; text-align: right; border-bottom: 1px solid #e5e7eb !important; color: #374151; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; }   /* modules.css:351 */
.module-table td:first-child { text-align: left; }   /* modules.css:364 */
.module-table tbody tr:nth-child(even) td { background: #f8fafc; }   /* modules.css:366 */
.module-table tr:hover td { background: #f1f5f9; }   /* modules.css:368 */
.module-table a { text-decoration: none; color: #3b82f6; }   /* modules.css:369 */
.module-table a:hover { text-decoration: none; color: #1d4ed8; }   /* modules.css:370 */
.module-table__note { text-align: left; font-size: 1rem; color: #94a3b8; margin-top: 6px; }   /* modules.css:371 */
.module-table__notes { text-align: left; font-size: 1rem; color: #94a3b8; margin-top: 6px; }   /* modules.css:371 */
.module-table__note-ic { margin-right: 3px; }   /* modules.css:379 */
.module-table__row--group td { background: #f1f5f9; font-weight: 700; color: #1e293b; border-top: 2px solid #94a3b8; }   /* modules.css:383 */
.module-table__wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 16px 0; border-radius: 8px; }   /* modules.css:389 */
.module-table--compact td { padding: 6px 8px; }   /* modules.css:397 */
.module-table--compact th { padding: 6px 8px; }   /* modules.css:397 */
.module-table--full { width: 100%; }   /* modules.css:402 */
.module-table--reference { margin: 24px 0; overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 8px; }   /* modules.css:1965 */
.module-table--reference table { width: 100%; border-collapse: collapse; font-size: 14px; }   /* modules.css:1975 */
.module-table--reference th { padding: 10px; background: #e2e8f0; color: #1e293b; font-weight: 700; text-align: center; border-bottom: 2px solid #94a3b8; }   /* modules.css:1993 */
.module-table--reference td { padding: 8px 10px; text-align: right; border-bottom: 1px solid #e5e7eb; color: #374151; }   /* modules.css:2002 */
.module-table--reference td:first-child { text-align: left; }   /* modules.css:2009 */
.module-table__row--here { background: #eff6ff; font-weight: 700; }   /* modules.css:2188 */
.module-table__row--best td { font-weight: 700; }   /* modules.css:2193 */
.module-table__scroll-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: 8px }   /* modules.css:2305 */   /* 🔴 2026-09-23 — 라이브 유효값과 다른 칸을 뺐다 */
.module-table--salary { width: 100%; border-collapse: collapse; font-size: 16px; margin: 16px 0 8px; }   /* modules.css:2998 */
.module-table--salary thead { background: #e2e8f0; color: #1e293b; border-bottom: 2px solid #94a3b8; }   /* modules.css:3007 */
.module-table--salary th { padding: 12px 10px; font-weight: 700; text-align: center; color: #1e293b; }   /* modules.css:3012 */
.module-table--salary td { padding: 11px 10px; text-align: right; border-bottom: 1px solid var(--color-border-light); color: var(--color-text-body); }   /* modules.css:3018 */
.module-table--salary td:first-child:has(a) { text-align: center; }   /* modules.css:3024 */
.module-table--salary tbody tr:nth-child(even) { background: var(--color-bg-subtle); }   /* modules.css:3027 */
.module-table--salary tbody tr:hover { background: #f1f5f9; }   /* modules.css:3030 */
.module-table--salary .col-highlight { font-weight: 700; color: #0f172a; }   /* modules.css:3033 */
.module-table--salary thead .col-highlight { color: #92400e; background: #fef3c7 !important; }   /* modules.css:3037 */
.module-table--salary tr.row-highlight { background: #f3f4f6; }   /* modules.css:3041 */
.module-table tr.row-highlight { background: #f3f4f6; }   /* modules.css:3041 */
.module-table--salary tr.row-highlight td { font-weight: 600; background: #f3f4f6 !important; }   /* modules.css:3047 */
.module-table tr.row-highlight td { font-weight: 600; background: #f3f4f6 !important; }   /* modules.css:3047 */
.module-table--salary tr.row-highlight--current { background: #eff6ff !important; }   /* modules.css:3052 */
.module-table tr.row-highlight--current { background: #eff6ff !important; }   /* modules.css:3052 */
.module-table--salary tr.row-highlight--current td { font-weight: 600; background: #eff6ff !important; }   /* modules.css:3057 */
.module-table tr.row-highlight--current td { font-weight: 600; background: #eff6ff !important; }   /* modules.css:3057 */
.module-table tr.row-highlight--green { background: #ecfccb !important; font-weight: 600; }   /* modules.css:3062 */
.module-table tr.row-highlight--green td { background: #ecfccb !important; font-weight: 600; }   /* modules.css:3062 */
.module-table tr.row-highlight--yellow { background: #fef3c7 !important; font-weight: 600; }   /* modules.css:3067 */
.module-table tr.row-highlight--yellow td { background: #fef3c7 !important; font-weight: 600; }   /* modules.css:3067 */
.module-table tr.row-highlight--red { background: #fee2e2 !important; font-weight: 600; }   /* modules.css:3072 */
.module-table tr.row-highlight--red td { background: #fee2e2 !important; font-weight: 600; }   /* modules.css:3072 */
.module-table tr.row-highlight--green-soft { background: #f0fdf4 !important; }   /* modules.css:3077 */
.module-table tr.row-highlight--green-soft td { background: #f0fdf4 !important; }   /* modules.css:3077 */
.module-table tr.row-highlight--red-soft { background: #fef2f2 !important; }   /* modules.css:3082 */
.module-table tr.row-highlight--red-soft td { background: #fef2f2 !important; }   /* modules.css:3082 */
.module-table tr.row-inactive { opacity: 0.4; }   /* modules.css:3086 */
.module-table tr.row-inactive td { opacity: 0.4; }   /* modules.css:3086 */
.module-table th.th-right { text-align: right; }   /* modules.css:3091 */
.module-table td.td-right { text-align: right; }   /* modules.css:3091 */
.module-table th.th-left { text-align: left; }   /* modules.css:3096 */
.module-table td.td-left { text-align: left; }   /* modules.css:3096 */
body .module-table th.td-center { text-align: center !important; }   /* modules.css:3100 */
body .module-table td.td-center { text-align: center !important; }   /* modules.css:3100 */
.module-table tbody td.td-center { text-align: center !important; }   /* modules.css:3100 */
.module-table thead th.td-center { text-align: center !important; }   /* modules.css:3100 */
.module-table th.td-center { text-align: center !important; }   /* modules.css:3100 */
.module-table td.td-center { text-align: center !important; }   /* modules.css:3100 */
.module-table td:has(a.hub-matrix__link) { text-align: center !important; }   /* modules.css:3100 */
.module-table th:has(a.hub-matrix__link) { text-align: center !important; }   /* modules.css:3100 */
.module-table td.td-nearby { text-align: center; }   /* modules.css:3113 */
.module-table--salary tr.subtotal td { background: var(--color-bg-subtle); font-weight: 600; border-bottom: 1px solid var(--color-border); }   /* modules.css:3124 */
.module-table--salary tr.total td { background: var(--color-primary-light); font-weight: 700; color: var(--color-primary-dark); }   /* modules.css:3129 */
.module-table--salary tbody tr:last-child td { border-bottom: 2px solid var(--color-border) !important; }   /* modules.css:3134 */
.module-table { width: 100% !important; border-collapse: collapse !important; border-spacing: 0 !important; table-layout: auto; font-size: 16px; margin: 16px 0 8px; border-top: 1px solid #dbeafe !important; border-bottom: 1px solid #dbeafe !important; border-left: none !important; border-right: none !important; }   /* modules.css:3137 */
.module-table thead { background: #e2e8f0; color: #1e293b; border-bottom: 2px solid #94a3b8; }   /* modules.css:3160 */
.module-table-caption { caption-side: top; text-align: left; font-size: 15px; font-weight: 700; color: #0f172a; background: #f8fafc; padding: 10px 14px; border-left: 4px solid var(--color-primary, #3b82f6); margin-bottom: 0; border-radius: 4px 4px 0 0; }   /* modules.css:3165 */
.module-table caption { caption-side: top; text-align: left; font-size: 15px; font-weight: 700; color: #0f172a; background: #f8fafc; padding: 10px 14px; border-left: 4px solid var(--color-primary, #3b82f6); margin-bottom: 0; border-radius: 4px 4px 0 0; }   /* modules.css:3165 */
.module-table:has(caption) { margin-top: 24px; }   /* modules.css:3179 */
.module-table th { padding: 12px 10px; font-weight: 700; text-align: center; color: #1e293b; border-right: 1px solid #cbd5e1 !important; }   /* modules.css:3182 */
.module-table th:last-child { border-right: none !important; }   /* modules.css:3192 */
.module-table td { padding: 11px 10px; text-align: right; border-bottom: 1px solid var(--color-border-light); color: var(--color-text-body); border-right: 1px solid #dbeafe !important; }   /* modules.css:3197 */
.module-table td:last-child { border-right: none !important; }   /* modules.css:3206 */
.module-table td:first-child { text-align: left; }   /* modules.css:3211 */
.module-table td:first-child:has(a:not(.module-table__link)) { text-align: left; }   /* modules.css:3214 */
.module-table td.td-notes { text-align: left; font-size: inherit !important; color: inherit !important; }   /* modules.css:3217 */
.module-table th.td-notes { text-align: left; font-size: inherit !important; color: inherit !important; }   /* modules.css:3217 */
.module-table td { font-size: inherit; color: inherit; }   /* modules.css:3228 */
.module-table th { font-size: inherit; color: inherit; }   /* modules.css:3228 */
.module-table a:not(.module-table__link) { text-decoration: none; color: var(--color-primary); }   /* modules.css:3246 */
.module-table a:not(.module-table__link):hover { text-decoration: none; color: var(--color-primary-dark); }   /* modules.css:3250 */
.module-table a.module-table__btn { display: inline-block; padding: 6px 10px; border: 1px solid var(--color-border, #cbd5e1); border-radius: 6px; background: var(--color-bg-subtle, #f8fafc); color: var(--color-primary); font-weight: 600; text-decoration: none; transition: background 0.15s ease, border-color 0.15s ease; min-height: 36px; line-height: 1.4; }   /* modules.css:3254 */
.module-table a.module-table__btn:hover { background: var(--color-primary-bg, #eff6ff); border-color: var(--color-primary); text-decoration: none; outline: none; }   /* modules.css:3268 */
.module-table a.module-table__btn:focus-visible { background: var(--color-primary-bg, #eff6ff); border-color: var(--color-primary); text-decoration: none }   /* modules.css:3268 */   /* 🔴 2026-09-23 — 라이브 유효값과 다른 칸을 뺐다 */
.module-table a.module-table__btn:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }   /* modules.css:3275 */
.module-table td:has(> a.module-table__btn) { text-align: center; }   /* modules.css:3279 */
.module-table td:has(> strong > a.module-table__btn) { text-align: center; }   /* modules.css:3279 */
.module-table td:first-child:has(a.module-table__btn) { text-align: center; }   /* modules.css:3279 */
.module-table tbody tr:nth-child(even) { background: var(--color-bg-subtle); }   /* modules.css:3286 */
.module-table tbody tr:hover { background: #f1f5f9; }   /* modules.css:3289 */
.module-table .col-highlight { font-weight: 700; color: #0f172a; }   /* modules.css:3292 */
.module-table thead .col-highlight { color: #92400e; background: #fef3c7 !important; }   /* modules.css:3296 */
.module-table tr.row-highlight td { background: #f9fafb; font-weight: 600; }   /* modules.css:3300 */
.module-table tr.subtotal td { background: var(--color-bg-subtle); font-weight: 600; border-bottom: 1px solid var(--color-border); }   /* modules.css:3304 */
.module-table tr.row-subtotal td { background: var(--color-bg-subtle); font-weight: 600; border-bottom: 1px solid var(--color-border); }   /* modules.css:3304 */
.module-table tr.total td { background: var(--color-primary-light); font-weight: 700; color: var(--color-primary-dark); }   /* modules.css:3310 */
.module-table tbody tr:last-child td { border-bottom: 2px solid var(--color-border) !important; }   /* modules.css:3315 */
.module-table--salary.center-first td:first-child { text-align: center; }   /* modules.css:3318 */
.module-table.center-first td:first-child { text-align: center; }   /* modules.css:3318 */
.module-table--credit-map { background: #ecfdf5; border-left: 4px solid #10b981; padding: 14px 18px; margin: 14px 0; border-radius: 0 6px 6px 0; font-size: 13.5px; line-height: 1.7; }   /* modules.css:3870 */
.module-table__scroll-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: #94a3b8 #f1f5f9; }   /* modules.css:3929 */
.module-table--salary { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: #94a3b8 #f1f5f9; }   /* modules.css:3929 */
.module-table { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: #94a3b8 #f1f5f9; }   /* modules.css:3929 */
.module-table__scroll-wrap { margin: 16px 0 8px; }   /* modules.css:3941 */
.module-table__scroll-wrap > table { margin: 0; }   /* modules.css:3944 */
.module-table__scroll-hint { display: none !important; text-align: center; font-size: 16px !important; font-weight: 700; color: #2563eb !important; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important; line-height: 1.4 !important; padding: 2px 0; margin: -10px 0 32px 0 !important; }   /* modules.css:3947 */
.module-table__scroll-hint--top { margin: 0 0 10px 0 !important; }   /* modules.css:3960 */
.module-table__scroll-wrap + .module-table__scroll-hint:not(.module-table__scroll-hint--top) { margin-top: 14px !important; }   /* modules.css:3963 */
.module-table-wrap + .module-table__scroll-hint:not(.module-table__scroll-hint--top) { margin-top: 14px !important; }   /* modules.css:3963 */
.module-table__scroll-hint--top + .module-table__scroll-wrap { margin-top: 2px !important; }   /* modules.css:3968 */
.module-table__scroll-hint--top + .module-table-wrap { margin-top: 2px !important; }   /* modules.css:3968 */
.module-table__scroll-hint:last-child { margin-bottom: 0 !important; }   /* modules.css:3972 */
.module-table__scroll-hint.scroll-active { display: block !important; }   /* modules.css:3975 */
.module-table--salary { white-space: nowrap !important; }   /* modules.css:3978 */
.module-table--salary td { white-space: nowrap !important; }   /* modules.css:3978 */
.module-table--salary th { white-space: nowrap !important; }   /* modules.css:3978 */
.module-table--salary td { white-space: nowrap !important; }   /* modules.css:3978 */
.module-table__scroll-wrap th { white-space: nowrap !important; }   /* modules.css:3978 */
.module-table__scroll-wrap td { white-space: nowrap !important; }   /* modules.css:3978 */
.module-table--salary th { white-space: nowrap !important; }   /* modules.css:3978 */
.module-table--salary td { white-space: nowrap !important; }   /* modules.css:3978 */
.module-table th { white-space: nowrap !important; }   /* modules.css:3978 */
.module-table td { white-space: nowrap !important; }   /* modules.css:3978 */
.longtail-page .module-table__scroll-wrap table { width: auto !important; min-width: 100% !important; border-collapse: collapse !important; border-spacing: 0 !important; table-layout: auto !important; display: table !important; }   /* modules.css:4000 */
.longtail-page .module-table-wrap table { width: auto !important; min-width: 100% !important; border-collapse: collapse !important; border-spacing: 0 !important; table-layout: auto !important; display: table !important; }   /* modules.css:4000 */
.longtail-page .module-table__scroll-wrap { overflow-x: auto; width: 100%; }   /* modules.css:4013 */
.module-table tr.tr-current td { background: #eff6ff !important; font-weight: 600; }   /* modules.css:4040 */
.module-table tr.tr-current td { background: #eff6ff !important; font-weight: 600; }   /* modules.css:4040 */
.module-table__table tr.tr-current td { background: #eff6ff !important; font-weight: 600; }   /* modules.css:4040 */
.module-table__change-item { background: #fff; border: 1px solid var(--color-border); border-left: 4px solid var(--color-border); border-radius: var(--color-radius-sm); padding: 18px 16px; transition: box-shadow .2s, border-color .2s; }   /* modules.css:4684 */
.module-table__change-item:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.06); }   /* modules.css:4692 */
.module-table__change-item--up { border-left-color: #dc2626; }   /* modules.css:4695 */
.module-table__change-item--down { border-left-color: #059669; }   /* modules.css:4698 */
.module-table__change-item--good { border-left-color: #2563eb; }   /* modules.css:4701 */
.module-table__change-item__header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }   /* modules.css:4704 */
.module-table__change-item__name { font-size: 17px; font-weight: 800; color: var(--color-text-primary); flex: 1; }   /* modules.css:4711 */
.module-table__change-item__badge { font-size: 13px; font-weight: 700; padding: 3px 10px; border-radius: 20px; white-space: nowrap; flex-shrink: 0; }   /* modules.css:4717 */
.module-table__change-item__badge--up { color: #dc2626; background: #fef2f2; }   /* modules.css:4725 */
.module-table__change-item__badge--down { color: #059669; background: #ecfdf5; }   /* modules.css:4729 */
.module-table__change-item__badge--good { color: #2563eb; background: #eff6ff; }   /* modules.css:4733 */
.module-table__change-item__values { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; font-size: 16px; font-weight: 700; }   /* modules.css:4737 */
.module-table__change-item__before { color: var(--color-text-muted); text-decoration: line-through; }   /* modules.css:4745 */
.module-table__change-item__arrow { color: var(--color-text-muted); font-size: 14px; }   /* modules.css:4749 */
.module-table__change-item__after { color: var(--color-text-primary); font-size: 18px; }   /* modules.css:4753 */
.module-table__change-item--up .module-table__change-item__after { color: #dc2626; }   /* modules.css:4757 */
.module-table__change-item--down .module-table__change-item__after { color: #059669; }   /* modules.css:4760 */
.module-table__change-item--good .module-table__change-item__after { color: #2563eb; }   /* modules.css:4763 */
.module-table__change-item__delta { font-size: 13px; font-weight: 700; padding: 2px 8px; border-radius: 4px; white-space: nowrap; margin-left: auto; }   /* modules.css:4766 */
.module-table__change-item__delta--up { color: #dc2626; background: #fef2f2; }   /* modules.css:4775 */
.module-table__change-item__delta--good { color: #2563eb; background: #eff6ff; }   /* modules.css:4779 */
.module-table__change-item__effect { font-size: 16px; font-weight: 600; padding: 8px 12px; border-radius: 6px; margin-bottom: 10px; line-height: 1.5; }   /* modules.css:4783 */
.module-table__change-item__effect--up { background: #fef2f2; color: #991b1b; border-left: 3px solid #dc2626; }   /* modules.css:4793 */
.module-table__change-item__effect--good { background: #eff6ff; color: #1e40af; border-left: 3px solid #3b82f6; }   /* modules.css:4798 */
.module-table__change-item__effect strong { font-weight: 800; }   /* modules.css:4803 */
.module-table__change-item__desc { font-size: 16px; line-height: 1.65; color: var(--color-text-secondary); margin: 0; }   /* modules.css:4806 */
.module-table__change-item__desc strong { color: var(--color-text-primary); font-weight: 600; }   /* modules.css:4813 */
.module-table__change-item__icon { font-size: 20px; line-height: 1; flex-shrink: 0; }   /* modules.css:4817 */
.module-table__change-item__impact { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; }   /* modules.css:4824 */
.module-table__change-item__impact-label { font-size: 16px; /* HBS 09-28 · 12px → 13px · HBY 09-28 · 13px → 16px(같은 규칙 두 벌 함께 · 설명 문장 = 내용 글자) */ font-weight: 600; color: var(--color-text-muted); white-space: nowrap; min-width: 36px; }   /* modules.css:4832 */
.module-table__change-item__impact-bar { flex: 1; height: 6px; background: var(--color-border-light); border-radius: 3px; overflow: hidden; }   /* modules.css:4839 */
.module-table__change-item__impact-fill { height: 100%; border-radius: 3px; transition: width .6s ease-out; }   /* modules.css:4846 */
.module-table__change-item__impact-fill--high { background: linear-gradient(90deg, #ef4444, #dc2626); }   /* modules.css:4851 */
.module-table__change-item__impact-fill--mid { background: linear-gradient(90deg, #fb923c, #f97316); }   /* modules.css:4854 */
.module-table__change-item__impact-fill--low { background: linear-gradient(90deg, #fbbf24, #f59e0b); }   /* modules.css:4857 */
.module-table__change-item__impact-fill--good { background: linear-gradient(90deg, #60a5fa, #3b82f6); }   /* modules.css:4860 */
.module-table__change-item__impact-text { font-size: 13px; font-weight: 700; white-space: nowrap; min-width: 28px; text-align: right; }   /* modules.css:4863 */
.module-table__change-item--up .module-table__change-item__impact-text { color: #dc2626; }   /* modules.css:4870 */
.module-table__change-item--good .module-table__change-item__impact-text { color: #2563eb; }   /* modules.css:4873 */
.module-method-card > .module-table__scroll-wrap { width: 100%; }   /* modules.css:5011 */
.module-table tr.row-current { background: var(--color-primary-light); }   /* modules.css:6037 */
.module-table tr.row-current td { font-weight: 700; color: var(--color-primary-dark); }   /* modules.css:6042 */
.module-section--nearby .module-table td:first-child { text-align: center; }   /* modules.css:6046 */
.module-table td:has(.module-hub-nav__current):not(.td-notes) { text-align: center; }   /* modules.css:6050 */
.module-table td:has(.module-table__link):not(.td-notes) { text-align: center; }   /* modules.css:6050 */
.module-table__link { display: inline-block; font-size: 16px; font-weight: 700; color: var(--color-primary-dark); background: var(--color-primary-light); border: 1.5px solid color-mix(in srgb, var(--color-primary) 35%, transparent); padding: 8px 16px; min-height: 44px; line-height: 26px; border-radius: var(--color-radius-sm); white-space: nowrap; text-decoration: none; box-shadow: 0 1px 3px rgba(0,0,0,.04); transition: background .2s, color .2s, transform .15s, box-shadow .15s; }   /* modules.css:6054 */
.module-table__link:hover { background: var(--color-primary-dark); color: #fff !important; border-color: var(--color-primary-dark); transform: translateY(-1px); box-shadow: 0 3px 10px color-mix(in srgb, var(--color-primary) 30%, transparent); }   /* modules.css:6071 */
.module-content a.module-table__link:hover { background: var(--color-primary-dark); color: #fff !important; border-color: var(--color-primary-dark); transform: translateY(-1px); box-shadow: 0 3px 10px color-mix(in srgb, var(--color-primary) 30%, transparent); }   /* modules.css:6071 */
.module-table__link:active { transform: translateY(0) scale(.97); background: var(--color-primary-dark); border-color: var(--color-primary-dark); color: #fff !important; box-shadow: none; }   /* modules.css:6079 */
.module-content a.module-table__link:active { transform: translateY(0) scale(.97); background: var(--color-primary-dark); border-color: var(--color-primary-dark); color: #fff !important; box-shadow: none; }   /* modules.css:6079 */
.module-table__link:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; box-shadow: 0 0 0 4px var(--color-primary-light); }   /* modules.css:6514 */
.module-table__scroll-wrap > h3 { font-size: 18px !important; font-weight: 700 !important; margin: 24px 0 12px 0 !important; line-height: 1.4 !important; color: #1e293b; }   /* modules.css:6757 */
.module-table-caption { font-size: 16px; font-weight: 700; color: #1e293b; margin: 24px 0 8px 0; }   /* modules.css:6774 */
.longtail-page .module-table { display: table !important; width: 100% !important; table-layout: auto; margin: 16px 0 8px; }   /* modules.css:6844 */
.longtail-page .module-table__scroll-wrap { width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }   /* modules.css:6853 */
.module-content a.module-table__link:hover { text-decoration: none; }   /* modules.css:6951 */
.module-content .module-table { width: 100% !important; min-width: 100%; border-collapse: collapse; margin: 16px 0; }   /* modules.css:6953 */
.module-content .module-table__scroll-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }   /* modules.css:6974 */
.module-content .module-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }   /* modules.css:6974 */
#state-specific-analysis .module-related__card .module-table__link { display: block; margin-top: 8px; width: 100%; text-align: center; pointer-events: none; }   /* modules.css:7013 */
#state-specific-analysis .module-related__card:hover .module-table__link { background: var(--color-primary); color: #fff; border-color: var(--color-primary); transform: translateY(-1px); box-shadow: 0 3px 10px color-mix(in srgb, var(--color-primary) 30%, transparent); }   /* modules.css:7020 */
.module-table tbody tr th[scope="row"] { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7149 */
.module-table tbody tr td { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7149 */
.longtail-page .module-table tbody tr th[scope="row"] { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7149 */
.longtail-page .module-table tbody tr td { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7149 */
.module-table tbody tr:last-child th[scope="row"] { border-bottom: 2px solid #e5e7eb !important; }   /* modules.css:7159 */
.module-table tbody tr:last-child td { border-bottom: 2px solid #e5e7eb !important; }   /* modules.css:7159 */
.longtail-page .module-table tbody tr:last-child th[scope="row"] { border-bottom: 2px solid #e5e7eb !important; }   /* modules.css:7159 */
.longtail-page .module-table tbody tr:last-child td { border-bottom: 2px solid #e5e7eb !important; }   /* modules.css:7159 */
.module-table.hub-matrix tbody tr th[scope="row"] { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7165 */
.module-table.hub-matrix tbody tr td { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7165 */
.longtail-page .module-table.hub-matrix tbody tr th[scope="row"] { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7165 */
.longtail-page .module-table.hub-matrix tbody tr td { border-bottom: 1px solid #e5e7eb !important; }   /* modules.css:7165 */
.longtail-page .module-table__scroll-wrap table.hub-matrix { width: auto !important; min-width: 900px !important; table-layout: auto !important; overflow-x: visible !important; display: table !important; }   /* modules.css:7243 */
.longtail-page .module-table-wrap table.hub-matrix { width: auto !important; min-width: 900px !important; table-layout: auto !important; overflow-x: visible !important; display: table !important; }   /* modules.css:7243 */
.longtail-page .hub-block--rank-x-component .module-table__scroll-wrap table.hub-matrix { min-width: 100% !important; width: auto !important; table-layout: auto !important; }   /* modules.css:7280 */
.longtail-page .hub-block--tis-x-component .module-table__scroll-wrap table.hub-matrix { min-width: 100% !important; width: auto !important; table-layout: auto !important; }   /* modules.css:7280 */
.longtail-page .hub-block--rank-x-type .module-table__scroll-wrap table.hub-matrix { min-width: 100% !important; width: auto !important; table-layout: auto !important; }   /* modules.css:7280 */
.longtail-page .hub-block--state-x-service .module-table__scroll-wrap table.hub-matrix { min-width: 100% !important; width: auto !important; table-layout: auto !important; }   /* modules.css:7280 */
.module-section--scenarios .module-table { width: 100% !important; margin: 16px 0 !important; table-layout: auto !important; }   /* modules.css:7395 */
.longtail-page .module-section--scenarios .module-table { width: 100% !important; margin: 16px 0 !important; table-layout: auto !important; }   /* modules.css:7395 */
.module-section--scenarios .module-table th { padding: 10px 12px !important; text-align: right !important; font-size: 15px !important; }   /* modules.css:7403 */
.module-section--scenarios .module-table td { padding: 10px 12px !important; text-align: right !important; font-size: 15px !important; }   /* modules.css:7403 */
.longtail-page .module-section--scenarios .module-table th { padding: 10px 12px !important; text-align: right !important; font-size: 15px !important; }   /* modules.css:7403 */
.longtail-page .module-section--scenarios .module-table td { padding: 10px 12px !important; text-align: right !important; font-size: 15px !important; }   /* modules.css:7403 */
.module-section--scenarios .module-table thead th { background: #1a73e8 !important; color: #fff !important; text-align: center !important; }   /* modules.css:7411 */
.longtail-page .module-section--scenarios .module-table thead th { background: #1a73e8 !important; color: #fff !important; text-align: center !important; }   /* modules.css:7411 */
.module-section--scenarios .module-table tbody th[scope="row"] { text-align: left !important; background: #f9fafb !important; font-weight: 600 !important; color: #111827 !important; }   /* modules.css:7417 */
.longtail-page .module-section--scenarios .module-table tbody th[scope="row"] { text-align: left !important; background: #f9fafb !important; font-weight: 600 !important; color: #111827 !important; }   /* modules.css:7417 */
.module-table--compact { font-size: 14px; }   /* modules.css:7542 */
.module-table--compact th { padding: 8px 10px; }   /* modules.css:7547 */
.module-table--compact td { padding: 8px 10px; }   /* modules.css:7547 */
.module-table__total td { font-weight: 700; border-top: 2px solid #94a3b8; background: #f8fafc; }   /* modules.css:7557 */
.module-table__net td { font-weight: 700; border-top: 2px solid #22c55e; background: #f0fdf4; color: #15803d; }   /* modules.css:7564 */
.module-section--state-comparison .module-table td:first-child { text-align: left !important; vertical-align: middle; }   /* modules.css:7572 */
.module-section--state-comparison .module-table th:first-child { text-align: left !important; vertical-align: middle; }   /* modules.css:7572 */
.module-table td:first-child:not(.td-notes) { text-align: center; }   /* modules.css:7666 */
.module-table th:first-child:not(.td-notes) { text-align: center; }   /* modules.css:7670 */
.module-table--full { margin-top: 32px; }   /* modules.css:7673 */
.module-table__ico-cell { display: inline-flex; align-items: center; gap: 6px }   /* modules.css:9875 */   /* 🔴 2026-09-23 — 라이브 유효값과 다른 칸을 뺐다 */
.module-table__ico-cell .core-issuer-ico.module-table__cell-ico { width: 20px; height: 20px; flex: 0 0 auto; border-radius: 4px; }   /* modules.css:9877 */
.module-table__ico-cell .core-issuer-ico--txt.module-table__cell-ico { width: 20px; height: 20px; font-size: 13px; /* HBS 09-28 · 8.5px → 13px(20px 글자 아이콘 · 넘침 확인 대상 · 같은 규칙 두 벌 함께) */ border-radius: 4px; }   /* modules.css:10032 */
.module-table td:has(.module-table__ico-cell) { text-align: left !important; }   /* modules.css:10085 */
.module-table__table td:has(.module-table__ico-cell) { text-align: left !important; }   /* modules.css:10085 */
.module-table__ico-cell { justify-content: flex-start; }   /* modules.css:10089 */
.module-review-links .module-table__link::after { content:' →'; margin-left:5px; font-weight:700; opacity:.6; display:inline-block; transition:transform .18s ease, opacity .18s ease; }   /* modules.css:11467 */
.module-review-links .module-table__link:hover::after { opacity:1; transform:translateX(2px); }   /* modules.css:11468 */
.module-review-links a.module-table__link.module-review-links__cta { border-radius:999px; padding:10px 20px; background:linear-gradient(135deg, var(--color-primary,#1a73e8), var(--color-primary-dark,#1557b0)); color:#fff; border:1.5px solid transparent; font-weight:800; }   /* modules.css:11483 */
.module-review-links a.module-table__link.module-review-links__cta:hover { background:var(--color-primary-dark,#1557b0); color:#fff; }   /* modules.css:11490 */
.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.module-content a.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.module-table a.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.module-info-box.module-info-box a.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.entry-content .module-section a.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.module-table a.dp-prodlink::after { content: none; }   /* modules.css:11627 */
.module-table td:has(a.dp-prodlink) { text-align: left !important; }   /* modules.css:11629 */
.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.module-content a.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.module-table a.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.module-info-box.module-info-box a.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.entry-content .module-section a.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.dp-prodlink:not(.module-table__link):hover::after { opacity: 1; transform: translateX(2px); }   /* modules.css:11643 */
.dp-prodlink:not(.module-table__link):active { opacity: .75; }   /* modules.css:11645 */
.module-table td.module-table__cell--bar { position: relative; }   /* modules.css:11683 */
.module-table__cellbar { position: absolute; top: 2px; left: 0; bottom: 2px; background: rgba(26, 115, 232, .12); border-radius: 0 4px 4px 0; z-index: 0; pointer-events: none; }   /* modules.css:11688 */
.module-table__cellbar-text { position: relative; z-index: 1; display: block; }   /* modules.css:11696 */

/* 🔴 2026-09-23 사용자 지시 「캡션이 … 위에 고정으로 있어야지」 — 캡션을 표 밖(스크롤 감싸개 위)으로 옮기면서
   전에 `.module-table:has(caption) { margin-top:24px }` 가 주던 위 여백을 캡션 요소가 대신 받는다. 그 밖 모양은 기존 규칙 그대로. */
.module-table__caption { margin-top: 24px; display: block; }

/* 🔴 2026-09-29 지휘자 — 사용자 「테이블에서 현재 페이지의 영역이라는 행은 화살표 색상이라든지, 행 배경색을 약간 다르게 한다든지 구분을 좀 더 줘」
   강조 행(rows[].highlight → .module-table__row--best · module.jsonc:65 «강조 행 개념 통합») = 연한 강조색 배경 + 행 머리(▶ 포함) 강조색 · 굵기는 기존 :325 유지. 되돌리기 = style.css.bak_20260929-지휘자-현재행 */
.module-table__row--best > th, .module-table__row--best > td { background:var(--acc-s); }
.module-table__row--best > th { color:var(--acc-i); font-weight:700; }

/* ── 조 AL2(11-04) 표 변형 보강 — 새 클래스만 추가(기존 표 규칙 바이트 동일) ──
   --spec = 사양표(행 머리 왼쪽 · 폭 38% · 묶음 이름 줄 __row--group · 묶음 이름 __group-title · 셋째 칸 = 비교 값) · --sticky-first = 첫 칸(행 머리)을 가로로 밀어도 고정 */
.module-table.module-table--spec { width: 100%; }
.module-table.module-table--spec th[scope=row] { text-align: left; width: 38%; font-weight: 600; background: #f9fafb; text-transform: none; letter-spacing: 0; font-size: 14px; color: #374151; }
.module-table.module-table--spec td { text-align: left; }
.module-table.module-table--spec th[scope=col] { text-align: left; }
.module-table.module-table--spec td:not(.module-table__cell--center):not(.module-table__cell--note):not(:first-child) { text-align: left; }   /* 숫자 칸을 오른쪽 맞춤하는 일반 규칙(같은 :not 꼴)을 사양표 변형이 이기도록 — 판매가·중량 칸이 오른쪽으로 가던 것(judge-BL ② 4칸) */   /* 조 BT B11(11-05): 사양표 머리 칸도 왼쪽(전엔 틀 안 인라인 style 이던 값을 변형 규칙으로) */
.module-table.module-table--spec .module-table__row--group td { background: #eef2f7; text-align: left; }
.module-table__group-title { margin: 0 !important; font-size: .95rem; }
.module-table.module-table--sticky-first th[scope=row] { position: sticky; left: 0; background: #fff; z-index: 1; }

/* 표 칸 안 제품 사진·구매 버튼(2026-11-06 사용자 «제품 사진은 항상 테이블 셀 내용에서 가운데 정렬 · 구매 버튼도 전체 너비로 가운데 정렬») — 표 하나하나가 아니라 이 모듈 한 곳: 칸 안 그림은 가운데 · 칸 안 구매 버튼(module-cta)은 칸 전체 너비 + 글자 가운데 */
.module-table td img, .module-table th img { display: block; margin-left: auto; margin-right: auto; max-width: 100%; height: auto; }
.module-table td a.module-cta, .module-table th a.module-cta { display: flex; align-items: center; justify-content: center; width: 100%; box-sizing: border-box; text-align: center; }
/* 조 DB(11-06 사용자 «표 구매 버튼 글자 잘림»): 칸 안 구매 버튼 = 글자 16px · 안쪽 좌우 여백 6px(기본 30px) · 줄바꿈 허용 · 잘림 0 · 위아래 바깥 여백 0 — 칸 폭(100~170px)보다 글자가 길어도 전부 보인다 */
.module-table td a.module-cta, .module-table th a.module-cta { margin: 0 !important; padding: 10px 6px !important; min-height: 44px; font-size: 16px !important; line-height: 1.3; white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }

/* core/modules/display/info-box/style.css */

.module-info-box__body { margin: 0 0 8px; color: #334155; font-size: 1rem; line-height: 1.7; margin-bottom: 0; }
@media (max-width: 640px) {
}
.module-info-box__bracket-warn, .module-info-box__briefing.module-info-box__briefing--warn {
    background: #fff7ed;
    border-left: 4px solid #f97316;
    padding: 16px 20px;
    margin: 20px 0;
    border-radius: 8px;
    font-size: 16px;
    line-height: 1.8;
    color: #7c2d12;
}
.module-info-box__bracket-warn p, .module-info-box__briefing.module-info-box__briefing--warn p {
    margin: 0;
    color: #7c2d12;
}
.module-info-box__bracket-warn strong, .module-info-box__briefing.module-info-box__briefing--warn strong {
    font-weight: 700;
    color: #9a3412;
}
.module-info-box strong, .module-info-box__tip strong, .module-info-box__warning strong {
    font-weight: 700;
}
.module-info-box a, .module-info-box__tip a, .module-info-box__warning a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.module-info-box.module-info-box a.module-info-box__tlink, .module-info-box.module-info-box a.module-info-box__tlink:hover, .module-info-box.module-info-box a.module-info-box__tlink:focus-visible, .module-info-box.module-info-box a.module-info-box__matchup-triad-cell, .module-info-box.module-info-box a.module-info-box__matchup-triad-cell:hover, .module-info-box.module-info-box a.module-info-box__matchup-triad-cell:focus-visible, .module-info-box__toc-item--level-2 a.module-info-box__tlink:hover, .module-info-box__toc-item--level-2 a.module-info-box__matchup-triad-cell:hover, .module-info-box__toc-item--level-3 a.module-info-box__tlink:hover, .module-info-box__toc-item--level-3 a.module-info-box__matchup-triad-cell:hover, .module-info-box__related-card-title a.module-info-box__tlink:hover, .module-info-box__related-card-title a.module-info-box__matchup-triad-cell:hover {
  text-decoration: none;
}
.module-info-box__briefing:has(.module-info-box__briefing-body:empty) { display:none; }
.module-info-box__briefing { background:#fff; border:1px solid var(--color-border); border-radius:var(--color-radius-md); padding:20px 22px; margin-bottom:16px; line-height:1.75; font-size:16px; color:var(--color-text-body); position:relative; overflow:hidden; }
.module-info-box__briefing::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; }
.module-info-box__title { margin:0 0 8px; font-weight:700; color:#1e293b; font-size:16px; }
.module-info-box__body { margin:0 0 8px; color:#334155; }
.module-info-box {
    background: #eff6ff;
    border-left: 4px solid #3b82f6;
    border-radius: 8px;
    padding: 16px 20px;
    margin: 20px 0;
    font-size: 16px;
    line-height: 1.8;
    color: #1e3a5f;
}
.module-info-box__title {
    font-size: 1rem;
    font-weight: 700;
    margin: 0 0 8px 0;
    color: inherit;
}
.module-info-box__body {
    font-size: 1rem;       
    line-height: 1.7;
    margin: 0;
    color: inherit;
}
.module-info-box > *:last-child, .module-info-box__body > *:last-child {
    margin-bottom: 0 !important;
}
.module-info-box strong { font-weight: 700; color: #111827; }
.module-info-box.module-info-box a { color: #1a73e8; text-decoration: underline; }
.module-info-box.module-info-box a:hover { color: #c2410c; text-decoration: underline; }
.module-info-box.module-info-box--amber { background: #fef3c7; border-left-color: #f59e0b; color: #78350f; }
.module-info-box__result-card .module-info-box__briefing, .module-info-box__result-card .module-info-box__lt-note {
    text-align: left;
}
.module-info-box__link-grid + .module-info-box__title { margin-top: 1.75rem; }
.module-info-box__briefing > *:last-child, .module-info-box__briefing-body > *:last-child, .module-info-box > *:last-child, .module-info-box__faq-a > *:last-child, .module-info-box__key-facts-core-text > *:last-child, .module-info-box__quick-answer-content > *:last-child, .module-info-box__answer-first > *:last-child, .module-info-box__answer-first-answer > *:last-child, .module-info-box__highlight > *:last-child, .module-info-box__page-header > *:last-child {
    margin-bottom: 0;
}
.module-info-box__briefing, .module-info-box__briefing {
    background: #f8fafc;
    border-left: 4px solid #3b82f6;
    border-radius: 8px;
    padding: 16px 20px;
    margin: 16px 0;
}
.module-info-box__briefing:has(.module-info-box__briefing-body:empty) {
  display: none;
}
.module-info-box__briefing {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--color-radius-md);
  padding: 20px 22px;
  margin-bottom: 16px;
  line-height: 1.75;
  font-size: 16px;
  color: var(--color-text-body);
  position: relative;
  overflow: hidden;
}
.module-info-box__briefing::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
}
.module-info-box__title {
  margin: 0 0 8px;
  font-weight: 700;
  color: #1e293b;
  font-size: 16px;   
}
.module-info-box__body {
  margin: 0 0 8px;
  color: #334155;
}
@media (max-width: 640px) {
.module-info-box__briefing {
    padding: 16px 14px;
  }
}
.module-info-box__content .module-info-box { background: #eff6ff; border-left: 4px solid #3b82f6; border-radius: 8px; padding: 16px 20px; margin: 20px 0; font-size: 16px; line-height: 1.8; color: #1e3a5f; }
.module-info-box ol, .module-info-box ul { margin: 0.5rem 0 1rem; padding-left: 1.25rem; }
.module-info-box .module-info-box__calc-list--links a { font-size: 16px; }
.module-info-box__briefing h3, .module-info-box__chart-wrap h3, .module-info-box__calc-results h3, .module-info-box__calc-result h3 {
  font-size: 1.05rem !important;
  font-weight: 600 !important;
  color: #1e293b !important;
  margin: 0 0 8px 0 !important;
  line-height: 1.3 !important;
  text-transform: none !important;
}
.module-info-box__single-calc h3, .module-info-box__single-longtail h3, .module-info-box__calc-page-content h3, .module-info-box__calc-section h3, .module-info-box__dacalc-section h3, .module-info-box__section h3, .module-info-box h3 {
  font-size: 1.25rem;
  font-weight: 600;
  color: #1e293b;
  margin: 0 0 0.5rem;
  line-height: 1.35;
  text-transform: none;
}
.module-info-box__body {
  margin-bottom: 0;
}
.module-info-box--notice .module-info-box__body p { margin: 0 0 1em; }
.module-info-box--notice .module-info-box__body p:last-child { margin-bottom: 0; }
.module-info-box--notice-imminent .module-info-box__title { color: #b91c1c; }
.module-info-box.module-info-box a.module-info-box__deposit-cardlist-item, .module-info-box.module-info-box .module-info-box__deposit-cardlist a { text-decoration:none; color:inherit; }
.module-info-box:has(.module-info-box__deposit-cardlist) { margin-bottom: 18px; }
.module-info-box:has(> .module-info-box__body > .module-info-box__deposit-ctxlink) {
  background: transparent; border: 0; padding: 0; margin: 0;
}
.module-info-box:has(> .module-info-box__body > .module-info-box__deposit-cardlist) {
  background: transparent; border: 0; padding: 0; margin: 0;
}

/* ── 코너 링크 화살표 규칙(지휘자 일괄 · 2026-09-07) ── */
/* 🔴 title 이 없는 경우 위 여백이 커지던 것(사용자 지적 · 재구성이 지워 재적용) */
.module-info-box:not(:has(.module-info-box__title)) > :first-child { margin-top: 0; }
.module-info-box__body > :first-child { margin-top: 0; }
.module-info-box__body > :last-child { margin-bottom: 0; }

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-info-box__section-body .module-info-box--note { font-size: 14px; color: #6b7280; font-style: italic; padding: 8px 12px; background: #f9fafb; border-radius: 6px; border-left: 3px solid #d1d5db; }
  .module-info-box__briefing-title { font-weight: 700; font-size: 17px; margin-bottom: 10px; display: flex; align-items: center; gap: 6px; }
  .module-info-box__briefing-body { font-size: 16px; color: var(--color-text-body); line-height: 1.75; }
  .module-info-box__briefing-body strong { color: var(--color-text-primary); font-weight: 600; }
  .module-info-box__briefing-list { margin-bottom: 0; }
  .module-info-box__briefing-recommend { font-weight: 600; margin-top: 12px; }
  .module-info-box__briefing--explain::before { background: #3b82f6; }
  .module-info-box__briefing--explain .module-info-box__briefing-title { color: #1d4ed8; }
  .module-info-box__briefing--tip::before { background: #10b981; }
  .module-info-box__briefing--tip .module-info-box__briefing-title { color: #047857; }
  .module-info-box__briefing--tip .module-info-box__briefing-cta { display: inline-block; margin-top: 10px; padding: 12px 18px; min-height: 44px; font-size: 16px; font-weight: 600; border-radius: var(--color-radius-sm); text-decoration: none; color: #047857; border: 1.5px solid #10b981; background: #ecfdf5; transition: background .2s, color .2s; }
  .module-info-box__briefing--tip .module-info-box__briefing-cta:hover { background: #047857; color: #fff; }
  .module-info-box__briefing-links { list-style: none; padding: 0; margin: 10px 0 0; display: flex; flex-direction: column; gap: 8px; }
  .module-info-box__briefing-links li { background: #fff; border: 1px solid var(--color-border); border-left: 3px solid var(--color-primary); border-radius: 6px; transition: border-color .2s, box-shadow .2s; }
  .module-info-box__briefing-links li:hover { border-left-color: var(--color-primary-dark); box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
  .module-info-box__briefing-links a { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; color: var(--color-primary); text-decoration: none; font-weight: 700; font-size: 15px; }
  .module-info-box--color-blue { margin-top: 1.25rem; padding: 12px 16px; background: #f0f9ff; border-left: 4px solid #3b82f6; border-radius: 4px; font-size: 14px; line-height: 1.6; }
  .module-info-box--rpp { margin: 16px 0; padding: 14px 18px; background: linear-gradient(135deg, #ecfdf5, #d1fae5); border-left: 4px solid #059669; border-radius: 8px; }
  .module-info-box--milestone { margin: 20px 0; padding: 16px 20px; background: linear-gradient(135deg, #f0f9ff, #e0f2fe); border-left: 4px solid #0284c7; border-radius: 8px; }
  .module-info-box--tfd { margin: 16px 0; padding: 14px 18px; background: linear-gradient(135deg, #fef3c7, #fde68a); border-left: 4px solid #d97706; border-radius: 8px; }
  .module-info-box--position { background: #f8fafc; border-left: 4px solid #3b82f6; padding: 16px 20px; margin: 18px 0; border-radius: 0 8px 8px 0; font-size: 14.5px; line-height: 1.65; }
  .module-info-box--fica { background: #fef3c7; border-left: 4px solid #f59e0b; padding: 14px 18px; margin: 14px 0; border-radius: 0 6px 6px 0; font-size: 14px; line-height: 1.6; }
  .module-info-box--state-arb { background: #fef3c7; border-left: 4px solid #d97706; padding: 14px 18px; margin: 14px 0; border-radius: 0 6px 6px 0; font-size: 13.5px; line-height: 1.7; }
  .module-info-box__title--emerald { color: #064e3b; margin-bottom: 6px; }
  .module-info-box__title--amber { color: #78350f; margin-bottom: 6px; }
  .module-info-box__body--last { margin-bottom: 0; }
  .module-info-box__body--amber { color: #78350f; }
  .module-info-box__list { margin: 0; padding-left: 18px; color: #065f46; }
  .module-info-box__list li { margin: 3px 0; }
  .module-info-box__desc { font-size: 0.95rem; color: #4b5563; line-height: 1.5; margin: 0 0 16px; }
  .module-info-box--plain { background: #fafbfc; border: 1px solid #e5e7eb; border-left: 1px solid #e5e7eb; color: #1e293b; }
  .module-info-box--blue { background: #eff6ff; border-left-color: #3b82f6; color: #1e3a5f; }
  .module-info-box--green { background: #f0fdf4; border-left-color: #22c55e; color: #14532d; }
  .module-info-box--orange { background: #fff7ed; border-left-color: #f97316; color: #7c2d12; }
  .module-info-box--red { background: #fef2f2; border-left-color: #ef4444; color: #7f1d1d; }
  .module-info-box--yellow { background: #fefce8; border-left-color: #eab308; color: #713f12; }
  .module-info-box--purple { background: #faf5ff; border-left-color: #a855f7; color: #581c87; }
  .module-info-box--sky { background: #f0f9ff; border-left-color: #0284c7; color: #075985; }
  .module-info-box--mint { background: #f0fdfa; border-left-color: #14b8a6; color: #134e4a; }
  .module-info-box--gray { background: #f8fafc; border-left-color: #64748b; color: #334155; }
  .module-info-box--dashed { border-style: dashed; border-left-style: solid; }
  .module-info-box--compact { padding: 12px 16px; font-size: 14px; }
  .module-info-box__briefing-title, .module-info-box__briefing-title { font-size: 1rem; font-weight: 700; color: #1e293b; margin: 0 0 8px 0; }
  .module-info-box__briefing-body, .module-info-box__briefing-body { font-size: 0.95rem; color: #475569; line-height: 1.7; margin: 0; }
  .module-info-box__briefing--tip, .module-info-box__briefing--tip { background: #f0fdf4; border-left-color: #22c55e; }
  .module-info-box__briefing--explain, .module-info-box__briefing--explain { background: #faf5ff; border-left-color: #a855f7; }
  .module-info-box--interactive { background: #f8fafc; border: 1px dashed #94a3b8; border-radius: 8px; padding: 16px 20px; margin: 16px 0; text-align: center; }
  .module-info-box__calc-toggle-btn:focus-visible, .module-info-box__calc-btn:focus-visible, .module-info-box__calc-input:focus-visible, .module-info-box__calc-select:focus-visible, .module-info-box__share-buttons button:focus-visible, .module-info-box__briefing-cta:focus-visible, .module-info-box__briefing-links a:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  .module-info-box__calc-btn, .module-info-box__calc-toggle-btn, .module-info-box__briefing-cta, .module-info-box__share-buttons button { transition: none !important; }
}
  .module-info-box--insight { background: #fff; border: 1px solid var(--color-border); border-left: 4px solid var(--color-primary); border-radius: var(--color-radius-sm); padding: 20px; margin-bottom: 14px; transition: box-shadow .2s; }
  .module-info-box--insight:hover { box-shadow: var(--color-shadow-sm); }
  .module-info-box--insight h3 { font-size: 16px; font-weight: 700; color: var(--color-text-primary); margin: 0 0 8px; display: flex; align-items: center; gap: 8px; }
  .module-info-box--insight h3::before { content: '💡'; font-size: 18px; }
  .module-info-box--insight p { font-size: 15px; line-height: 1.8; color: var(--color-text-body); margin: 0 0 8px; }
  .module-info-box--insight a { font-size: 15px; font-weight: 600; color: var(--color-primary); text-decoration: none; }
  .module-info-box--insight a:hover { text-decoration: underline; }
@media (max-width: 768px) {
  .module-info-box--insight { padding: 16px; }
}
@media print {
  .module-info-box__result-card--lt, .module-info-box__result-card--derived, .module-info-box__steps-item, .module-info-box--insight { border: 1px solid #ccc; box-shadow: none; break-inside: avoid; }
}
  .module-info-box--callout { border-radius: 8px; padding: 16px 20px; margin: 16px 0; font-size: 16px; line-height: 1.8; }
  .module-info-box--positive { background: #f0fdf4; border-left: 4px solid #22c55e; color: #14532d; }
  .module-info-box--warning { background: #fefce8; border-left: 4px solid #eab308; color: #713f12; }
  .module-info-box--note { font-size: 14px; color: #6b7280; margin: 12px 0; line-height: 1.6; }
  .module-info-box--benefits { border-left: 4px solid #3b82f6; }
  .module-info-box--planning { border-left: 4px solid #8b5cf6; }
  .module-info-box--tax { border-left: 4px solid #f59e0b; }
  .module-info-box--wealth { border-left: 4px solid #059669; }
@media (max-width: 640px) {
  .module-info-box--callout { padding: 12px 16px; }
}
  .module-info-box__heading { margin-top: 0; }
  .module-info-box--notice-imminent { border-left-width: 6px; background: #fee2e2; }
/* ── 동기화 블록 끝 (sync-live) ── */


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
.module-section__body .module-info-box--note { font-size: 14px; color: #6b7280; font-style: italic; padding: 8px 12px; background: #f9fafb; border-radius: 6px; border-left: 3px solid #d1d5db; }   /* components.css:137 */
.module-info-box .module-link-grid { padding-left: 0; margin: 8px 0 0; }   /* modules.css:1118 */
.module-link-grid + .module-info-box__title { margin-top: 1.75rem; }   /* modules.css:1130 */
.module-info-box .module-link-grid__pill { color: #1e40af; text-decoration: none; }   /* modules.css:1132 */
.module-info-box a.module-link-grid__pill { color: #1e40af; text-decoration: none; }   /* modules.css:1132 */
.module-info-box .module-link-grid__pill:hover { color: #1e40af; background: #eff6ff; border-color: #2563eb; text-decoration: none; }   /* modules.css:1137 */
.module-info-box a.module-link-grid__pill:hover { color: #1e40af; background: #eff6ff; border-color: #2563eb; text-decoration: none; }   /* modules.css:1137 */
.module-info-box a.module-link-grid__card { color: #1e293b; text-decoration: none; }   /* modules.css:1144 */
.module-info-box a.module-link-grid__card:hover { color: #1e293b; text-decoration: none; }   /* modules.css:1144 */
.module-info-box .module-link-grid__card-cta { color: #2563eb; }   /* modules.css:1149 */
.module-info-box .module-link-grid__card { text-decoration: none; }   /* modules.css:1189 */
.module-info-box .module-link-grid__card:hover { text-decoration: none; }   /* modules.css:1189 */
.module-info-box--color--blue { margin-top: 1.25rem; padding: 12px 16px; background: #f0f9ff; border-left: 4px solid #3b82f6; border-radius: 4px; font-size: 14px; line-height: 1.6; }   /* modules.css:3774 */
.module-content .module-info-box { background: #eff6ff; border-left: 4px solid #3b82f6; border-radius: 8px; padding: 16px 20px; margin: 20px 0; font-size: 16px; line-height: 1.8; color: #1e3a5f; }   /* modules.css:6978 */
.module-info-box .module-calc-list--links { padding-left: 0; }   /* modules.css:7036 */
.module-info-box .module-calc-list--links a { font-size: 16px; }   /* modules.css:7038 */
.module-info-box__body .module-cta--small { margin-top: 8px; margin-bottom: 2px; }   /* modules.css:9982 */
.module-info-box--notice .module-cta--small { display: block; width: 100%; text-align: center; }   /* modules.css:9995 */
.module-info-box.module-info-box a.deposit-cardlist__item { text-decoration:none; color:inherit; }   /* modules.css:11587 */
.module-info-box.module-info-box .deposit-cardlist a { text-decoration:none; color:inherit; }   /* modules.css:11587 */
.module-info-box.module-info-box a.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.module-info-box:has(.deposit-cardlist) { margin-bottom: 18px; }   /* modules.css:11632 */
.module-info-box.module-info-box a.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.module-info-box:has(> .module-info-box__body > .deposit-ctxlink) { background: transparent; border: 0; padding: 0; margin: 0; }   /* modules.css:11675 */
.module-info-box:has(> .module-info-box__body > .deposit-cardlist) { background: transparent; border: 0; padding: 0; margin: 0; }   /* modules.css:11679 */


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
.module-section__body .module-info-box--note { font-size: 14px; color: #6b7280; font-style: italic; padding: 8px 12px; background: #f9fafb; border-radius: 6px; border-left: 3px solid #d1d5db; }   /* components.css:137 */
.module-info-box strong { font-weight: 700; }   /* components.css:347 */
.module-info-box a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }   /* components.css:352 */
.module-info-box { background: #eff6ff; border-left: 4px solid #3b82f6; border-radius: 8px; padding: 16px 20px; margin: 20px 0; font-size: 16px; line-height: 1.8; color: #1e3a5f; }   /* modules.css:41 */
.module-info-box__title { font-weight: 700 }   /* modules.css:56 */   /* 🔴 2026-09-23 — 라이브 유효값과 다른 칸을 뺐다 */
.module-info-box__desc { font-size: 0.95rem; color: #4b5563; line-height: 1.5; margin: 0 0 16px; }   /* modules.css:64 */
.module-info-box__body { font-size: 1rem; line-height: 1.7 }   /* modules.css:70 */   /* 🔴 2026-09-23 — 라이브 유효값과 다른 칸을 뺐다 */
.module-info-box > *:last-child { margin-bottom: 0 !important; }   /* modules.css:76 */
.module-info-box__body > *:last-child { margin-bottom: 0 !important; }   /* modules.css:76 */
.module-info-box strong { font-weight: 700; color: #111827; }   /* modules.css:81 */
.module-info-box.module-info-box a { color: #1a73e8; text-decoration: underline; }   /* modules.css:82 */
.module-info-box.module-info-box a:hover { color: #c2410c; text-decoration: underline; }   /* modules.css:84 */
.module-info-box--plain { background: #fafbfc; border: 1px solid #e5e7eb; border-left: 1px solid #e5e7eb; color: #1e293b; }   /* modules.css:85 */
.module-info-box--blue { background: #eff6ff; border-left-color: #3b82f6; color: #1e3a5f; }   /* modules.css:93 */
.module-info-box--green { background: #f0fdf4; border-left-color: #22c55e; color: #14532d; }   /* modules.css:94 */
.module-info-box--orange { background: #fff7ed; border-left-color: #f97316; color: #7c2d12; }   /* modules.css:95 */
.module-info-box--red { background: #fef2f2; border-left-color: #ef4444; color: #7f1d1d; }   /* modules.css:96 */
.module-info-box--yellow { background: #fefce8; border-left-color: #eab308; color: #713f12; }   /* modules.css:97 */
.module-info-box.module-info-box--amber { background: #fef3c7; border-left-color: #f59e0b; color: #78350f; }   /* modules.css:98 */
.module-info-box--purple { background: #faf5ff; border-left-color: #a855f7; color: #581c87; }   /* modules.css:100 */
.module-info-box--sky { background: #f0f9ff; border-left-color: #0284c7; color: #075985; }   /* modules.css:101 */
.module-info-box--mint { background: #f0fdfa; border-left-color: #14b8a6; color: #134e4a; }   /* modules.css:102 */
.module-info-box--gray { background: #f8fafc; border-left-color: #64748b; color: #334155; }   /* modules.css:103 */
.module-info-box--dashed { border-style: dashed; border-left-style: solid; }   /* modules.css:104 */
.module-info-box--compact { padding: 12px 16px; font-size: 14px; }   /* modules.css:107 */
.module-info-box .module-link-grid { padding-left: 0; margin: 8px 0 0; }   /* modules.css:1118 */
.module-link-grid + .module-info-box__title { margin-top: 1.75rem; }   /* modules.css:1130 */
.module-info-box .module-link-grid__pill { color: #1e40af; text-decoration: none; }   /* modules.css:1132 */
.module-info-box a.module-link-grid__pill { color: #1e40af; text-decoration: none; }   /* modules.css:1132 */
.module-info-box .module-link-grid__pill:hover { color: #1e40af; background: #eff6ff; border-color: #2563eb; text-decoration: none; }   /* modules.css:1137 */
.module-info-box a.module-link-grid__pill:hover { color: #1e40af; background: #eff6ff; border-color: #2563eb; text-decoration: none; }   /* modules.css:1137 */
.module-info-box a.module-link-grid__card { color: #1e293b; text-decoration: none; }   /* modules.css:1144 */
.module-info-box a.module-link-grid__card:hover { color: #1e293b; text-decoration: none; }   /* modules.css:1144 */
.module-info-box .module-link-grid__card-cta { color: #2563eb; }   /* modules.css:1149 */
.module-info-box .module-link-grid__card { text-decoration: none; }   /* modules.css:1189 */
.module-info-box .module-link-grid__card:hover { text-decoration: none; }   /* modules.css:1189 */
.module-info-box > *:last-child { margin-bottom: 0; }   /* modules.css:1477 */
.module-info-box--interactive { background: #f8fafc; border: 1px dashed #94a3b8; border-radius: 8px; padding: 16px 20px; margin: 16px 0; text-align: center; }   /* modules.css:2113 */
.module-info-box--color--blue { margin-top: 1.25rem; padding: 12px 16px; background: #f0f9ff; border-left: 4px solid #3b82f6; border-radius: 4px; font-size: 14px; line-height: 1.6; }   /* modules.css:3774 */
.module-info-box--rpp { margin: 16px 0; padding: 14px 18px; background: linear-gradient(135deg, #ecfdf5, #d1fae5); border-left: 4px solid #059669; border-radius: 8px; }   /* modules.css:3823 */
.module-info-box--milestone { margin: 20px 0; padding: 16px 20px; background: linear-gradient(135deg, #f0f9ff, #e0f2fe); border-left: 4px solid #0284c7; border-radius: 8px; }   /* modules.css:3832 */
.module-info-box--tfd { margin: 16px 0; padding: 14px 18px; background: linear-gradient(135deg, #fef3c7, #fde68a); border-left: 4px solid #d97706; border-radius: 8px; }   /* modules.css:3841 */
.module-info-box--position { background: #f8fafc; border-left: 4px solid #3b82f6; padding: 16px 20px; margin: 18px 0; border-radius: 0 8px 8px 0; font-size: 14.5px; line-height: 1.65; }   /* modules.css:3850 */
.module-info-box--fica { background: #fef3c7; border-left: 4px solid #f59e0b; padding: 14px 18px; margin: 14px 0; border-radius: 0 6px 6px 0; font-size: 14px; line-height: 1.6; }   /* modules.css:3861 */
.module-info-box--state-arb { background: #fef3c7; border-left: 4px solid #d97706; padding: 14px 18px; margin: 14px 0; border-radius: 0 6px 6px 0; font-size: 13.5px; line-height: 1.7; }   /* modules.css:3879 */
.module-info-box__title { margin: 0 0 8px; font-weight: 700; color: #1e293b; font-size: 16px; }   /* modules.css:3888 */
.module-info-box__title--emerald { color: #064e3b; margin-bottom: 6px; }   /* modules.css:3895 */
.module-info-box__title--amber { color: #78350f; margin-bottom: 6px; }   /* modules.css:3899 */
.module-info-box__body { margin: 0 0 8px; color: #334155; }   /* modules.css:3903 */
.module-info-box__body--last { margin-bottom: 0; }   /* modules.css:3907 */
.module-info-box__body--amber { color: #78350f; }   /* modules.css:3910 */
.module-info-box__list { margin: 0; padding-left: 18px; color: #065f46; }   /* modules.css:3913 */
.module-info-box__list li { margin: 3px 0; }   /* modules.css:3918 */
.module-info-box--insight { background: #fff; border: 1px solid var(--color-border); border-left: 4px solid var(--color-primary); border-radius: var(--color-radius-sm); padding: 20px; margin-bottom: 14px; transition: box-shadow .2s; }   /* modules.css:5993 */
.module-info-box--insight:hover { box-shadow: var(--color-shadow-sm); }   /* modules.css:6006 */
.module-info-box--insight h3 { font-size: 16px; font-weight: 700; color: var(--color-text-primary); margin: 0 0 8px; display: flex; align-items: center; gap: 8px; }   /* modules.css:6009 */
.module-info-box--insight h3::before { content: '💡'; font-size: 18px; }   /* modules.css:6018 */
.module-info-box--insight p { font-size: 15px; line-height: 1.8; color: var(--color-text-body); margin: 0 0 8px; }   /* modules.css:6022 */
.module-info-box--insight a { font-size: 15px; font-weight: 600; color: var(--color-primary); text-decoration: none; }   /* modules.css:6028 */
.module-info-box--insight a:hover { text-decoration: underline; }   /* modules.css:6034 */
.module-content .module-info-box { background: #eff6ff; border-left: 4px solid #3b82f6; border-radius: 8px; padding: 16px 20px; margin: 20px 0; font-size: 16px; line-height: 1.8; color: #1e3a5f; }   /* modules.css:6978 */
.module-info-box ol { margin: 0.5rem 0 1rem; padding-left: 1.25rem; }   /* modules.css:7033 */
.module-info-box ul { margin: 0.5rem 0 1rem; padding-left: 1.25rem; }   /* modules.css:7033 */
.module-info-box .module-calc-list--links { padding-left: 0; }   /* modules.css:7036 */
.module-info-box .module-calc-list--links a { font-size: 16px; }   /* modules.css:7038 */
.module-info-box h3 { font-size: 1.25rem; font-weight: 600; color: #1e293b; margin: 0 0 0.5rem; line-height: 1.35; text-transform: none; }   /* modules.css:7341 */
.module-info-box--callout { border-radius: 8px; padding: 16px 20px; margin: 16px 0; font-size: 16px; line-height: 1.8; }   /* modules.css:7604 */
.module-info-box--positive { background: #f0fdf4; border-left: 4px solid #22c55e; color: #14532d; }   /* modules.css:7613 */
.module-info-box--warning { background: #fefce8; border-left: 4px solid #eab308; color: #713f12; }   /* modules.css:7618 */
.module-info-box--note { font-size: 14px; color: #6b7280; margin: 12px 0; line-height: 1.6; }   /* modules.css:7658 */
.module-info-box--benefits { border-left: 4px solid #3b82f6; }   /* modules.css:7683 */
.module-info-box--planning { border-left: 4px solid #8b5cf6; }   /* modules.css:7686 */
.module-info-box--tax { border-left: 4px solid #f59e0b; }   /* modules.css:7687 */
.module-info-box--wealth { border-left: 4px solid #059669; }   /* modules.css:7688 */
.module-info-box__heading { margin-top: 0; }   /* modules.css:7817 */
.module-info-box__body { margin-bottom: 0; }   /* modules.css:7822 */
.module-info-box__body .module-cta--small { margin-top: 8px; margin-bottom: 2px; }   /* modules.css:9982 */
.module-info-box--notice .module-info-box__body p { margin: 0 0 1em; }   /* modules.css:9992 */
.module-info-box--notice .module-info-box__body p:last-child { margin-bottom: 0; }   /* modules.css:9994 */
.module-info-box--notice .module-cta--small { display: block; width: 100%; text-align: center; }   /* modules.css:9995 */
.module-info-box--notice-imminent { border-left-width: 6px; background: #fee2e2; }   /* modules.css:9996 */
.module-info-box--notice-imminent .module-info-box__title { color: #b91c1c; }   /* modules.css:9998 */
.module-info-box.module-info-box a.deposit-cardlist__item { text-decoration:none; color:inherit; }   /* modules.css:11587 */
.module-info-box.module-info-box .deposit-cardlist a { text-decoration:none; color:inherit; }   /* modules.css:11587 */
.module-info-box.module-info-box a.dp-prodlink:not(.module-table__link) { font-weight: 700; color: var(--color-primary-dark); text-decoration: none; padding: 2px 4px; border-radius: 4px; transition: background .15s, color .15s; }   /* modules.css:11610 */
.module-info-box:has(.deposit-cardlist) { margin-bottom: 18px; }   /* modules.css:11632 */
.module-info-box.module-info-box a.dp-prodlink:not(.module-table__link):hover { background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff); color: var(--color-primary-dark); text-decoration: none; }   /* modules.css:11634 */
.module-info-box:has(> .module-info-box__body > .deposit-ctxlink) { background: transparent; border: 0; padding: 0; margin: 0; }   /* modules.css:11675 */
.module-info-box:has(> .module-info-box__body > .deposit-cardlist) { background: transparent; border: 0; padding: 0; margin: 0; }   /* modules.css:11679 */
@media (max-width: 768px) {
  .module-info-box--insight { padding: 16px; }   /* modules.css:6553 */
}
@media print {
  .module-info-box--insight { border: 1px solid #ccc; box-shadow: none; break-inside: avoid; }   /* modules.css:6633 */
}
@media (max-width: 640px) {
  .module-info-box--callout { padding: 12px 16px; }   /* modules.css:7734 */
}
/* HAR조 2026-09-27 테두리 한 겹 — 네 면 테두리 상자(--plain) 안 링크 단추 = 바탕색만(상자 테두리가 한 겹) · 단추 선 원천 = table 모듈 .module-table__link */
.module-info-box--plain.module-info-box--plain a.module-table__link { border-color: transparent; }

/* core/modules/display/prose/style.css */

.u-summary-return-anchor { display:inline-flex; margin:14px 0 0; font-size:13px; color:var(--mut); text-decoration:none; align-items:center; gap:6px; font-weight:700; text-underline-offset:3px; text-decoration-thickness:1.5px; text-decoration-color:color-mix(in srgb,currentColor 55%,transparent); margin-top:4px; }
@media (max-width:920px) {
.module-prose__calculation-basis-aside { grid-row:auto; position:static; grid-column:1; }
}
.u-summary-return-anchor { text-underline-offset:3px; text-decoration-thickness:1.5px; text-decoration-color:color-mix(in srgb,currentColor 55%,transparent); display: inline-block; align-items:center; gap:6px; margin-top:4px; font-size: 13px; color: var(--mut); text-decoration: none; font-weight:700; margin: 14px 0 0; }
@media (max-width:920px) {
}
@media (prefers-reduced-motion:reduce) {
}
.u-tabular-number {
  font-variant-numeric: tabular-nums;
}
.module-prose__content-section-block>.module-prose__section-lead-paragraph {
  margin: 0 0 15px;
  color: var(--ink2);
  font-size: 16px;
  line-height: 1.7;
}
.u-summary-return-anchor {
  display: inline-block;
  margin: 14px 0 0;
  font-size: 13px;
  color: var(--mut);
  text-decoration: none;
}
.module-prose__body-block {
  display: grid;
  grid-template-columns: minmax(0,1fr) 288px;
  column-gap: 26px;
  align-items: start;
}
/* 🔴 2026-09-27 지휘자(사용자 「오른쪽 영역 박스가 없으면 그 여백을 비워두고 작성하는 모듈이 있었어 … 오른쪽 여백까지 밀어버리게 모듈 수정」) —
   계산 근거 상자(basis_title)가 없으면 288px 빈 칸 없이 본문이 끝까지 쓴다 · 되돌리기 = .bak_20260927-지휘자-여백 */
.module-prose__body-block--solo { grid-template-columns: minmax(0,1fr); }
.module-prose__body-block>p {
  grid-column: 1;
  margin: 0 0 13px;
  color: var(--ink2);
  font-size: 16px;
  line-height: 1.78;
}
.module-prose__body-block>p:last-of-type {
  margin: 0;
}
.module-prose__body-block strong {
  color: var(--ink);
}
.module-prose__calculation-basis-aside {
  grid-column: 2;
  grid-row: 1/span 99;
  align-self: start;
  padding: 13px 15px 14px;
  border: 1px solid var(--line2);
  border-radius: var(--r-s);
  background: var(--surf);
  position: sticky;
  /* 🔴 2026-09-14 — 헤더 고정(sticky)을 오늘 풀어 --chrome-h 기준이 무의미해졌다(지시서 지적).
     사이드바(core/presets shell)와 같은 방식으로 20px 고정값으로 정리(값 창작 0 — 사이드바가
     쓰는 값을 그대로 따름). */
  top: 20px;
  max-height: calc(100vh - 20px - 32px);
  overflow: auto;
}
.module-prose__calculation-basis-entry-title {
  margin: 0 0 9px;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .05em;
  color: var(--mut);
}
.module-prose__calculation-basis-entry-label {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
.module-prose__calculation-basis-entry-label li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
  color: var(--mut);
  font-weight: 600;
}
.module-prose__calculation-basis-entry-label li:last-child {
  border-bottom: 0;
}
.module-prose__calculation-basis-entry-label li b {
  font-size: 14px;
  font-weight: 800;
  color: var(--ink);
  letter-spacing: -.02em;
}
.module-prose__calculation-basis-entry-name {
  margin: 9px 0 0;
  font-size: 13px;
  line-height: 1.6;
  color: var(--mut);
}
/* 🔴🔴 2026-09-15 규칙 제거(지휘자 승인) · 이유 = void 요소라 안 먹음 ·
   실제 간격은 `…aside strong` 이 만든다.
   (구 규칙 원문 = `.module-prose__calculation-basis-aside br { display:block; margin-top:6px }`
   — `<br>` 은 HTML5 파싱·렌더 모델에서 "강제 줄바꿈"으로 특수 취급되는 void 요소라
   `display:block`을 얹어도 대다수 렌더링 엔진(Chromium·Firefox·WebKit)이 박스 모델(margin·
   padding·height)을 안정적으로 적용하지 않는다(선택자가 안 먹는 게 아니라 그 "요소가" 규칙을
   무시한다) — «죽은 규칙»이었다(사용자 재확인 2026-09-15: 새로고침해도 간격이 안 나온다).
   실제 항목 간격은 아래 :361(파일 끝 근처)
   `.module-prose__calculation-basis-aside .module-prose__calculation-basis-entry-name strong`
   규칙(margin-top:9px·display:inline-block)이 만든다 — `<strong>`은 특례 없는 일반 인라인
   요소라 display 변경이 스펙대로 적용된다. */
@media (max-width:920px) {
.module-prose__body-block {
    grid-template-columns: 1fr;
    row-gap: 14px;
  }
.module-prose__body-block>p, .module-prose__calculation-basis-aside {
    grid-column: 1;
  }
.module-prose__calculation-basis-aside {
    grid-row: auto;
    position: static;
  }
}
.module-prose__page-contents-outline a, .module-prose__cross-link-list-column a, .module-prose__footer-link-grid a, .module-prose__rank-list-block-followup-note a, .module-prose__distribution-bar-label-row a, .u-summary-return-anchor, .module-prose__card-grid-deep-dive-panel a {
  text-underline-offset: 3px;
  text-decoration-thickness: 1.5px;
  text-decoration-color: color-mix(in srgb,currentColor 55%,transparent);
}
.module-prose__page-contents-outline a:hover, .module-prose__page-contents-outline a:focus-visible, .module-prose__cross-link-list-column a:hover, .module-prose__cross-link-list-column a:focus-visible, .module-prose__footer-link-grid a:hover, .module-prose__footer-link-grid a:focus-visible, .module-prose__rank-list-block-followup-note a:hover, .module-prose__rank-list-block-followup-note a:focus-visible, .module-prose__distribution-bar-label-row a:hover, .module-prose__distribution-bar-label-row a:focus-visible, .u-summary-return-anchor:hover, .u-summary-return-anchor:focus-visible, .module-prose__card-grid-deep-dive-panel a:hover, .module-prose__card-grid-deep-dive-panel a:focus-visible {
  text-decoration: underline;
}
.u-summary-return-anchor {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
}
.u-summary-return-anchor::before {
  content: "↑";
  display: inline-grid;
  place-items: center;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: var(--surf2);
  border: 1px solid var(--line2);
  color: var(--mut);
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  transition: transform .13s ease,background .13s ease,color .13s ease;
}
.u-summary-return-anchor:hover::before, .u-summary-return-anchor:focus-visible::before {
  background: var(--acc);
  border-color: var(--acc);
  color: #fff;
  transform: translateY(-2px);
}
.u-summary-return-anchor:hover, .u-summary-return-anchor:focus-visible {
  color: var(--acc-i);
}
.module-prose__calculation-basis-entry-name code, .module-prose__body-block code {
  font-family: ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size: .92em;
  padding: 1px 5px;
  border-radius: 4px;
  background: var(--surf2);
  border: 1px solid var(--line2);
}
.module-prose__table-scroll-hint+.module-prose__body-block, .module-prose__table-scroll-hint+.u-visual-block-box {
  margin-top: 2px;
}
.module-prose__content-section-block>*+.module-prose__section-lead-paragraph {
  margin-top: 28px;
}
.module-prose__content-section-block>h2+.module-prose__section-lead-paragraph {
  margin-top: 0;
}
.module-prose__body-block, .module-prose__card-grid-page, .module-popup__thumb-effect-layer, .module-prose__sibling-axis-link-grid {
  margin-bottom: 14px;
}
a.module-prose__primary-action-button .u-tabular-number, a.module-prose__primary-action-button:hover .u-tabular-number { color: #fff }
a.module-prose__primary-action-button.module-prose__app-layer-primary-action-button--question .u-tabular-number { color: var(--ink) }
a.module-prose__primary-action-button.module-prose__app-layer-primary-action-button--question:hover .u-tabular-number { color: #fff }
.u-tabular-number { font-variant-numeric:tabular-nums; }
.u-summary-return-anchor { text-underline-offset:3px; text-decoration-thickness:1.5px; text-decoration-color:color-mix(in srgb,currentColor 55%,transparent); display:inline-flex; align-items:center; gap:6px; margin-top:4px; font-size:13px; color:var(--mut); text-decoration:none; font-weight:700; margin:14px 0 0; }
.u-summary-return-anchor:hover { text-decoration:underline; color:var(--acc-i); }
.u-summary-return-anchor:focus-visible { text-decoration:underline; color:var(--acc-i); }
.module-prose__content-section-block>*+.module-prose__section-lead-paragraph { margin-top:28px; }
.module-prose__content-section-block>h2+.module-prose__section-lead-paragraph { margin-top:0; }
.module-prose__section-lead-paragraph { margin:0 0 12px; color:var(--ink2); font-size:16px; }
.module-prose__body-block p { margin:0 0 10px; font-size:16px; color:var(--ink2); }
.module-prose__body-block b { color:var(--ink); }
.u-summary-return-anchor::before { content:"↑"; display:inline-grid; place-items:center; width:19px; height:19px; border-radius:50%; background:var(--surf2); border:1px solid var(--line2); color:var(--mut); font-size:13px; font-weight:800; line-height:1; transition:transform .13s ease,background .13s ease,color .13s ease; }
.u-summary-return-anchor:hover::before { background:var(--acc); border-color:var(--acc); color:#fff; transform:translateY(-2px); }
.u-summary-return-anchor:focus-visible::before { background:var(--acc); border-color:var(--acc); color:#fff; transform:translateY(-2px); }
.module-prose__content-section-block>.module-prose__section-lead-paragraph { margin:0 0 15px; color:var(--ink2); font-size:16px; line-height:1.7; }
.module-prose__body-block { display:grid; grid-template-columns:minmax(0,1fr)288px; column-gap:26px; align-items:start; }
.module-prose__body-block>p { grid-column:1; margin:0 0 13px; color:var(--ink2); font-size:16px; line-height:1.78; }
.module-prose__body-block>p:last-of-type { margin:0; }
.module-prose__body-block strong { color:var(--ink); }
.module-prose__body-block p a { text-decoration:underline; text-underline-offset:2px; text-decoration-thickness:1.5px; }
.module-prose__body-block p a:hover { color:var(--acc); }
.module-prose__calculation-basis-aside { grid-column:2; grid-row:1/span 99; align-self:start; padding:13px 15px 14px; border:1px solid var(--line2); border-radius:var(--r-s); background:var(--surf); position:sticky; top:20px; max-height:calc(100vh - 20px - 32px); overflow:auto; }
.module-prose__calculation-basis-entry-title { margin:0 0 9px; font-size:13px; font-weight:800; letter-spacing:.05em; color:var(--mut); }
.module-prose__calculation-basis-entry-label { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.module-prose__calculation-basis-entry-label li { display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:6px 0; border-bottom:1px solid var(--line); font-size:13px; color:var(--mut); font-weight:600; }
.module-prose__calculation-basis-entry-label li:last-child { border-bottom:0; }
.module-prose__calculation-basis-entry-label li b { font-size:14px; font-weight:800; color:var(--ink); letter-spacing:-.02em; text-align:right; }
.module-prose__calculation-basis-entry-name { margin:9px 0 0; font-size:13px; line-height:1.6; color:var(--mut); }
:is(.module-prose__content-section-block, .module-prose__app-layer-panel, .module-prose__page-summary-box)>.module-prose__body-block+.module-prose__body-block { margin-top:12px; }
:is(.module-prose__content-section-block, .module-prose__app-layer-panel, .module-prose__page-summary-box)>.module-prose__section-lead-paragraph+* { margin-top:0; }
.module-prose__calculation-basis-entry-name code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.92em; padding:1px 5px; border-radius:4px; background:var(--surf2); border:1px solid var(--line2); }
.module-prose__body-block code { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:.92em; padding:1px 5px; border-radius:4px; background:var(--surf2); border:1px solid var(--line2); }
table td .u-tabular-number { white-space:nowrap; }
table .u-tabular-number { white-space:nowrap; }
.module-prose__table-scroll-hint+.module-prose__body-block { margin-top:2px; }
.module-prose__app-layer-meta-tile-value.u-tabular-number { overflow:visible; text-overflow:clip; white-space:nowrap; }
:is(.module-prose__content-section-block)>.module-prose__section-lead-paragraph+* { margin-top:0; }
:is(.module-prose__content-section-block)>.u-summary-return-anchor:nth-child(n+2) { margin-top:18px; }
:is(.module-prose__content-section-block)>*+.module-prose__section-lead-paragraph { margin-top:28px; }
:is(.module-prose__content-section-block)>h2+.module-prose__section-lead-paragraph { margin-top:0; }
@media (max-width:920px) {
.module-prose__body-block { grid-template-columns:1fr; row-gap:14px; }
.module-prose__body-block>p { grid-column:1; }
.module-prose__calculation-basis-aside { grid-column:1; grid-row:auto; position:static; }
}
@media (prefers-reduced-motion:reduce) {
.u-summary-return-anchor::before { transition:none; }
.u-summary-return-anchor:hover::before { transform:none; }
}
.module-prose__section-lead-paragraph b { color:var(--ink); font-weight:700; }
.module-prose__body-block p:last-child { margin:0; }
td.u-tabular-number { font-variant-numeric:tabular-nums; white-space:nowrap; text-align:right; }

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .u-value-direction-rising { color:var(--up); }
  .u-value-direction-falling { color:var(--dn); }
  .module-prose__print-variant-shine-map-diagram-key span.u-value-direction-rising { color:var(--acc-i); background:var(--acc-s); }
  .module-prose__content-section-block { padding:0; border-top:0; margin-top:0; margin-bottom:32px; }
  .module-prose__price-trend-line-tooltip .module-prose__price-trend-line-delta-arrow.u-value-direction-rising { color:#6EE7A8; }
  .module-prose__price-trend-line-tooltip .module-prose__price-trend-line-delta-arrow.u-value-direction-falling { color:#FF9C8F; }
@media (max-width:820px) {
  .module-prose__content-section-block { padding-top:20px; margin-top:18px; margin-bottom:24px; }
  .module-prose__content-section-block:first-of-type { margin-top:0; padding-top:0; }
}
  .module-prose__calculation-basis-entry-label--wide { display:flex; flex-direction:row; gap:10px; flex-wrap:wrap; list-style:none; margin:11px 0 0; padding:0; }
  .module-prose__calculation-basis-entry-label--wide li { flex:1 1 150px; display:flex; flex-direction:column; gap:3px; padding:10px 12px; border:1px solid var(--line2); border-radius:var(--r-s); background:var(--surf2); }
@media (max-width:640px) {
  .module-prose__calculation-basis-entry-label--wide { gap:7px; }
  .module-prose__calculation-basis-entry-label--wide li { flex:1 1 0; min-width:0; padding:9px 8px; }
}
  .module-prose__calculation-basis-entry-label--wide span { font-size:13px; color:var(--mut); }
  .module-prose__calculation-basis-entry-label--wide b { font-size:19px; font-weight:800; }
  .module-prose__content-section-block>h2, h2.module-prose__app-layer-lens-entry-panel-title { font-size: 24px; font-weight: 700; line-height: 1.35; letter-spacing: -.02em; margin: 70px 0 15px 0; padding-left: 15px; border-left: 4px solid var(--acc); padding-bottom: 10px; border-bottom: 1px solid var(--line2); color: var(--ink); text-transform: none; text-wrap: balance; }
@media (max-width:820px) {
  .module-prose__content-section-block>h2, h2.module-prose__app-layer-lens-entry-panel-title { font-size: 21px; margin: 50px 0 13px 0; padding-left: 12px; border-left-width: 3px; }
}
@media (max-width:600px) {
  .module-prose__content-section-block>h2, h2.module-prose__app-layer-lens-entry-panel-title { font-size: 19px; margin: 40px 0 12px 0; }
}
  .module-prose__headline-stat-block-description.u-value-direction-rising { color:var(--up); }
  .module-prose__headline-stat-block-description.u-value-direction-falling { color:var(--dn); }
  .module-prose__content-section-block>h2 { font-size:24px; font-weight:700; line-height:1.35; letter-spacing:-.02em; margin:70px 0 15px 0; padding-left:15px; border-left:4px solid var(--acc); padding-bottom:10px; border-bottom:1px solid var(--line2); color:var(--ink); text-transform:none; text-wrap:balance; }
  .module-prose__type-sparkline-card-footnote em.u-value-direction-rising { color:var(--up); }
  .module-prose__type-sparkline-card-footnote em.u-value-direction-falling { color:var(--dn); }
  .module-prose__rank-list-group-value-ladder-value.u-value-direction-rising { color:var(--up); }
  .module-prose__rank-list-group-value-ladder-value.u-value-direction-falling { color:var(--dn); }
  :where(.module-prose__content-section-block,.module-prose__app-layer-panel,.module-prose__page-summary-box)>* { margin-bottom:12px; }
  :where(.module-prose__content-section-block,.module-prose__app-layer-panel,.module-prose__page-summary-box,.module-prose__entry-content)>*:last-child { margin-bottom:0; }
  :is(.module-prose__content-section-block,.module-prose__app-layer-panel,.module-prose__page-summary-box)>:nth-child(n+2) { margin-top:22px; }
  :is(.module-prose__content-section-block,.module-prose__app-layer-panel,.module-prose__page-summary-box)>.module-prose__rank-list-block-followup-note:nth-child(n+2) { margin-top:8px; }
  :is(.module-prose__content-section-block,.module-prose__app-layer-panel,.module-prose__page-summary-box)>.module-prose__list-page-bar:nth-child(n+2) { margin-top:8px; }
  :is(.module-prose__content-section-block,.module-prose__app-layer-panel,.module-prose__page-summary-box)>.module-prose__ranked-thumbnail-list-gap-rows+.module-prose__ranked-thumbnail-list-gap-rows { margin-top:12px; }
  :is(.module-prose__content-section-block,.module-prose__app-layer-panel,.module-prose__page-summary-box)>*+h3 { margin-top:28px; }
  :is(.module-prose__content-section-block,.module-prose__app-layer-panel,.module-prose__page-summary-box)>h3+* { margin-top:9px; }
  .module-prose__price-trend-line-tooltip-arrow.u-value-direction-rising { color:#6EE7A8; }
  .module-prose__price-trend-line-tooltip-arrow.u-value-direction-falling { color:#FF9C8F; }
  .module-prose__app-layer-data-story-tile-value.u-value-direction-rising { color:var(--up); }
  .module-prose__app-layer-data-story-tile-value.u-value-direction-falling { color:var(--dn); }
  :where(.module-prose__content-section-block)>* { margin-bottom:12px; }
  :where(.module-prose__content-section-block)>*:last-child { margin-bottom:0; }
  :is(.module-prose__content-section-block)>:nth-child(n+2) { margin-top:22px; }
@media (max-width:820px) {
  .module-prose__content-section-block>h2 { font-size:21px; margin:50px 0 13px 0; padding-left:12px; border-left-width:3px; }
}
@media (max-width:600px) {
  .module-prose__content-section-block>h2 { font-size:19px; margin:40px 0 12px 0; }
}
/* ── 동기화 블록 끝 (sync-live) ── */


/* ── 짝 맞추기 — 마크업이 찍는데 규칙이 없던 이름 (2026-09-10 창D) ────────── */
/* 🔴 짝 맞추기(2026-09-10 창D) — 뿌리 — 원본에 뿌리 선언 없음.
   마크업이 이 이름을 찍는데 규칙이 없어 «자리»만 만든다. 생김새는 «창작하지 않는다»
   (선례 = display/pdf-embed/style.css .module-pdf-embed__title). */
.module-prose {
}

/* ── 「근거」 상자 — 항목 이름과 값 사이 여백 (2026-09-14 사용자 지시) ─────────────────
   🔴 core/modules/** 편집은 사용자 명시 승인 때만 — 이 건은 사용자가 마크업을 지목해
   「<strong>가격</strong> 여기 오른쪽 여백을 지금보다 조금 더 줘서 구분이 되도록 해」라고
   직접 지시한 건이다(2026-09-14).

   왜 필요했나 — 이 이름에 대한 규칙이 «한 줄도 없었다». 마크업이
   `<strong>가격</strong> 한국석유공사 오피넷 — …` 형태라 «글자 사이 공백 하나»(13px 기준 약 3px)가
   유일한 간격이었고, 굵은 라벨과 이어지는 값이 붙어 보였다.

   🔴 파일 «맨 끝»에 두는 이유 — 이 파일에는 `.module-prose__calculation-basis-entry-name` 선언이
   «두 벌»(:96 과 :201) 있고 뒤가 이긴다. 자식 선택자라 덮이지는 않지만, 앞쪽에 넣으면 다음에
   읽는 사람이 「어느 벌이 사는가」를 또 따져야 한다. 끝에 두면 폭과 무관하게 항상 적용된다.
   (선례 = 기억 mandate_token_rule_overridden_by_later_hardcoded_copy_2026_09_13)

   ⚠️ 값은 «간격»만 준다 — 굵기·색·크기는 건드리지 않았다(라이브 원본 보존). */
.module-prose__calculation-basis-entry-name strong { margin-right: 7px; }

/* ── 「근거」 상자 — 항목 "사이" 세로 간격 재처방 (2026-09-15 · 앞 br 처방 무효 재확인) ──
   🔴 사용자: 「새로고침됐는데, br 부분만 간격을 조금 더 주라는 것은 아직 적용이 안 됐어」.
   원문(옛 :102 규칙 — 2026-09-15 제거) = `.module-prose__calculation-basis-aside br { display:block; margin-top:6px }`
   — 파일에는 있었지만 화면에는 안 나왔다. 원인 = `<br>` 자체가 렌더 엔진 특례로 박스 모델을
   안 받는 void 요소이기 때문(위 옛 :102 자리의 주석에 그대로 남겨 뒀다) — «죽은 규칙»이었다.

   대신 마크업이 실제로 주는 것을 쓴다 — 이 문단은 basis_note 원자가 항목마다
   `<strong>라벨</strong> 값<br>` 형태로 시작한다(예: sites/sise/manifests/fuel/tax.jsonc
   `basis_note` — "<strong>법정세율</strong> …<br><strong>부가가치세</strong> …<br>…").
   즉 각 항목의 "첫 글자"는 언제나 그 항목의 `<strong>` 이다 — 그 `<strong>` 에 margin-top 을
   주면 항목 경계(줄바꿈 지점)마다 정확히 벌어지고, 항목이 길어 두 줄로 넘어가도 그 "안"(strong
   다음에 오는 일반 텍스트)에는 걸리지 않는다(사용자가 원한 "항목 사이 vs 항목 안" 구분 —
   위 :102 의도와 동일·구현 수단만 br→strong 로 교체).

   `<strong>` 은 기본 display:inline 이라 margin-top 이 무시된다 → inline-block 으로 바꿔야
   세로 마진이 적용된다(이것이 `<br>` 과의 차이 — strong 은 특례 없는 일반 인라인 요소라
   display 변경이 스펙대로 먹는다).

   🔴 첫 항목은 그 위에 이미 `.module-prose__calculation-basis-entry-name` 자체의
   margin-top:9px(:96/:214)가 있어 추가로 벌어지면 안 된다 → `strong:first-child` 만 0 으로
   되돌린다(그 문단은 언제나 strong 으로 "시작"하므로 :first-child 가 곧 "첫 항목"이다).

   값 = 9px — 이 모듈이 이미 쓰는 같은 계열 값(.module-prose__calculation-basis-entry-name의
   자체 margin-top: 9px 0 0, :96/:214 — "블록 사이 간격" 용도로 이미 쓰는 수치를 그대로 재사용,
   새 값 발명 0). 「조금 더」 요청에 맞춰 죽은 br 규칙의 6px보다 한 단 크다.

   🔴 스코프 — .module-prose__calculation-basis-aside 와 .module-prose__calculation-basis-entry-name
   두 클래스를 모두 조상으로 요구하는 자손 선택자다. 두 클래스명 다 이 모듈 전용 BEM 이름이라
   (다른 모듈·다른 사이트에 이 두 이름이 겹칠 자리가 없다 — grep 증명은 보고서 참조) aside
   밖의 <strong>(전 사이트에 흔함)에는 전혀 걸리지 않는다. */
.module-prose__calculation-basis-aside .module-prose__calculation-basis-entry-name strong {
  display: inline-block;
  margin-top: 9px;
}
.module-prose__calculation-basis-aside .module-prose__calculation-basis-entry-name strong:first-child {
  margin-top: 0;
}

/* ── 절(section) 안에서 «앞선 모듈»에 붙는 문제 — prose 자기 위 여백(2026-09-15 · ㉮ 판정) ──
   🔴 판정 = ㉮(prose 모듈이 자기 위 여백을 가진다). 근거 —
   ①조립기(core/runtime/assemble/render.mjs:516~521)는 절 안 모듈 HTML 을 문자열로 «이어 붙일
     뿐»(구분자·여백 삽입 0). 그래서 사이 간격은 반드시 CSS 쪽(모듈 자신이 갖거나 · 조립기가
     주거나 · 셸이 준다)에서 나야 한다.
   ②라이브 대조 — 라이브 CSS 에는 «절을 감싸는 상자 자체가 없다»(core/presets/shell/_shared/
     layout.css:20~22 머리 주석 — 실측: content-section-block 0건). 그래서 「이 모듈이 다른 모듈
     뒤에 왔을 때」를 라이브가 직접 규정한 선례는 없지만, «같은 문제»(형제 블록이 첫 번째가
     아닐 때만 위 여백)를 이 저장소가 이미 겪어 둔 자리가 있다 — 이 파일 자신의
     `:is(.module-prose__content-section-block,…)>:nth-child(n+2) { margin-top:22px }`
     (위 :224~297, sync-live 이식분) 가 그 값·그 패턴이다. 그 규칙은 prose «내부» 자식끼리의
     간격이라 이번 결함(다른 «모듈»과의 간격)에는 안 걸린다 — 그래서 한 단 밖(절 자체를 부모로)
     같은 패턴을 재사용한다. 값 22px = 새 값이 아니라 그 기존 규칙의 값을 그대로 물려받은 것.
   ③범위 — 조립기가 실제로 방출하는 절 그릇은 `<section class="content-section-block">` «한
     가지뿐»이다(render.mjs:554 · grep 확인 — `.app-layer-panel`·`.page-summary-box` 를 절 그릇으로
     찍는 코드는 0건이라 그 두 선택자는 넣지 않았다 — 이 파일 위쪽 :is(...) 3종 나열과 다른 점).
   ④«절의 첫 모듈» 제외 — `*+` 인접 형제 선택자라 prose 앞에 «형제(제목 h2 포함)»가 있을 때만
     걸린다. 형제가 없으면(절의 첫 모듈) 이 규칙 자체가 매치되지 않아 :254 의
     `.module-prose__content-section-block { margin-top:0 }` 가 그대로 남는다(이중 여백 0).
     h2 바로 뒤에 prose 가 오는 경우는 h2 자신의 아래 여백(margin-bottom:15px ·
     core/presets/shell/_shared/layout.css:22)과 «인접 형제 margin 병합»으로 겹쳐(둘 다 일반
     block 흐름·display 변경 없음) 22px 로 수렴한다 — 15+22 로 더해지지 않는다.
   ⑤선택자 관례 — 이 파일이 이미 쓰는 `X+Y { margin-top:… }` 인접 형제 관례(:183·:186)를
     그대로 따랐다(새 결합자·새 기법 0). */
.content-section-block > * + .module-prose__content-section-block {
  margin-top: 22px;
}

/* 🔴 2026-09-29 지휘자 — 사용자 「오른쪽 영역 없으면 오른쪽 영역 밀어버리고 전체 너비 사용하라고 했잖아 … 모듈 단위로 수정」
   원인 = :203 `.module-prose__body-block { grid-template-columns:minmax(0,1fr)288px }` 가 :35 solo(한 칸) 규칙과 강도가 같고 뒤에 있어 덮어씀
   → 데스크톱에서 오른쪽 칸(계산 근거 상자)이 없어도 288px 빈 칸이 남았다. 선택자 강도를 올려 solo 가 이긴다. */
.module-prose__body-block.module-prose__body-block--solo { grid-template-columns:minmax(0,1fr); }
/* 사용자 「위 차트와 딱 달라붙어 있고」 — 인접 형제 규칙(`.content-section-block > * + .module-prose__content-section-block`)이
   서사 감싸개(<div data-narrative>) 때문에 안 걸림 → 감싸개에도 같은 22px. */
.content-section-block > * + [data-narrative] { margin-top:22px; }

/* core/modules/display/sources/style.css */
/* sources/style.css — 라이브 CSS 원문 재구성(2026-09-08 fable2) · 재료 = _sandbox/모듈최종형식-20260907/_live-all.css(주석 제거본 = tcggrail·modoocard assets/css 7파일)
   규칙 = 계열 2종에 걸린 라이브 규칙 98개(@media 안 8개) · 같은 선택자 여러 벌은 «전부 순서대로» · @media 껍데기 보존 · 페이지 문맥 조상(landing-page 계열 여섯 이름)만 떼고 규칙은 살림 · 값 창작 0
   계열 = module-sources module-title */
.module-sources__tier { font-size: 15px; display: inline-block; padding: 4px 10px; border-radius: 5px; font-weight: 700; color: white; line-height: 1.4; flex-shrink: 0; letter-spacing: 0.3px; text-transform: none; }
.module-sources__item { font-size: 0.95rem; color: #475569; line-height: 1.7; margin-bottom: 6px; display: flex; align-items: flex-start; gap: 12px; background: #fff; border: 1px solid var(--color-border); border-radius: var(--color-radius-sm); padding: 12px 16px; transition: border-color .2s, box-shadow .2s; counter-increment: source-counter; }
.module-sources__badge { display: flex; width: 28px; height: 28px; border-radius: 50%; background: #ecfdf5; flex-shrink: 0; color: #059669; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; line-height: 1; }
.module-sources__text { flex: 1; font-size: 14px; font-weight: 600; color: var(--color-text-primary); line-height: 1.5; padding-top: 3px; }
.module-sources__link { color: var(--color-primary) !important; text-decoration: none !important; flex-shrink: 0; display: inline-block; font-size: 13px; font-weight: 600; background: var(--color-primary-light); padding: 4px 12px; border-radius: 20px; white-space: nowrap; transition: background .2s, color .2s; }
@media (max-width: 768px) {
}
@media (max-width: 640px) {
}
.module-sources__updated { font-size: 13px; font-style: italic; color: var(--color-text-muted, #666); margin-top: 6px; margin-bottom: 0; display: inline-block; margin-left: 8px; padding: 2px 8px; background: var(--color-bg-light, #f7f8fa); border-radius: 3px; }
@media (max-width: 640px) {
}
.module-sources, .module-sources__related-grid, .module-sources__hub-nav {
    content-visibility: auto;
    contain-intrinsic-size: 0 600px;
}
.module-sources__marketplace-affiliate-legend .module-sources__group-desc { margin-top:0; }
.module-sources__tier { font-size: 15px; }
.module-sources { contain-intrinsic-size: auto 0px auto 950px; }
.module-sources {
    /* 🔴 2026-09-15 사용자 지시 — 상단 h2(절 제목) 아래 여백과 겹쳐 이중으로 벌어짐.
       위쪽만 0 · 아래 32px 은 그대로(값 삭제 0 — 원본 32px 은 margin-bottom 으로 보존). */
    margin-top: 0;
    margin-bottom: 32px;

    counter-reset: source-counter;
}
.module-sources__title {
    font-size: 1.1rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 12px 0;
}
.module-sources__item {
    font-size: 0.95rem;
    color: #475569;
    line-height: 1.7;
    margin-bottom: 6px;
    display: flex;
    align-items: baseline;
    gap: 8px;
}
.module-sources__badge {
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #94a3b8;
    flex-shrink: 0;
}
.module-sources__text { flex: 1; }
.module-sources__link {
    color: #1d4ed8;
    text-decoration: underline;
    flex-shrink: 0;
}
.module-sources__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  list-style: none;
  padding-left: 0;
  margin: 0;
}
.module-sources__group { margin-top: 20px; }
.module-sources__group-label { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--contrast-2,#6b7280); margin: 0 0 6px; }
.module-sources__group-desc { font-size: 0.95rem; color: #475569; margin: 0 0 10px; }
.module-sources__badge {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #ecfdf5;
  color: #059669;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 800;
  flex-shrink: 0;
  line-height: 1;
}
/* 🔴 2026-09-13 «미이식 복구»(사용자 승인) — 배지 «번호»를 그리는 줄.
   출처 = 라이브 modules.css 원문 `배지 ::before 에 counter(source-counter) 를 그리는 규칙 한 줄`
   🔴 이관 때 «배관»만 왔고 «수도꼭지»가 빠져 있었다:
       counter-reset: source-counter   → .module-sources__list 에 있음 ✅ (구획마다 1부터 다시 시작)
       counter-increment: source-counter → .module-sources__item 에 있음 ✅
       content: counter(source-counter)  → 🔴 «없었다» = 번호가 안 그려짐
   증상(2026-09-13 사용자 눈 검수): 「sources 모듈 넘버링 숫자가 안 나와」.
   그 전에는 배지가 빈 동그라미가 되자 조립 쪽에서 tier_num(=등급 숫자)을 채워 「1」이 여덟 번
   찍혔다 — 그것도 같은 뿌리였다(라이브는 배지 글자를 «비워» 두고 CSS 가 번호를 그린다).
   🔴 값 창작 0 — 라이브에 있는 한 줄을 그대로 되돌린다. 모듈의 다른 규칙은 손대지 않았다. */
/* 11-04: 번호 규칙은 아래 «번호 원천» 한 곳(307줄 부근)만 둔다 — 여기엔 두지 않는다(이중 규칙 정리) */
.module-sources__badge--tier-1 { background: #dcfce7; color: #16a34a; }
.module-sources__badge--tier-2 { background: #fef3c7; color: #b45309; }
.module-sources__badge--tier-3 { background: #f1f5f9; color: #4b5563; }
.module-sources__item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--color-radius-sm);
  padding: 12px 16px;
  transition: border-color .2s, box-shadow .2s;
  counter-increment: source-counter;
}
.module-sources__item:hover {
  border-color: var(--color-primary);
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.module-sources__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.module-sources__legend {
  display: grid;
  grid-template-columns: max-content 1fr;
  column-gap: 16px;
  row-gap: 6px;
  margin-bottom: 16px;
  padding: 12px 16px;
  background: #f8fafc;
  border: 1px solid var(--color-border);
  border-radius: var(--color-radius-sm);
  font-size: 14px;
  color: var(--color-text-secondary);
  line-height: 1.5;
}
.module-sources__legend-item {
  display: contents;
}
.module-sources__legend-item .module-sources__tier {
  margin-top: 2px;
  justify-self: start;
  align-self: start;
}
@media (max-width: 768px) {
.module-sources__legend { display: flex; flex-direction: column; gap: 16px; }
.module-sources__legend-item { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; width: 100%; }
}
.module-sources__tier {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 5px;
  font-size: 15px;
  font-weight: 700;
  color: white;
  line-height: 1.4;
  flex-shrink: 0;
  letter-spacing: 0.3px;
  text-transform: none;
}
.module-sources__tier--1 { background: #16a34a; }
.module-sources__tier--2 { background: #f59e0b; }
.module-sources__tier--3 { background: #6b7280; }
.module-sources__tier--affiliate { background: #C13A2E; }
.module-sources__text {
  font-size: 14px;
  font-weight: 600;
  color: var(--color-text-primary);
  flex: 1;
  line-height: 1.5;
  
  padding-top: 3px;
}
@media (max-width: 640px) {
.module-sources__text { padding-top: 0; }
}
.module-sources__link {
  display: inline-block;
  font-size: 13px;
  font-weight: 600;
  color: var(--color-primary) !important;
  background: var(--color-primary-light);
  padding: 4px 12px;
  border-radius: 20px;
  text-decoration: none !important;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background .2s, color .2s;
}
.module-sources__link:hover {
  background: var(--color-primary) !important;
  color: #fff !important;
}
.module-sources__disclaimer {
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 16px 20px;
  margin: 24px 0 8px;
}
.module-sources__disclaimer p {
  font-size: 13px !important;
  font-style: italic;
  line-height: 1.7;
  color: #6b7280;
  margin: 0 0 4px;
}
.module-sources__disclaimer strong {
  color: #111827;
  font-weight: 700;
}
.module-sources__updated {
  font-size: 12px;
  font-style: italic;
  color: #9ca3af;
  margin-top: 6px;
  margin-bottom: 0;
}
@media (max-width: 640px) {
.module-sources__item {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}
.module-sources__note {
  font-size: 12px;
  color: var(--color-text-muted);
  margin-top: 12px;
  padding-top: 8px;
  border-top: 1px dashed var(--color-border);
}
.module-sources__list li {
  margin-bottom: 6px;
  color: var(--color-text-body, #374151);
}
.module-sources__list a {
  color: var(--color-primary, #1a73e8);
  text-decoration: underline;
  text-decoration-color: rgba(26, 115, 232, 0.3);
}
.module-sources__list a:hover {
  text-decoration-color: var(--color-primary, #1a73e8);
}
.module-sources__updated {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 8px;
    background: var(--color-bg-light, #f7f8fa);
    color: var(--color-text-muted, #666);
    font-size: 13px;
    border-radius: 3px;
}
.module-sources__pages {
    display: inline-block;
    margin-left: 6px;
    color: var(--color-text-muted, #888);
    font-size: 13px;
    font-style: italic;
}

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* ── 동기화 블록 끝 (sync-live) ── */

/* ── 2026-09-14 사용자 지시 — 행 전체 덮개(hitarea) 제거, url 글자 링크(__link)만 유지.
   위 «행 전체 링크(덮개) — 2026-09-09 rowlink» 규칙 4줄은 마크업의 __hitarea 를 겨냥한
   것이라 __hitarea 제거로 죽은 규칙이 됐다 — 함께 제거(값 창작 0·삭제만). ── */


/* ── 짝 맞추기 — 마크업이 찍는데 규칙이 없던 이름 (2026-09-10 창D) ────────── */
/* 🔴 짝 맞추기(2026-09-10 창D) — 공용 module-section__title 계보 — pdf-embed 선례대로 창작하지 않는다.
   마크업이 이 이름을 찍는데 규칙이 없어 «자리»만 만든다. 생김새는 «창작하지 않는다»
   (선례 = display/pdf-embed/style.css .module-pdf-embed__title). */
/* 🔴 값 복원(2026-09-10 창D) — 창작이 아니라 복원이다.
   개명 «전»에 이 요소가 화면에서 받던 값 · 출처 = core/modules/_harvest/base.css:8317-8344 (.module-section__title 및 820/600px 변형) 선언 그대로 */
.module-sources__section-title {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -.02em;
  margin: 70px 0 15px 0;
  padding-left: 15px;
  border-left: 4px solid var(--acc);
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line2);
  color: var(--ink);
  text-transform: none;
  text-wrap: balance;
}
@media (max-width:820px) {
  .module-sources__section-title { font-size: 21px; margin: 50px 0 13px 0; padding-left: 12px; border-left-width: 3px; }
}
@media (max-width:600px) {
  .module-sources__section-title { font-size: 19px; margin: 40px 0 12px 0; }
}


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
.module-sources { content-visibility: auto; contain-intrinsic-size: 0 600px; }   /* components.css:500 */
.module-sources { margin: 32px 0; }   /* modules.css:604 */
.module-sources__title { font-size: 1.1rem; font-weight: 700; color: #1e293b; margin: 0 0 12px 0; }   /* modules.css:612 */
.module-sources__item { font-size: 0.95rem; color: #475569; line-height: 1.7; margin-bottom: 6px; display: flex }   /* modules.css:619 */   /* 🔴 2026-09-23 — 라이브 유효값과 다른 칸을 뺐다 */
.module-sources__badge { border-radius: 50%; flex-shrink: 0 }   /* modules.css:631 */   /* 🔴 2026-09-23 — 라이브 유효값과 다른 칸을 뺐다 */
.module-sources__text { flex: 1; }   /* modules.css:640 */
.module-sources__link { flex-shrink: 0 }   /* modules.css:642 */   /* 🔴 2026-09-23 — 라이브 유효값과 다른 칸을 뺐다 */
.module-sources__list { display: flex; flex-direction: column; gap: 8px; counter-reset: source-counter; list-style: none; padding-left: 0; margin: 0; }   /* modules.css:5567 */
.module-sources__badge { width: 28px; height: 28px; border-radius: 50%; background: #ecfdf5; color: #059669; display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 800; flex-shrink: 0; line-height: 1; }   /* modules.css:5580 · HBS 09-28 · 12px → 13px(28px 원 안 번호) */
/* 번호 원천 = 이 한 곳(11-04 · 재발방지 대장 v11 33행 · MC-412): 배지 안 글자는 어떤 생산자가 넣어도 font-size:0 으로 가리고, 화면 번호는 ::before counter 하나만 보인다 */
.module-sources__badge { font-size: 0; }
.module-sources__badge::before { content: counter(source-counter); font-size: 13px; }
.module-sources__badge--tier-1 { background: #dcfce7; color: #16a34a; }   /* modules.css:5597 */
.module-sources__badge--tier-2 { background: #fef3c7; color: #b45309; }   /* modules.css:5599 */
.module-sources__badge--tier-3 { background: #f1f5f9; color: #4b5563; }   /* modules.css:5600 */
.module-sources__item { display: flex; align-items: flex-start; gap: 12px; background: #fff; border: 1px solid var(--color-border); border-radius: var(--color-radius-sm); padding: 12px 16px; transition: border-color .2s, box-shadow .2s; counter-increment: source-counter; }   /* modules.css:5601 */
.module-sources__item:hover { border-color: var(--color-primary); box-shadow: 0 2px 8px rgba(0,0,0,0.06); }   /* modules.css:5612 */
.module-sources__meta { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }   /* modules.css:5616 */
.module-sources__legend { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-bottom: 16px; padding: 12px 16px; background: #f8fafc; border: 1px solid var(--color-border); border-radius: var(--color-radius-sm); font-size: 14px; color: var(--color-text-secondary); line-height: 1.5; }   /* modules.css:5623 */
.module-sources__legend-item { display: inline-flex; align-items: flex-start; gap: 6px; }   /* modules.css:5637 */
.module-sources__legend-item .module-sources__tier { margin-top: 2px; }   /* modules.css:5642 */
.module-sources__tier { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 700; color: white; line-height: 1.4; flex-shrink: 0; letter-spacing: 0.3px; }   /* modules.css:5646 */
.module-sources__tier--1 { background: #16a34a; }   /* modules.css:5661 */
.module-sources__tier--2 { background: #f59e0b; }   /* modules.css:5662 */
.module-sources__tier--3 { background: #6b7280; }   /* modules.css:5663 */
.module-sources__text { font-size: 14px; font-weight: 600; color: var(--color-text-primary); flex: 1; line-height: 1.5; padding-top: 3px; }   /* modules.css:5664 */
.module-sources__link { display: inline-block; font-size: 13px; font-weight: 600; color: var(--color-primary) !important; background: var(--color-primary-light); padding: 4px 12px; border-radius: 20px; text-decoration: none !important; white-space: nowrap; flex-shrink: 0; transition: background .2s, color .2s; }   /* modules.css:5673 */
.module-sources__link:hover { background: var(--color-primary) !important; color: #fff !important; }   /* modules.css:5690 */
.module-sources__disclaimer { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px 20px; margin: 24px 0 8px; }   /* modules.css:5694 */
.module-sources__disclaimer p { font-size: 13px !important; font-style: italic; line-height: 1.7; color: #6b7280; margin: 0 0 4px; }   /* modules.css:5701 */
.module-sources__disclaimer strong { color: #111827; font-weight: 700; }   /* modules.css:5708 */
.module-sources__updated { font-style: italic; margin-top: 6px; margin-bottom: 0 }   /* modules.css:5712 */   /* 🔴 2026-09-23 — 라이브 유효값과 다른 칸을 뺐다 */
.module-sources__note { font-size: 16px; color: var(--color-text-muted); margin-top: 12px; padding-top: 8px; border-top: 1px dashed var(--color-border); }   /* modules.css:5844 · HBS 09-28 · 12px → 13px · HBY 09-28 · 13px → 16px(출처 설명 = 내용 글자 · 지휘자 판정) */
.module-sources__list li { margin-bottom: 6px; color: var(--color-text-body, #374151); }   /* modules.css:7357 */
.module-sources__list a { color: var(--color-primary, #1a73e8); text-decoration: underline; text-decoration-color: rgba(26, 115, 232, 0.3); }   /* modules.css:7363 */
.module-sources__list a:hover { text-decoration-color: var(--color-primary, #1a73e8); }   /* modules.css:7368 */
.module-sources__updated { display: inline-block; margin-left: 8px; padding: 2px 8px; background: var(--color-bg-light, #f7f8fa); color: var(--color-text-muted, #666); font-size: 13px; border-radius: 3px; }   /* modules.css:8351 */
.module-sources__pages { display: inline-block; margin-left: 6px; color: var(--color-text-muted, #888); font-size: 13px; font-style: italic; }   /* modules.css:8362 */
@media (max-width: 768px) {
  .module-sources__legend { flex-direction: column; gap: 6px; }   /* modules.css:5647 */
}
@media (max-width: 640px) {
  .module-sources__text { padding-top: 0; }   /* modules.css:5674 */
  .module-sources__item { flex-direction: column; align-items: flex-start; gap: 8px; }   /* modules.css:5720 */
}

/* ══════════════════════════════════════════════════════════════════════════
   🔴 우리 «확정 조정» — 이 아래는 라이브 이식분보다 «우선»한다.
   ══════════════════════════════════════════════════════════════════════════
   왜 이 구역이 필요한가(2026-09-23) =
     자동 이식(pull-live-module-css)이 파일 «끝»에 라이브 규칙을 덧붙이는데, 같은 선택자는
     «뒤가 이긴다». 그래서 사용자가 「크게 하라」고 해서 키워 둔 값이 라이브 원래 값으로
     조용히 되돌아갔다. 실측 = 위 4행 `.module-sources__tier { font-size:15px }` ↔
     이식 덩어리 `.module-sources__tier { font-size:11px }`(modules.css:5646) — 11px 이 이겼다.
     🔴 같은 사고가 오늘 share-buttons 에서도 났다(공유 단추가 남은 폭을 차지·미호버 파랑).
     ⇒ 이식분 «뒤»에 우리 확정값 구역을 두어 순서로 못박는다. 이식기는 이 표식 «앞»에만 끼운다.
   🔴 여기 적는 것은 «사용자가 라이브와 다르게 가기로 정한 값»뿐이다. 그 밖은 라이브 그대로 둔다.

   ① 출처 등급 배지 — 사용자 지시 「크게 하라」(라이브 11px → 15px · 여백·모서리도 함께 키움).
      이 배지가 「정부 공식 출처」 같은 «구역 제목» 자리에 쓰여서 11px 이면 제목으로 안 읽힌다. */
.module-sources__tier {
  font-size: 15px;
  padding: 4px 10px;
  border-radius: 5px;
  text-transform: none;
}
/*  ② 출처 본문 — 라이브·우리 둘 다 14px 이었는데 이 사이트 본문 기준은 16px 이다
      (실측 = `core/presets/shell/_shared/_global.css` 의 표·브리핑·입력 라벨이 전부 16px).
      출처 줄은 «읽는 본문»이지 주석이 아니므로 본문 기준에 맞춘다. 지어낸 값이 아니라 «기존 기준»이다. */
/* 🔴 2026-09-23 제거 — .module-sources__text 의 떠온 값이 라이브 «유효값»과 달랐다(라이브 자신이 뒤에서 덮는 낡은 정의를 떠 왔다). */
/*  ③ 구역 제목·설명 — ①과 같은 사유로 본문 기준에 맞춘다(제목 13px → 15px · 설명 0.95rem → 16px). */
.module-sources__group-label { font-size: 15px; }
.module-sources__group-desc { font-size: 16px; }
/*  ④ 출처 절 «위» 여백 — 사용자 지시 「.module-sources margin 32px 0 을 마진탑만 0으로 해」(2026-09-23).
      그 값은 라이브 이식분(modules.org modules.css:604 `margin: 32px 0`)이라 아래·좌우는 그대로 두고 위만 끈다.
      🔴 처음에 __group 을 고쳤다가 사용자 정정으로 되돌렸다(대상이 달랐다). */
.module-sources { margin-top: 0; }

/* core/modules/display/disclaimer/style.css */

.module-disclaimer--itemized { margin:16px 0 0; padding:14px 15px; border:1px solid var(--line); border-radius:var(--r); background:var(--surf2); }
.module-disclaimer--itemized .module-disclaimer__legal-body-title { margin:0 0 8px; font-size:14px; font-weight:800; color:var(--ink2); }
.module-disclaimer--itemized ul { margin:0; padding-left:17px; }
.module-disclaimer--itemized li { font-size:13px; color:var(--mut); line-height:1.75; }
aside.module-disclaimer--itemized { margin:16px 0 0; padding:14px 15px; border:1px solid var(--line); border-radius:var(--r); background:var(--surf2); }
aside.module-disclaimer--itemized .module-disclaimer__legal-body-title { margin:0 0 8px; font-size:14px; font-weight:800; color:var(--ink2); }
aside.module-disclaimer--itemized ul { margin:0; padding-left:17px; }
aside.module-disclaimer--itemized li { font-size:13px; color:var(--mut); line-height:1.75; }
aside.module-disclaimer--itemized li b { color:var(--ink2); font-weight:800; }
aside.module-disclaimer--itemized .module-disclaimer__legal-body-updated { margin:9px 0 0; font-size:13px; color:var(--mut); }
.module-disclaimer__post p.module-disclaimer__updated, .module-disclaimer__updated {
  font-size: 13px !important; /* HBS 09-28 · 12px → 13px */
  line-height: 1.5 !important;
  color: #9ca3af;
  font-style: italic;
  margin-top: 8px;
}
.module-disclaimer--text {
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  padding: 16px 20px;
  margin: 24px 0 8px;
  font-size: 13px;
  font-style: italic;
  line-height: 1.7;
  color: #6b7280;
}
.module-disclaimer--text p {
  font-size: 13px;
  font-style: italic;
  color: #6b7280;
  margin: 0 0 4px;
}
.module-disclaimer--text p:last-child { margin-bottom: 0; }


/* ── 짝 맞추기 — 마크업이 찍는데 규칙이 없던 이름 (2026-09-10 창D) ────────── */
/* 🔴 짝 맞추기(2026-09-10 창D) — 변형 표식 — 원본에 선언 없음.
   마크업이 이 이름을 찍는데 규칙이 없어 «자리»만 만든다. 생김새는 «창작하지 않는다»
   (선례 = display/pdf-embed/style.css .module-pdf-embed__title). */
.module-disclaimer--itemized {
}
/* 🔴 짝 맞추기(2026-09-10 창D) — 변형 표식 — 원본에 선언 없음.
   마크업이 이 이름을 찍는데 규칙이 없어 «자리»만 만든다. 생김새는 «창작하지 않는다»
   (선례 = display/pdf-embed/style.css .module-pdf-embed__title). */
.module-disclaimer--text {
}

/* 🔴 2026-09-23 라이브 규칙 이식 — 우리에 없던 것(실측: 이 화면에 걸리는데 우리 CSS 0건).
   출처 = 시세 로컬 assets/css/modules.css 의 .module-disclaimer 블록 «선언 그대로». */
.module-disclaimer { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px 20px; margin: 24px 0; }
.module-disclaimer p { font-size: 13px; font-style: italic; color: #6b7280; margin: 0 0 4px; }
.module-disclaimer p:last-child { margin-bottom: 0; }


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
.post p.module-disclaimer__updated { font-size: 12px !important; line-height: 1.5 !important; color: #9ca3af; font-style: italic; margin-top: 8px; }   /* modules.css:6487 */


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
.post p.module-disclaimer__updated { font-size: 13px !important; line-height: 1.5 !important; color: #9ca3af; font-style: italic; margin-top: 8px; }   /* modules.css:6487 · HBS 09-28 · 12px → 13px(이기는 선언) */
.module-disclaimer__updated { font-size: 13px !important; /* HBS 09-28 · 12px → 13px(이기는 선언) */ line-height: 1.5 !important; color: #9ca3af; font-style: italic; margin-top: 8px; }   /* modules.css:6487 */
.module-disclaimer { background: #f9fafb; border: 1px solid #e5e7eb; border-radius: 8px; padding: 16px 20px; margin: 24px 0 8px; font-size: 13px; font-style: italic; line-height: 1.7; color: #6b7280; }   /* modules.css:7376 */
.module-disclaimer p { font-size: 13px; font-style: italic; color: #6b7280; margin: 0 0 4px; }   /* modules.css:7388 */
.module-disclaimer p:last-child { margin-bottom: 0; }   /* modules.css:7394 */

/* core/modules/display/list-row/style.css */
/* list-row/style.css — 라이브 CSS 원문 재구성(2026-09-08 fable2) · 재료 = _sandbox/모듈최종형식-20260907/_live-all.css(주석 제거본 = tcggrail·modoocard assets/css 7파일)
   규칙 = 계열 13종에 걸린 라이브 규칙 698개(@media 안 104개) · 같은 선택자 여러 벌은 «전부 순서대로» · @media 껍데기 보존 · 페이지 문맥 조상(landing-page 계열 여섯 이름)만 떼고 규칙은 살림 · 값 창작 0
   계열 = module-list-row__ranked-thumbnail-card ranked-thumbnail-list-artist-row distribution-bar-label-row module-list-row__ranked-thumbnail-card-rows ranked-thumbnail-list-gap-rows ranked-thumbnail-list-artist-header u-visual-block-box ranked-thumbnail-list-group-header holo-thumb-popup-thumb card-image-fallback module-list-row__card-number-plain u-tabular-number section-footnote-line */
.module-list-row__distribution-bar-label { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:0 0 8px; font-size:15px; margin-bottom:4px; }
@media (max-width:820px) {
}
@media (max-width:640px) {
}
@media (max-width:1100px) {
}
.module-list-row__ranked-thumbnail-card-picture { position:relative; display:block; width: auto; aspect-ratio:745/1040; align-self:center; border-radius:4px; overflow:hidden; border:1px solid var(--line2); background:var(--surf2); box-sizing:border-box; height: 46.5px; left: 0; top: 0; }
.module-list-row__ranked-thumbnail-card-picture img { width:100%; height:100%; object-fit:cover; display:block; object-position:center top; }
.module-list-row__ranked-thumbnail-card-rows { margin:0 0 14px; border:1px solid var(--line); border-radius:var(--r-s); background:var(--surf2); overflow:hidden; margin-top:12px; }
.module-list-row__ranked-thumbnail-card { display:grid; grid-template-columns:auto minmax(0,1fr)225px auto auto; gap:10px; align-items:center; min-height:41px; padding:7px 12px; border-top:1px solid var(--line); font-size:15px; color:var(--ink2); text-decoration:none; min-width:0; position:relative; }
@media (max-width:700px) {
.module-list-row__ranked-thumbnail-card-picture { grid-column:2/3; grid-row:1/span 2; align-self:center; }
.module-list-row__ranked-thumbnail-card-subtitle { grid-column:2/3; grid-row:2; font-size:13px; }
.module-list-row__ranked-thumbnail-card-title { grid-column:3/4; grid-row:2; align-self:center; font-size:13px; text-align:right; }
}
@container (max-width:80px) {
}
@container (max-width:64px) {
}

.module-list-row__ranked-thumbnail-card-rows { border:1px solid var(--line); border-radius:var(--r-s); background:var(--surf2); margin-top:12px; overflow:hidden; margin:0 0 14px; }
.module-list-row__ranked-thumbnail-card { display:grid; grid-template-columns:44px 28px minmax(0,1fr) minmax(0,220px) auto minmax(0,132px); gap:10px; align-items:center; padding:0 12px; border-top:1px solid var(--line); font-size:15px; color:var(--ink2); text-decoration:none; min-width:0; position:relative; min-height:41px; }
.module-list-row__ranked-thumbnail-gap-rows>.module-list-row__ranked-thumbnail-card-rows--peek { margin-top:0; border-radius:0; margin-bottom: 0; }

.module-list-row__ranked-thumbnail-artist-picture { position:relative; display:block; width:40px; aspect-ratio:745/1040; border-radius:5px; overflow:hidden; border:1px solid var(--line2); background:var(--surf2); flex:0 0 auto; justify-self:center; }
.module-list-row__ranked-thumbnail-artist { display:grid; grid-template-columns:88px minmax(0,1.15fr)82px 74px minmax(0,1.35fr); gap:10px; align-items:center; padding:7px 12px; border-top:1px solid var(--line); font-size:15px; color:var(--ink2); text-decoration:none; }
.module-list-row__ranked-thumbnail-artist-content { font-weight:800; color:var(--acc-i); font-variant-numeric:tabular-nums; text-align:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }


@container (max-width:64px) {
}
@container (max-width:80px) {
}
@media (max-width:1100px) {
}
@media (max-width:860px) {

}
@media (max-width:820px) {

}
@media (max-width:720px) {
}
@media (max-width:700px) {
.module-list-row__ranked-thumbnail-card { grid-template-columns:38px 28px minmax(0,1fr) auto; row-gap:2px; }
}
@media (max-width:640px) {
}
@media (max-width:560px) {

}
@media (max-width:560px) {
}
.module-list-row__ranked-thumbnail-gap-rows > .module-list-row__ranked-thumbnail-card-rows--peek { margin-bottom: 0; margin-top:0; border-radius:0; }
@media (max-width:700px) {
}

@media (max-width:860px) {

}
@media (max-width:820px) {
}
@media (max-width:820px) {
}
@media (max-width:700px) {
}
@media (scripting: none) {
}
@media (scripting: none) and (prefers-reduced-motion: reduce) {
}
@media (prefers-reduced-motion: reduce) {
}

.u-tabular-number {
  font-variant-numeric: tabular-nums;
}
.module-list-row__distribution-bar-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 0 0 8px;
}
.module-list-row__distribution-bar-label h3 {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: var(--ink2);
}
.module-list-row__distribution-bar-label a {
  font-size: 13px;
  color: var(--acc-i);
  text-decoration: none;
  font-weight: 700;
}
.u-visual-block-box {
  margin: 0 0 14px;
}
.module-list-row__page-contents-outline a, .module-list-row__cross-link-column a, .module-list-row__footer-link-grid a, .module-list-row__rank-block-followup-note a, .module-list-row__distribution-bar-label a, .u-summary-return-anchor, .module-list-row__card-grid-deep-dive-panel a {
  text-underline-offset: 3px;
  text-decoration-thickness: 1.5px;
  text-decoration-color: color-mix(in srgb,currentColor 55%,transparent);
}
.module-list-row__page-contents-outline a:hover, .module-list-row__page-contents-outline a:focus-visible, .module-list-row__cross-link-column a:hover, .module-list-row__cross-link-column a:focus-visible, .module-list-row__footer-link-grid a:hover, .module-list-row__footer-link-grid a:focus-visible, .module-list-row__rank-block-followup-note a:hover, .module-list-row__rank-block-followup-note a:focus-visible, .module-list-row__distribution-bar-label a:hover, .module-list-row__distribution-bar-label a:focus-visible, .u-summary-return-anchor:hover, .u-summary-return-anchor:focus-visible, .module-list-row__card-grid-deep-dive-panel a:hover, .module-list-row__card-grid-deep-dive-panel a:focus-visible {
  text-decoration: underline;
}
.module-list-row__ranked-thumbnail-bar-picture .module-popup__card-image-fallback {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  border: 0;
  border-radius: 8px;
}
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback {
  display: grid;
  grid-template-rows: auto 1fr auto;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  border: 1px solid var(--line2);
  border-radius: 6px;
  background: var(--surf2);
  padding: 3px 4px;
  gap: 1px;
  text-align: center;
  overflow: hidden;
}
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback-header {
  display: block;
  min-width: 0;
}
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback-name {
  display: block;
  font-size: 13px; /* HBS 09-28 · 9px → 13px(썸네일 대체 글자 · 넘침 확인 대상) */
  font-weight: 800;
  line-height: 1.15;
  color: var(--ink2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
}
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback-artwork {
  display: grid;
  place-items: center;
  min-height: 0;
}
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback-meta {
  font-size: 13px; /* HBS 09-28 · 8px → 13px */
  font-style: normal;
  line-height: 1.1;
  color: var(--mut);
}
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback-footer {
  display: flex;
  justify-content: space-between;
  gap: 2px;
  min-width: 0;
}
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback-set {
  font-size: 13px; /* HBS 09-28 · 8px → 13px */
  font-weight: 700;
  line-height: 1.1;
  color: var(--mut);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 64%;
}
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback-content {
  font-size: 13px; /* HBS 09-28 · 8px → 13px */
  font-style: normal;
  line-height: 1.1;
  color: var(--mut);
}
@media (max-width:820px) {
.module-list-row__price-trend-line-titled-box, .u-visual-block-box.module-list-row__key-facts-visual-box-table-scroll, .module-list-row__card-grid-deep-dive-panel, .module-list-row__footnote-block, .module-list-row__cross-link-column {
    padding-left: 12px;
    padding-right: 12px;
  }
}
.module-list-row__table-scroll-hint+.module-list-row__prose-body-block, .module-list-row__table-scroll-hint+.u-visual-block-box {
  margin-top: 2px;
}
.module-popup__thumb-grid-cell, .module-popup__thumb-grid-cell-image, .module-popup__thumb-grid-cell-picture, .module-popup__card-image-tile, .module-popup__card-image-tile-name, .module-popup__card-image-tile-rank, .module-popup__card-image-tile-value, .module-list-row__three-card-arc-display, .module-list-row__three-card-arc-display-picture, .module-popup__thumb-image, .module-popup__thumb-title, .module-popup__thumb-name, .module-list-row__chain-diagram-link-content, .module-list-row__chain-diagram-link-picture, .module-list-row__versus-compare-side, .module-list-row__versus-compare-side-picture, .module-list-row__sibling-axis-link-card-image, .module-list-row__ranked-thumbnail-artist-width, .module-list-row__marketplace-logo, .module-list-row__rail-p {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}
@media (max-width:640px) {
}
@media (max-width:1100px) {
}
.module-list-row__section-footnote-line {
  font-size: 13.2px;
  color: var(--mut);
  margin: 8px 0 0;
}
.module-popup__thumb-image>img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  pointer-events: none;
}
.module-popup__card-image-fallback {
  background: var(--surf2);
}
.module-popup__thumb-image.module-popup__card-image-fallback::after {
  content: "No image";
  position: absolute;
  left: 0;
  right: 0;
  top: 36%;
  text-align: center;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .03em;
  color: var(--mut);
}
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback {
  background: var(--surf2);
  border: 1px solid var(--line2);
  display: grid;
  grid-template-rows: auto 1fr auto;
  padding: 13px 14px;
  place-items: stretch;
}
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback::before {
  content: attr(data-nm);
  font-size: 14px;
  font-weight: 800;
  color: var(--ink2);
  line-height: 1.35;
  align-self: start;
}
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback::after {
  content: attr(data-no);
  font-size: 12px;
  font-weight: 700;
  color: var(--mut);
  align-self: end;
  text-align: right;
}
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback>.module-popup__card-image-fallback-meta {
  align-self: center;
  text-align: center;
  font-size: 12px;
  line-height: 1.55;
  color: var(--mut);
}
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback::after { font-size: 13px }
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback>.module-popup__card-image-fallback-meta { font-size: 13px }
a.module-list-row__primary-action-button .u-tabular-number, a.module-list-row__primary-action-button:hover .u-tabular-number { color: #fff }
a.module-list-row__primary-action-button.module-list-row__app-layer-primary-action-button--question .u-tabular-number { color: var(--ink) }
a.module-list-row__primary-action-button.module-list-row__app-layer-primary-action-button--question:hover .u-tabular-number { color: #fff }
.module-list-row__ranked-thumbnail-bar-picture .module-popup__card-image-fallback {
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 2px;
  padding: 5px 4px;
  text-align: center;
  overflow: hidden;
  background: var(--surf2);
}
.module-list-row__ranked-thumbnail-bar-picture .module-popup__card-image-fallback-header { display: block; min-width: 0 }
.module-list-row__ranked-thumbnail-bar-picture .module-popup__card-image-fallback-name {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 13px; /* HBS 09-28 · 10px → 13px */
  font-weight: 800;
  line-height: 1.2;
  color: var(--ink2);
}
.module-list-row__ranked-thumbnail-bar-picture .module-popup__card-image-fallback-artwork { display: grid; place-items: center; min-height: 0 }
.module-list-row__ranked-thumbnail-bar-picture .module-popup__card-image-fallback-meta {
  font-size: 13px; /* HBS 09-28 · 8.5px → 13px */
  font-style: normal;
  line-height: 1.1;
  color: var(--mut);
}
.module-list-row__ranked-thumbnail-bar-picture .module-popup__card-image-fallback-footer { display: flex; justify-content: space-between; gap: 2px; min-width: 0 }
.module-list-row__ranked-thumbnail-bar-picture .module-popup__card-image-fallback-set {
  font-size: 13px; /* HBS 09-28 · 8px → 13px */
  font-weight: 700;
  line-height: 1.1;
  color: var(--mut);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.module-list-row__ranked-thumbnail-bar-picture .module-popup__card-image-fallback-content {
  font-size: 13px; /* HBS 09-28 · 8px → 13px */
  font-style: normal;
  line-height: 1.1;
  color: var(--mut);
}
.module-list-row__ranked-thumbnail-card-picture {position:relative;display:block;width:28px;aspect-ratio:745/1040;align-self:center;
  border-radius:4px;overflow:hidden;border:1px solid var(--line2);background:var(--surf2)}
.module-list-row__ranked-thumbnail-card-picture img {width:100%;height:100%;object-fit:cover;display:block}
.module-list-row__ranked-thumbnail-card-picture--none {border:0;background:transparent}
.module-list-row__ranked-thumbnail-card-picture--none .module-popup__card-image-fallback {width:100%;height:100%;aspect-ratio:auto;border-radius:4px}
.module-list-row__distribution-bar .module-list-row__distribution-bar-label {gap:10px;margin:0 0 4px;font-size:15px}
.module-list-row__distribution-bar .module-list-row__distribution-bar-label .module-list-row__bar-heading-line {display:flex;align-items:center;gap:7px;min-width:0}
.module-list-row__distribution-bar .module-list-row__distribution-bar-label .module-list-row__bar-heading-line>b {overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.module-list-row__distribution-bar .module-list-row__distribution-bar-label .module-list-row__bar-heading-line>span {flex:0 0 auto;color:var(--mut);font-variant-numeric:tabular-nums}
.module-list-row__distribution-bar .module-list-row__distribution-bar-label>b {flex:0 0 auto;font-weight:800}
.module-list-row__ranked-thumbnail-card-rows {margin:0 0 14px;border:1px solid var(--line);border-radius:var(--r-s);
  background:var(--surf2);overflow:hidden}
.module-list-row__ranked-thumbnail-card {display:grid;grid-template-columns:44px 28px minmax(0,1fr) minmax(0,220px) auto minmax(0,132px);
  gap:10px;align-items:center;min-height:41px;padding:0 12px;
  border-top:1px solid var(--line);font-size:15px;color:var(--ink2);text-decoration:none}
.module-list-row__ranked-thumbnail-card:hover, .module-list-row__ranked-thumbnail-card:focus-visible {background:var(--surf);color:var(--ink)}
.module-list-row__ranked-thumbnail-card>* {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.module-list-row__ranked-thumbnail-card-rank {font-size:13px;color:var(--mut);font-variant-numeric:tabular-nums}
.module-list-row__ranked-thumbnail-card-name {font-weight:700;color:var(--ink)}
.module-list-row__ranked-thumbnail-card-subtitle {display:flex;align-items:baseline;gap:5px;font-size:13px;color:var(--mut)}
.module-list-row__ranked-thumbnail-card-subtitle>b {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:inherit}
.module-list-row__ranked-thumbnail-card-subtitle>i {flex:0 0 auto;font-style:normal;font-variant-numeric:tabular-nums}
.module-list-row__ranked-thumbnail-card-description {font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;text-align:right}
.module-list-row__ranked-thumbnail-card-title {font-size:13px;color:var(--acc-i);text-align:right}
.module-list-row__ranked-thumbnail-card-rank, .module-list-row__ranked-thumbnail-card-description {overflow:visible;text-overflow:clip;min-width:max-content}
@media (max-width:700px) {
.module-list-row__ranked-thumbnail-card {grid-template-columns:38px 28px minmax(0,1fr) auto;row-gap:2px}
.module-list-row__ranked-thumbnail-card-rank {grid-column:1/2;grid-row:1}
.module-list-row__ranked-thumbnail-card-picture {grid-column:2/3;grid-row:1/span 2}
.module-list-row__ranked-thumbnail-card-name {grid-column:3/4;grid-row:1}
.module-list-row__ranked-thumbnail-card-subtitle {grid-column:3/4;grid-row:2}
.module-list-row__ranked-thumbnail-card-description {grid-column:4/5;grid-row:1}
.module-list-row__ranked-thumbnail-card-title {grid-column:4/5;grid-row:2;align-self:center}
}
.module-list-row__ranked-thumbnail-feature-cell-picture.module-popup__card-image-fallback {display:grid;place-content:center;gap:3px;padding:8px;text-align:center;
  background:var(--surf2);border:1px dashed var(--line2)}
.module-list-row__ranked-thumbnail-feature-cell-picture.module-popup__card-image-fallback .module-popup__card-image-fallback-name {font-size:13px;font-weight:800;line-height:1.25;color:var(--ink2)}
.module-list-row__ranked-thumbnail-feature-cell-picture.module-popup__card-image-fallback .module-popup__card-image-fallback-set, .module-list-row__ranked-thumbnail-feature-cell-picture.module-popup__card-image-fallback .module-popup__card-image-fallback-content {font-size:13px;color:var(--mut)}
.module-popup__card-image-tile .module-popup__card-image-fallback {display:grid;place-content:center;height:100%;padding:6px 5px 20px;text-align:center}
.module-popup__card-image-tile .module-popup__card-image-fallback-name {font-size:13px;font-weight:800;line-height:1.25;color:var(--mut)}
.module-popup__card-image-fallback {position:relative;display:grid;grid-template-rows:auto 1fr auto;gap:4px;
  aspect-ratio:745/1040;padding:7px 7px 8px;border-radius:6px;
  background:var(--surf2);border:1px solid var(--line2);cursor:default;
  overflow:hidden;text-align:left;
  container-type:inline-size}
.module-popup__card-image-fallback-header, .module-popup__card-image-fallback-footer {display:flex;align-items:baseline;justify-content:space-between;gap:5px;
  min-width:0;padding:2px 5px;border-radius:4px;background:var(--line2)}
.module-popup__card-image-fallback-name {font-size:13px;font-weight:800;color:var(--ink2);line-height:1.3;min-width:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.module-popup__card-image-fallback-hp, .module-popup__card-image-fallback-content {flex:0 0 auto;font-style:normal;font-size:13px;font-weight:700;
  color:var(--mut);font-variant-numeric:tabular-nums;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.module-popup__card-image-fallback-set {min-width:0;font-size:13px;font-weight:700;color:var(--mut);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.module-popup__card-image-fallback-artwork {grid-row:2;display:grid;place-items:center;min-height:0;border-radius:4px;
  background:var(--surf);overflow:hidden}
.module-popup__card-image-fallback-meta {margin:0;text-align:center;font-size:13px;font-style:normal;
  font-weight:700;color:var(--mut);line-height:1.35;word-break:keep-all;padding:0 4px}
.module-popup__card-image-fallback-hp:empty, .module-popup__card-image-fallback-content:empty, .module-popup__card-image-fallback-set:empty {min-height:0}
.module-popup__card-image-fallback--small {padding:5px 6px;gap:3px}
@container (max-width:80px) {
.module-popup__card-image-fallback-set, .module-popup__card-image-fallback-hp, .module-popup__card-image-fallback-content {display:none}
}
@container (max-width:64px) {
.module-popup__card-image-fallback-header, .module-popup__card-image-fallback-footer {display:none}
}
.module-popup__card-image-fallback--row {grid-template-rows:1fr;padding:0;gap:0}
.module-popup__card-image-fallback--row .module-popup__card-image-fallback-header, .module-popup__card-image-fallback--row .module-popup__card-image-fallback-footer {display:none}
.module-popup__card-image-fallback--row .module-popup__card-image-fallback-artwork {grid-row:1;background:transparent;border-radius:0}
.module-popup__card-image-fallback--row .module-popup__card-image-fallback-meta {font-size:13px;font-weight:800;line-height:1;color:var(--line2)}
.module-popup__card-image-fallback:hover {transform:none;box-shadow:none;border-color:var(--line2)}
a.module-popup__card-image-fallback, a .module-popup__card-image-fallback, a .module-popup__card-image-fallback * {cursor:pointer}
.module-popup__card-image-tile .module-popup__card-image-fallback-header, .module-popup__card-image-tile .module-popup__card-image-fallback-footer {display:none}
.module-popup__thumb-grid-cell-image>.module-popup__card-image-fallback {width:100%;height:100%;aspect-ratio:auto;position:relative;z-index:1}
.u-tabular-number { font-variant-numeric:tabular-nums; }

.module-list-row__distribution-bar-label s { text-decoration:none; font-size:13px; color:var(--mut); font-weight:700; flex:0 0 auto; }
.u-visual-block-box { margin:0 0 14px; border:0; }
.module-list-row__distribution-bar-label { display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:15px; margin-bottom:4px; margin:0 0 8px; }
.module-list-row__distribution-bar-label .module-list-row__bar-heading-line { display:flex; align-items:center; gap:7px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.module-list-row__distribution-bar-label b { font-variant-numeric:tabular-nums; font-weight:800; flex:0 0 auto; }
.module-list-row__distribution-bar-label h3 { margin:0; font-size:15px; font-weight:700; color:var(--ink2); }
.module-list-row__distribution-bar-label a { font-size:13px; color:var(--acc-i); text-decoration:none; font-weight:700; text-underline-offset:3px; text-decoration-thickness:1.5px; text-decoration-color:color-mix(in srgb,currentColor 55%,transparent); }
.module-list-row__ranked-thumbnail-card:first-of-type { border-top:0; }
.module-list-row__ranked-thumbnail-card:focus-visible { background:var(--surf2); color:var(--ink); }
.module-list-row__ranked-thumbnail-card-name-oneline { display:block; font-size:14px; font-weight:700; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.module-list-row__ranked-thumbnail-card-subtitle-oneline { display:block; margin-top:2px; font-size:13px; color:var(--mut); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.module-list-row__ranked-thumbnail-card-value { font-size:16px; font-weight:800; text-align:right; font-variant-numeric:tabular-nums; color:var(--ink); }
.module-list-row__ranked-thumbnail-card-multiple { font-size:13px; font-weight:700; color:var(--mut); text-align:right; font-variant-numeric:tabular-nums; }
.module-popup__card-image-tile-grid--info .module-popup__card-image-fallback {
  display: grid;
  grid-template-rows: none;
  place-content: center;
  padding: 4px;
  text-align: center;
}
.module-popup__card-image-tile-grid--info .module-popup__card-image-fallback-name {
  font-size: 13px;
  font-weight: 800;
  color: var(--mut);
  white-space: normal;
  -webkit-line-clamp: 3;
}
.module-list-row__versus-panel-compare-side-picture--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:8px; }
.module-list-row__ranked-thumbnail-card-rows { border:1px solid var(--line); border-radius:var(--r-s); background:var(--surf2); margin-top:12px; overflow:hidden; }
.module-list-row__ranked-thumbnail-card { display:grid; grid-template-columns:auto minmax(0,1fr)225px auto auto; gap:10px; align-items:center; padding:7px 12px; border-top:1px solid var(--line); font-size:15px; color:var(--ink2); text-decoration:none; min-width:0; position:relative; }
.module-list-row__ranked-thumbnail-card:first-child { border-top:0; }
.module-list-row__ranked-thumbnail-card:hover { background:var(--surf); color:var(--ink); }
.module-list-row__ranked-thumbnail-card>* { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.module-list-row__ranked-thumbnail-card-rank { font-size:13px; color:var(--mut); font-variant-numeric:tabular-nums; overflow:visible; text-overflow:clip; }
.module-list-row__ranked-thumbnail-card-name { font-weight:700; color:var(--ink); }
.module-list-row__ranked-thumbnail-card-subtitle { font-size:13px; color:var(--mut); }
.module-list-row__ranked-thumbnail-card-description { font-weight:800; color:var(--dn); font-variant-numeric:tabular-nums; text-align:right; overflow:visible; text-overflow:clip; font-size:14px; }
.module-list-row__ranked-thumbnail-card-title { font-size:13px; color:var(--mut); text-align:right; overflow:visible; text-overflow:clip; }
.module-list-row__ranked-thumbnail-card-picture { box-sizing:border-box; position:relative; display:block; width:28px; height:31px; border-radius:4px; overflow:hidden; border:1px solid var(--line2); background:var(--surf2); aspect-ratio:745/1040; align-self:center; left:12px; top:7px; }
.module-list-row__ranked-thumbnail-card-picture img { width:100%; height:100%; object-fit:cover; object-position:center top; display:block; }
.module-list-row__ranked-thumbnail-card-picture--none { border:0; background:transparent; }
.module-list-row__ranked-thumbnail-card-picture--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:4px; }
.module-list-row__ranked-thumbnail-gap-rows { margin-bottom:12px; }
.module-list-row__ranked-thumbnail-gap-rows-heading { display:flex; align-items:center; gap:11px; padding:10px 13px; border:1px solid var(--line); border-bottom:0; border-radius:var(--r-s)var(--r-s)0 0; background:var(--surf); }
.module-list-row__ranked-thumbnail-gap-rows-body { flex:1 1 auto; min-width:0; }
.module-list-row__ranked-thumbnail-gap-rows-title { display:block; font-size:14.6px; font-weight:800; line-height:1.3; color:var(--ink); }
.module-list-row__ranked-thumbnail-gap-rows-description { display:block; font-size:13px; color:var(--mut); margin-top:2px; }
.module-list-row__ranked-thumbnail-gap-rows>.module-list-row__ranked-thumbnail-card-rows--peek { margin-top:0; border-radius:0; }
.module-list-row__ranked-thumbnail-gap-rows>details.module-list-row__remaining-fold { margin-bottom:0; }
.module-list-row__ranked-thumbnail-gap-rows>details.module-list-row__remaining-fold>summary.module-list-row__unfold-button { border-radius:0 0 var(--r-s)var(--r-s); margin-top:0; width:100%; }
.module-list-row__ranked-thumbnail-gap-rows>details.module-list-row__remaining-fold[open]>summary.module-list-row__unfold-button { border-radius:0; }
.module-list-row__ranked-thumbnail-gap-rows>details.module-list-row__remaining-fold>.module-list-row__ranked-thumbnail-card-rows { margin-top:0; border-top:0; border-radius:0 0 var(--r-s)var(--r-s); }
.module-list-row__ranked-thumbnail-gap-rows>.module-list-row__ranked-thumbnail-card-rows--peek:first-child { border-radius:var(--r-s)var(--r-s)0 0; }

.module-list-row__distribution-bar-label a:hover { text-decoration:underline; }
.module-list-row__distribution-bar-label a:focus-visible { text-decoration:underline; }
.module-list-row__ranked-thumbnail-artist-picture { position:relative; display:block; width:40px; aspect-ratio:745/1040; border-radius:5px; overflow:hidden; border:1px solid var(--line2); background:var(--surf2); flex:0 0 auto; justify-self:end; }
.module-list-row__ranked-thumbnail-artist-picture img { width:100%; height:100%; object-fit:cover; display:block; }
.module-list-row__ranked-thumbnail-artist-picture b { position:absolute; left:0; top:0; padding:0 5px; border-radius:0 0 5px 0; background:rgba(0,0,0,.66); color:#fff; font-size:13px; font-weight:800; line-height:1.45; font-variant-numeric:tabular-nums; }
.module-list-row__ranked-thumbnail-artist-picture--none { border:0; background:transparent; }
.module-list-row__ranked-thumbnail-artist-picture--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:5px; }
.module-popup__card-image-fallback { position:relative; display:grid; grid-template-rows:auto 1fr auto; gap:4px; aspect-ratio:745/1040; padding:7px 7px 8px; border-radius:6px; background:var(--surf2); border:1px solid var(--line2); cursor:default; overflow:hidden; text-align:left; container-type:inline-size; }
.module-popup__card-image-fallback-header { display:flex; align-items:baseline; justify-content:space-between; gap:5px; min-width:0; padding:2px 5px; border-radius:4px; background:var(--line2); }
.module-popup__card-image-fallback-footer { display:flex; align-items:baseline; justify-content:space-between; gap:5px; min-width:0; padding:2px 5px; border-radius:4px; background:var(--line2); }
.module-popup__card-image-fallback-name { font-size:13px; font-weight:800; color:var(--ink2); line-height:1.3; min-width:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.module-popup__card-image-fallback-hp { flex:0 0 auto; font-style:normal; font-size:13px; font-weight:700; color:var(--mut); font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.module-popup__card-image-fallback-content { flex:0 0 auto; font-style:normal; font-size:13px; font-weight:700; color:var(--mut); font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.module-popup__card-image-fallback-set { min-width:0; font-size:13px; font-weight:700; color:var(--mut); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.module-popup__card-image-fallback-artwork { grid-row:2; display:grid; place-items:center; min-height:0; border-radius:4px; background:var(--surf); overflow:hidden; }
.module-popup__card-image-fallback-meta { margin:0; text-align:center; font-size:13px; font-style:normal; font-weight:700; color:var(--mut); line-height:1.35; word-break:keep-all; padding:0 4px; }
.module-popup__card-image-fallback-hp:empty { min-height:0; }
.module-popup__card-image-fallback-content:empty { min-height:0; }
.module-popup__card-image-fallback-set:empty { min-height:0; }
.module-popup__card-image-fallback--small { padding:5px 6px; gap:3px; }
.module-list-row__ranked-thumbnail-bar-picture .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border:0; border-radius:8px; }
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback { display:grid; grid-template-rows:auto 1fr auto; width:100%; height:100%; aspect-ratio:auto; border:1px solid var(--line2); border-radius:6px; background:var(--surf2); padding:3px 4px; gap:1px; text-align:center; overflow:hidden; }
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback-artwork { display:grid; place-items:center; min-height:0; }
.module-popup__card-image-fallback--row { grid-template-rows:1fr; padding:0; gap:0; }
.module-popup__card-image-fallback--row .module-popup__card-image-fallback-header { display:none; }
.module-popup__card-image-fallback--row .module-popup__card-image-fallback-footer { display:none; }
.module-popup__card-image-fallback--row .module-popup__card-image-fallback-artwork { grid-row:1; background:transparent; border-radius:0; }
.module-popup__card-image-fallback--row .module-popup__card-image-fallback-meta { font-size:13px; font-weight:800; line-height:1; color:var(--line2); }
.module-popup__card-image-fallback:hover { transform:none; box-shadow:none; border-color:var(--line2); }
a.module-popup__card-image-fallback { cursor:pointer; }
a .module-popup__card-image-fallback { cursor:pointer; }
a .module-popup__card-image-fallback * { cursor:pointer; }
.module-popup__card-image-tile .module-popup__card-image-fallback-header { display:none; }
.module-popup__card-image-tile .module-popup__card-image-fallback-footer { display:none; }
.module-list-row__ranked-thumbnail-artist { display:grid; grid-template-columns:88px minmax(0,1.15fr)auto 74px minmax(0,1.35fr); gap:10px; align-items:center; padding:7px 12px; border-top:1px solid var(--line); font-size:15px; color:var(--ink2); text-decoration:none; }
.module-list-row__ranked-thumbnail-artist:first-child { border-top:0; }
.module-list-row__ranked-thumbnail-artist:hover { background:var(--surf); color:var(--ink); }
.module-list-row__ranked-thumbnail-artist>* { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.module-list-row__ranked-thumbnail-artist-rank { font-size:13px; color:var(--mut); font-variant-numeric:tabular-nums; overflow:visible; text-overflow:clip; }
:is(.module-list-row__content-section-block, .module-list-row__app-layer-panel, .module-list-row__page-summary-box)>.module-list-row__ranked-thumbnail-gap-rows+.module-list-row__ranked-thumbnail-gap-rows { margin-top:12px; }
.module-list-row__ranked-thumbnail-artist-name { font-weight:700; color:var(--ink); }
.module-list-row__ranked-thumbnail-artist-content { font-weight:800; color:var(--acc-i); font-variant-numeric:tabular-nums; text-align:right; overflow:visible; text-overflow:clip; }
.module-list-row__ranked-thumbnail-artist-subtitle { font-size:14px; font-variant-numeric:tabular-nums; text-align:right; overflow:visible; text-overflow:clip; }
.module-list-row__visual-block-box--split { display:grid; grid-template-columns:minmax(300px,360px)minmax(0,1fr); gap:16px; align-items:center; }
.module-list-row__visual-block-box--split>* { min-width:0; }
.module-list-row__ranked-thumbnail-artist-width img { width:40px; height:auto; aspect-ratio:745/1040; object-fit:cover; border-radius:4px; border:1px solid var(--line2); flex:0 0 auto; }
.module-list-row__ranked-thumbnail-artist-width span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.module-list-row__ranked-thumbnail-share-picture--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:4px; }
.module-popup__card-image-tile-grid--set .module-popup__card-image-tile--none .module-popup__card-image-fallback { position:absolute; left:0; right:0; top:0; bottom:0; aspect-ratio:auto; border:0; border-radius:0; padding:22px 7px 30px; }

.module-list-row__ranked-thumbnail-artist-width { -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; -webkit-user-drag:none; display:flex; align-items:center; gap:7px; font-size:13px; color:var(--mut); }
.module-list-row__table-card-thumbnail .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border:0; border-radius:4px; }
.module-list-row__ranked-thumbnail-card--pokedex .module-list-row__ranked-thumbnail-card-description { color:var(--ink); }
.module-list-row__section-footnote-line { font-size:14px; color:var(--mut); margin:8px 0 14px; line-height:1.6; }
.module-list-row__section-footnote-line b { color:var(--ink2); font-weight:800; }
.module-list-row__board-image--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:5px; }
.module-list-row__imageless-card-link .module-popup__card-image-fallback { width:100%; aspect-ratio:745/1040; }
.module-list-row__imageless-card-link:hover .module-popup__card-image-fallback { border-color:var(--acc); }
table td .u-tabular-number { white-space:nowrap; }
table .u-tabular-number { white-space:nowrap; }
.module-list-row__table-scroll-hint+.u-visual-block-box { margin-top:2px; }
.module-popup__thumb-image>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; pointer-events:none; }
.module-popup__thumb-image.module-popup__card-image-fallback::after { content:"No image"; position:absolute; left:0; right:0; top:34%; text-align:center; font-size:13px; font-weight:600; letter-spacing:.03em; color:var(--mut); }
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback { background:var(--surf2); border:1px solid var(--line2); display:grid; grid-template-rows:auto 1fr auto; padding:13px 14px; place-items:stretch; }
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback::before { content:attr(data-nm); font-size:14px; font-weight:800; color:var(--ink2); line-height:1.35; align-self:start; }
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback::after { content:attr(data-no); font-size:13px; font-weight:700; color:var(--mut); align-self:end; text-align:right; }
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback>.module-popup__card-image-fallback-meta { align-self:center; text-align:center; font-size:13px; line-height:1.55; color:var(--mut); }
.module-popup__thumb-grid>* { min-width:0; }
.module-list-row__app-layer-meta-tile-value.u-tabular-number { overflow:visible; text-overflow:clip; white-space:nowrap; }
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback.module-popup__card-image-fallback--row { grid-template-rows:1fr; padding:0; gap:0; }
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback--row .module-popup__card-image-fallback-header { display:none; }
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback--row .module-popup__card-image-fallback-footer { display:none; }
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback--row .module-popup__card-image-fallback-artwork { grid-row:1; background:transparent; border-radius:0; }
.module-list-row__badge-bar-picture--none .module-popup__card-image-fallback--row .module-popup__card-image-fallback-meta { font-size:13px; font-weight:800; line-height:1; color:var(--line2); }
@container (max-width:64px) {
.module-popup__card-image-fallback-header { display:none; }
.module-popup__card-image-fallback-footer { display:none; }
}
@container (max-width:80px) {
.module-popup__card-image-fallback-set { display:none; }
.module-popup__card-image-fallback-hp { display:none; }
.module-popup__card-image-fallback-content { display:none; }
}
@media (max-width:1100px) {
.module-list-row__visual-block-box--split { grid-template-columns:1fr; gap:14px; }
}
@media (max-width:860px) {

}
@media (max-width:820px) {
.module-list-row__ranked-thumbnail-artist { grid-template-columns:46px minmax(0,1fr)74px 62px; row-gap:2px; }
.module-list-row__ranked-thumbnail-artist-width { grid-column:2/5; }

.u-visual-block-box.module-list-row__key-facts-visual-box-table-scroll { padding-left:12px; padding-right:12px; }
}
@media (max-width:720px) {
.module-list-row__ranked-thumbnail-card { grid-template-columns:38px minmax(0,1fr)84px; row-gap:3px; }
.module-list-row__ranked-thumbnail-card-multiple { grid-column:2/-1; text-align:left; }
}
@media (max-width:700px) {
.module-list-row__ranked-thumbnail-card { grid-template-columns:46px minmax(0,1fr)auto; row-gap:2px; }
.module-list-row__ranked-thumbnail-card-subtitle { grid-column:2/3; font-size:13px; }
.module-list-row__ranked-thumbnail-card-title { grid-column:3/4; grid-row:2; font-size:13px; text-align:right; align-self:center; }
.module-list-row__ranked-thumbnail-card-picture { grid-row:1/span 2; align-self:center; grid-column:2/3; }
}
@media (max-width:640px) {
}
@media (max-width:560px) {

}
.module-list-row__chain-diagram-picture--none .module-popup__card-image-fallback { width:100%; height:100%; }
.module-list-row__ranked-thumbnail-gap-rows>*:last-child:not(details.module-list-row__remaining-fold) { border-bottom-left-radius:var(--r-s); border-bottom-right-radius:var(--r-s); overflow:hidden; }
.module-list-row__ranked-thumbnail-gap-rows>.module-list-row__ranked-thumbnail-card-rows--peek:first-child:last-child { border-radius:var(--r-s); }
.module-popup__thumb-image--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:9px; }
.module-popup__thumb-title--value>b { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-weight:700; white-space:normal; overflow:hidden; }
.module-popup__thumb-title--value>em { display:block; font-style:normal; font-weight:800; font-variant-numeric:tabular-nums; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.module-popup__thumb-image img { -webkit-user-drag:none; pointer-events:none; }
.module-popup__thumb-image span { -webkit-user-drag:none; pointer-events:none; }
td.u-tabular-number { font-variant-numeric:tabular-nums; white-space:nowrap; text-align:right; }
@media (max-width:560px) {
}
.u-visual-block-box > .module-list-row__ranked-thumbnail-card-rows > .module-list-row__ranked-thumbnail-card {

  grid-template-columns: auto minmax(0,1fr) 225px max-content;
}
.module-list-row__ranked-thumbnail-card > .module-list-row__ranked-thumbnail-card-picture {
  align-self: center; margin: 0;
}
.module-list-row__ranked-thumbnail-card-picture { left: 0; top: 0; }
.module-list-row__ranked-thumbnail-gap-rows > .module-list-row__ranked-thumbnail-card-rows--peek { margin-bottom: 0; }
.module-list-row__versus-compare-side-picture.module-popup__thumb-image img { transition: none; }
.module-list-row__versus-compare-side:hover .module-list-row__versus-compare-side-picture.module-popup__thumb-image img, .module-list-row__versus-compare-side:focus-visible .module-list-row__versus-compare-side-picture.module-popup__thumb-image img {
  transform: none;
  box-shadow: none;
}
.module-list-row__ranked-thumbnail-card-picture {
  width: auto;
  height: 46.5px;
}
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) {
  grid-template-columns: auto auto minmax(0,1fr) 225px auto auto;
}
@media (max-width:700px) {
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) {
    grid-template-columns: 38px auto minmax(0,1fr) auto;
  }
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) > .module-list-row__ranked-thumbnail-card-rank { grid-column:1/2; grid-row:1; }
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) > .module-list-row__ranked-thumbnail-card-picture { grid-column:2/3; grid-row:1/span 2; }
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) > .module-list-row__ranked-thumbnail-card-name { grid-column:3/4; grid-row:1; }
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) > .module-list-row__ranked-thumbnail-card-subtitle { grid-column:3/4; grid-row:2; }
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) > .module-list-row__ranked-thumbnail-card-description { grid-column:4/5; grid-row:1; }
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) > .module-list-row__ranked-thumbnail-card-title { grid-column:4/5; grid-row:2; }
}

.module-list-row__ranked-thumbnail-artist-picture { justify-self:center; }
.module-list-row__ranked-thumbnail-artist { grid-template-columns:88px minmax(0,1.15fr)82px 74px minmax(0,1.35fr); }
@media (max-width:860px) {

}
@media (max-width:820px) {
}
.module-list-row__ranked-thumbnail-artist-header, .module-list-row__ranked-thumbnail-artist { grid-template-columns:88px minmax(0,1.15fr)minmax(0,1fr)74px minmax(0,0.75fr); }
.module-list-row__ranked-thumbnail-artist-content {
  text-align:left;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
@media (max-width:820px) {
.module-list-row__ranked-thumbnail-artist-header, .module-list-row__ranked-thumbnail-artist { grid-template-columns:46px minmax(0,1fr)74px 62px; }
}
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) {
  grid-template-columns: 38px 34px minmax(0,1fr) 225px 92px 130px;
}
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) > .module-list-row__ranked-thumbnail-card-rank { text-align:right; }
@media (max-width:700px) {
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) {
    grid-template-columns: 38px 34px minmax(0,1fr) 92px;
  }
}
@media (scripting: none) {
}
@media (scripting: none) and (prefers-reduced-motion: reduce) {
}
.module-list-row__imageless-card-grid .module-list-row__imageless-card-link-image, .module-list-row__imageless-card-grid .module-list-row__imageless-card-link .module-popup__card-image-fallback {
  transform-origin: 50% 100%;
  transition: transform .26s cubic-bezier(.18,.75,.28,1), box-shadow .26s;
}
.module-list-row__imageless-card-grid .module-list-row__imageless-card-link:hover .module-list-row__imageless-card-link-image, .module-list-row__imageless-card-grid .module-list-row__imageless-card-link:focus-visible .module-list-row__imageless-card-link-image, .module-list-row__imageless-card-grid .module-list-row__imageless-card-link:hover .module-popup__card-image-fallback, .module-list-row__imageless-card-grid .module-list-row__imageless-card-link:focus-visible .module-popup__card-image-fallback {
  transform: translateY(-14px) rotateX(8deg) scale(1.06);
  box-shadow: 0 20px 28px -10px rgba(0,0,0,.6);
}
@media (prefers-reduced-motion: reduce) {
.module-list-row__imageless-card-grid .module-list-row__imageless-card-link-image, .module-list-row__imageless-card-grid .module-list-row__imageless-card-link .module-popup__card-image-fallback { transition: none; }
.module-list-row__imageless-card-grid .module-list-row__imageless-card-link:hover .module-list-row__imageless-card-link-image, .module-list-row__imageless-card-grid .module-list-row__imageless-card-link:focus-visible .module-list-row__imageless-card-link-image, .module-list-row__imageless-card-grid .module-list-row__imageless-card-link:hover .module-popup__card-image-fallback, .module-list-row__imageless-card-grid .module-list-row__imageless-card-link:focus-visible .module-popup__card-image-fallback { transform: translateY(-6px); }
}

@keyframes cta-arrow-bob-hover {
    0%, 100% { transform: translateX(0); }
    50%      { transform: translateX(10px); }
}
/* 🔴 animation 이 쓰는 @keyframes 정의(라이브 원문) — 없으면 요소가 «시작 상태로 굳는다» */
@keyframes cta-arrow-bob-hover {
    0%, 100% { transform: translateX(0); }
    50%      { transform: translateX(10px); }
}

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* ── 동기화 블록 끝 (sync-live) ── */

/* hand-fix:list-row:순위 칸 정렬 */
/* ── 순위 앞의 빈 여백 (2026-09-08 사용자 지적) ──
 * 라이브는 순위 칸을 38px 로 잡고 «오른쪽 정렬»한다(자릿수를 맞추려는 뜻).
 * 그런데 한 자리 숫자만 있는 목록에서는 앞이 30px 가까이 비어 «왜 비었나»로 읽힌다.
 * 왼쪽 정렬로 바꾼다 — 자릿수는 왼쪽 끝에서 맞고, 앞의 빈 자리는 사라진다.
 */
.module-list-row__ranked-thumbnail-card > .module-list-row__ranked-thumbnail-card-rank,
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) > .module-list-row__ranked-thumbnail-card-rank {
  text-align: left;
}

/* hand-fix:list-row:순위 칸 폭 */
/* ── 순위 칸이 38px 라 한 자리 숫자 뒤에 여백이 남았다 (2026-09-08 사용자 지적) ──
 * 왼쪽 정렬로 바꾼 뒤에는 «뒤»가 비어 썸네일과 사이가 벌어져 보인다.
 * 칸을 18px 로 줄인다(24px 도 여전히 넓다는 재지적) — 고정 폭이라 줄끼리 자리는 그대로 맞고(라이브가 고정을 고른 이유),
 * 세 자리 순위가 와도 rank 에 이미 min-width:max-content·overflow:visible 이 있어 잘리지 않는다.
 */
.module-list-row__ranked-thumbnail-card:has(> .module-list-row__ranked-thumbnail-card-picture):has(> .module-list-row__ranked-thumbnail-card-name) {
  grid-template-columns: 18px 34px minmax(0, 1fr) 225px 92px 130px;
}

/* hand-fix:list-row:행 흰 배경 + 호버 강조 */
/* ── 행 흰 배경 + 호버 강조 (2026-09-08 사용자 확정) ───────────────────────
   🔴 라이브 규칙은 «한 줄도» 고치지 않는다. 뒤에 얹어 순서로 이긴다 → verify-sync 0/0 유지.

   왜 바꾸나 (실측 근거 셋):
   ① 이 목록만 다르다 — 우리 모듈 가족의 행 호버는 «강조색»이 관행이다.
        .gainers-losers-board__row:hover  background:var(--acc-s,#eff6ff)
        .badge-bar-row:hover              background:var(--acc-s)
        .denominator-labelled-row:hover   color-mix(in srgb,var(--gold) 6%,transparent)
        .card-image-tile:hover            border-color:var(--acc) + 그림자
      오직 .module-list-row__ranked-thumbnail-card 만 «중성색(흰색)»으로 호버했다.
   ② 영역은 «상자 테두리»가 이미 그린다 — .…-rows { border:1px solid var(--line);
      border-radius:var(--r-s); overflow:hidden }. 행이 희어져도 목록 묶임은 그대로 보인다.
      (그래서 상자의 background:var(--surf2) 회색 판은 «묶임을 만드는 장치»가 아니었다.)
   ③ 테두리 강조는 «네 변을 다 두르는» 방식이어야 한다.
      🔴 border-color 로 하면 라이브의 .…row:first-child{border-top:0} 때문에 첫 행에는
         선이 걸릴 자리가 없어 «2번째 행부터만» 선이 생긴다(2026-09-08 실증·되돌림).
      inset 링은 첫 행에도 걸리고 자리도 안 밀린다. 값은 라이브 어휘 그대로
      (box-shadow:inset 0 0 0 1px var(--acc) — 라이브에 6곳). 발명 0.

   ⚠️ 앞서 한 번 되돌린 자리다 — 그때는 「라이브가 페이지 바탕에 기댄다」는 «거짓 진단»이
      근거였다(상자가 스스로 회색을 깐다는 것을 못 읽었다). 지금 근거는 위 ①~③ 실측이다. */
.module-list-row__ranked-thumbnail-card { background: var(--surf); }
.module-list-row__ranked-thumbnail-card:hover,
.module-list-row__ranked-thumbnail-card:focus-visible {
  background: #F5F3FE;                                  /* 대비값 — color-mix 를 못 쓰는 곳 */
  background: color-mix(in srgb, var(--acc) 6%, var(--surf));  /* 사이트 강조색을 6%만 섞은 «아주 옅은» 판
     (2026-09-08 사용자 지시로 --acc-s(#EEEBFE)보다 한 단 옅게).
     🔴 transparent 가 아니라 var(--surf) 에 섞는다 — transparent 면 행이 반투명해져
        상자의 회색 판이 비쳐 탁해진다. 라이브도 색을 섞을 때 표면 토큰에 섞는다
        (예: color-mix(in srgb,var(--c2) 9%,var(--surf2))). 발명 0. */
  box-shadow: inset 0 0 0 1px var(--acc, #3B82F6);
}


/* ── 짝 맞추기 — 마크업이 찍는데 규칙이 없던 이름 (2026-09-10 창D) ────────── */
/* 🔴 짝 맞추기(2026-09-10 창D) — 뿌리 — 원본에 뿌리 선언 없음.
   마크업이 이 이름을 찍는데 규칙이 없어 «자리»만 만든다. 생김새는 «창작하지 않는다»
   (선례 = display/pdf-embed/style.css .module-pdf-embed__title). */
.module-list-row {
}
/* 🔴 짝 맞추기(2026-09-10 창D) — 원본에 선언 없음.
   마크업이 이 이름을 찍는데 규칙이 없어 «자리»만 만든다. 생김새는 «창작하지 않는다»
   (선례 = display/pdf-embed/style.css .module-pdf-embed__title). */
.module-list-row__card-number-plain {
}

/* 🆕 2026-10-09 앱층 흡수(T35) — 순번 알약(rank_pill) · 꼬리 링크(more_url·more_label) · 값 색 끄기(rows[].value_tone=plain).
   새 클래스만(기존 규칙 무접촉 · 기본값 그대로). 근거(앱층): list-rank(app-layer/style.css:2575 알약) · list-more(:2582).
   🔴 값 색 규칙(콘텐츠 원칙 8 · 빨강 = 사용자에게 유리한 «비교군 최고 하나» · 전 행 같음 = 강조 0 · 공동 1위 = 모두):
   기존 규칙 style.css:422 가 값(description)을 «모든 줄» 빨강(--dn)으로 칠한다 — 값이 전 행 같은 줄(T35 세 줄 1,794원)에도 붙는다.
   모듈은 값 비교를 못 하므로(§11-2) 호출자가 «강조가 아닌 줄»에 value_tone = "plain" 을 준다(전 행 같음 = 전 행 plain · 공동 1위 = 1위 줄만 비움). */
.module-list-row__ranked-thumbnail-card--plain-value .module-list-row__ranked-thumbnail-card-description { color:var(--ink); }
.module-list-row__ranked-thumbnail-card-rows--rank-pill .module-list-row__ranked-thumbnail-card-rank { display:inline-grid; place-items:center; min-width:22px; height:22px; border-radius:6px; background:var(--acc-s); color:var(--acc-i); font-size:13px; font-weight:700; }
.module-list-row__more-link { color:var(--acc-i); font-weight:700; text-decoration:underline; text-underline-offset:2px; }

/* 🆕 2026-10-09 값 색 기본값 규칙 맞춤(CO-05 · 사용자 10-09 「다른 것들도 의도 파악」 · 측정 = _흡수비교/_보고-계산버튼·목록색-20261009.md)
   전: rows 값(description)이 «모든 줄» --dn(시세 파랑 · dir-good-down 표지에선 빨강)으로 칠해졌다(style.css:422) — 값이 전 행 같아도·비교군이 아닌 일반 목록(최근 거래 등)에도.
   후: 기본 = 본문 글자색(강조 0). 빨강 굵게 = 호출자가 «그 절 질문 기준 가장 좋은 값» 줄에만 value_tone="best"(공동 1위 = 모두 · 전 행 같음 = 아무도 안 줌).
   모듈은 값 비교를 못 하므로(§11-2) 어느 줄이 최고인지는 데이터층 몫. 호출자가 준 value_tone=plain 은 그대로 존중. 빨강 토큰 = 시세 --compare-good(없으면 #dc2626). */
.module-list-row__ranked-thumbnail-card-description { color:var(--ink); }
.module-list-row__ranked-thumbnail-card--best-value .module-list-row__ranked-thumbnail-card-description,
.module-list-row__ranked-thumbnail-card--best-value .module-list-row__ranked-thumbnail-card-value { color:var(--compare-good, #dc2626); font-weight:800; }

/* 🆕 2026-11-04 변형 news-boxed = 상자형 뉴스 목록(사용자 11-04 «인기 글 뉴스 목록형 잘 기록해둬» · 꼴 정본 = 김치박물관 홈 «인기 글»)
   쓰는 법: compact 슬롯 + variant="news-boxed". 행마다 상자(옅은 테두리·모서리·흰 바탕·안쪽 여백) · 왼쪽 그림 4:3 · 오른쪽 제목 + 요약 2줄 말줄임 · 행 전체 링크 · 그림 없으면 그림 칸 없이 같은 상자.
   값(색·간격·그림 폭) = 아래 CSS 변수 · 사이트는 변수만 바꾼다(--nb-*). 안 주면 이 기본값.
   선택자 맨 앞 .module-list-row = 위쪽 표 격자 규칙(.u-visual-block-box > rows > card)보다 뒤에서 이기려는 구체성. 말줄임 칸(요약)은 안쪽 여백 0(셋째 줄 비침 방지). */
.module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed { border:0; border-radius:0; background:none; overflow:visible; margin:12px 0 14px; display:flex; flex-direction:column; gap:var(--nb-gap,20px); }
.module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed > .module-list-row__ranked-thumbnail-card { display:flex; align-items:flex-start; gap:var(--nb-inner-gap,20px); padding:var(--nb-pad,20px); min-height:0; border:1px solid var(--nb-line,#e3e3e3); border-radius:var(--nb-radius,8px); background:var(--nb-bg,#fff); color:var(--nb-ink,var(--ink2,#333)); }
.module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed > .module-list-row__ranked-thumbnail-card:hover,
.module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed > .module-list-row__ranked-thumbnail-card:focus-visible { border-color:var(--nb-accent,var(--acc,#2563eb)); background:var(--nb-bg,#fff); }
.module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed > .module-list-row__ranked-thumbnail-card > .module-list-row__ranked-thumbnail-card-picture { position:static; left:auto; top:auto; flex:0 0 var(--nb-thumb,160px); width:var(--nb-thumb,160px); height:auto; aspect-ratio:4/3; align-self:flex-start; margin:0; border-radius:var(--nb-thumb-radius,6px); grid-column:auto; grid-row:auto; }
.module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed .module-list-row__ranked-thumbnail-card-picture img { object-fit:cover; object-position:center; }
.module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed > .module-list-row__ranked-thumbnail-card > span:not([class]) { flex:1 1 auto; min-width:0; overflow:visible; white-space:normal; }
.module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed .module-list-row__ranked-thumbnail-card-name-oneline { display:block; white-space:normal; overflow:visible; text-overflow:clip; font-size:18px; line-height:1.45; font-weight:700; color:var(--nb-title,var(--ink,#111)); }
.module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed .module-list-row__ranked-thumbnail-card-subtitle-oneline { white-space:normal; display:-webkit-box; -webkit-line-clamp:2; line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; margin-top:6px; padding:0; font-size:14px; line-height:1.6; color:var(--nb-sub,var(--mut,#666)); }
.module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed .module-list-row__ranked-thumbnail-card-value:empty,
.module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed .module-list-row__ranked-thumbnail-card-multiple:empty { display:none; }
@media (max-width:560px) {
  .module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed { gap:var(--nb-gap-narrow,14px); }
  .module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed > .module-list-row__ranked-thumbnail-card { padding:var(--nb-pad-narrow,14px); gap:var(--nb-inner-gap-narrow,14px); }
  .module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed > .module-list-row__ranked-thumbnail-card > .module-list-row__ranked-thumbnail-card-picture { flex-basis:var(--nb-thumb-narrow,96px); width:var(--nb-thumb-narrow,96px); }
  .module-list-row .module-list-row__ranked-thumbnail-card-rows--news-boxed .module-list-row__ranked-thumbnail-card-name-oneline { font-size:16px; }
}

/* core/modules/display/thumb-grid/style.css */

@media (max-width:820px) {
}
@media (max-width:1100px) {
}
@media (max-width:820px) {
}
@media (max-width:520px) {
}
@media (prefers-reduced-motion:reduce) {
}
.module-popup__card-image-tile-value { position:absolute; bottom:25px; right:3px; font-size:13px; line-height:1.45; font-weight:800; color:#fff; background:rgba(226,60,66,.9); border-radius:5px; padding:0 5px; z-index:2; pointer-events:none; font-variant-numeric:tabular-nums; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; -webkit-user-drag:none; }
@media (max-width:900px) {
}
@media (max-width:560px) {
}
.module-thumb-grid__section-footnote-line { font-size: 14px; color: var(--mut); margin: 8px 0 0; line-height:1.6; }
@media (max-width:1100px) {
}
@media (max-width:820px) {
}
@media (max-width:520px) {
}
@media (prefers-reduced-motion: reduce) {
}

.u-visual-block-box {
  margin: 0 0 14px;
}
.module-thumb-grid__ranked-thumbnail-list-bar-row-picture .module-popup__card-image-fallback {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  border: 0;
  border-radius: 8px;
}
.module-thumb-grid__badge-bar-row-picture--none .module-popup__card-image-fallback {
  display: grid;
  grid-template-rows: auto 1fr auto;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  border: 1px solid var(--line2);
  border-radius: 6px;
  background: var(--surf2);
  padding: 3px 4px;
  gap: 1px;
  text-align: center;
  overflow: hidden;
}
.module-thumb-grid__badge-bar-row-picture--none .module-popup__card-image-fallback-name {
  display: block;
  font-size: 13px; /* HBS 09-28 · 9px → 13px(썸네일 대체 글자 · 넘침 확인 대상) */
  font-weight: 800;
  line-height: 1.15;
  color: var(--ink2);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: clip;
}
@media (max-width:820px) {
.module-thumb-grid__price-trend-line-titled-box, .u-visual-block-box.module-thumb-grid__key-facts-visual-box-table-scroll, .module-thumb-grid__card-deep-dive-panel, .module-thumb-grid__footnote-block, .module-thumb-grid__cross-link-list-column {
    padding-left: 12px;
    padding-right: 12px;
  }
}
.module-thumb-grid__table-scroll-hint+.module-thumb-grid__prose-body-block, .module-thumb-grid__table-scroll-hint+.u-visual-block-box {
  margin-top: 2px;
}
.module-popup__thumb-grid-cell, .module-popup__thumb-grid-cell-image, .module-popup__thumb-grid-cell-picture, .module-popup__card-image-tile, .module-popup__card-image-tile-name, .module-popup__card-image-tile-rank, .module-popup__card-image-tile-value, .module-thumb-grid__three-card-arc-display, .module-thumb-grid__three-card-arc-display-picture, .module-popup__thumb-image, .module-popup__thumb-title, .module-popup__thumb-name, .module-thumb-grid__chain-diagram-link-content, .module-thumb-grid__chain-diagram-link-picture, .module-thumb-grid__versus-compare-side, .module-thumb-grid__versus-compare-side-picture, .module-thumb-grid__sibling-axis-link-card-image, .module-thumb-grid__ranked-thumbnail-list-artist-row-width, .module-thumb-grid__marketplace-logo, .module-thumb-grid__rail-p {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-user-drag: none;
}
.module-thumb-grid__section-footnote-line {
  font-size: 13.2px;
  color: var(--mut);
  margin: 8px 0 0;
}
.module-popup__card-image-fallback {
  background: var(--surf2);
}
.module-popup__thumb-image.module-popup__card-image-fallback::after {
  content: "No image";
  position: absolute;
  left: 0;
  right: 0;
  top: 36%;
  text-align: center;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .03em;
  color: var(--mut);
}
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback {
  background: var(--surf2);
  border: 1px solid var(--line2);
  display: grid;
  grid-template-rows: auto 1fr auto;
  padding: 13px 14px;
  place-items: stretch;
}
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback::before {
  content: attr(data-nm);
  font-size: 14px;
  font-weight: 800;
  color: var(--ink2);
  line-height: 1.35;
  align-self: start;
}
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback::after {
  content: attr(data-no);
  font-size: 12px;
  font-weight: 700;
  color: var(--mut);
  align-self: end;
  text-align: right;
}
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback>.module-popup__card-image-fallback-meta {
  align-self: center;
  text-align: center;
  font-size: 12px;
  line-height: 1.55;
  color: var(--mut);
}
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback::after { font-size: 13px }
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback>.module-popup__card-image-fallback-meta { font-size: 13px }
.module-thumb-grid__card-page, .module-popup__thumb-effect-layer, .module-thumb-grid__sibling-axis-link {
  margin-bottom: 14px;
}
.module-thumb-grid__ranked-thumbnail-list-bar-row-picture .module-popup__card-image-fallback {
  display: grid;
  grid-template-rows: auto 1fr auto;
  gap: 2px;
  padding: 5px 4px;
  text-align: center;
  overflow: hidden;
  background: var(--surf2);
}
.module-thumb-grid__ranked-thumbnail-list-bar-row-picture .module-popup__card-image-fallback-name {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  font-size: 13px; /* HBS 09-28 · 10px → 13px */
  font-weight: 800;
  line-height: 1.2;
  color: var(--ink2);
}
.module-thumb-grid__ranked-thumbnail-list-card-row-picture--none .module-popup__card-image-fallback {width:100%;height:100%;aspect-ratio:auto;border-radius:4px}
.module-thumb-grid__ranked-thumbnail-list-feature-cell-picture.module-popup__card-image-fallback {display:grid;place-content:center;gap:3px;padding:8px;text-align:center;
  background:var(--surf2);border:1px dashed var(--line2)}
.module-thumb-grid__ranked-thumbnail-list-feature-cell-picture.module-popup__card-image-fallback .module-popup__card-image-fallback-name {font-size:13px;font-weight:800;line-height:1.25;color:var(--ink2)}
.module-thumb-grid__ranked-thumbnail-list-feature-cell-picture.module-popup__card-image-fallback .module-popup__card-image-fallback-set, .module-thumb-grid__ranked-thumbnail-list-feature-cell-picture.module-popup__card-image-fallback .module-popup__card-image-fallback-content {font-size:13px;color:var(--mut)}
.module-thumb-grid__card-image-tile-grid {display:grid;grid-template-columns:repeat(10,1fr);gap:7px}
@media (max-width:1100px) {
}
@media (max-width:820px) {
}
@media (max-width:520px) {
}
.module-popup__card-image-tile {position:relative;display:block;border-radius:7px;overflow:hidden;border:1px solid var(--line2);
  background:var(--surf2);aspect-ratio:745/1040;
  transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .2s,border-color .15s}
.module-popup__card-image-tile img {width:100%;height:100%;object-fit:cover;display:block}
.module-popup__card-image-tile:hover {transform:translateY(-9px) scale(1.09);border-color:var(--acc);z-index:5;
  box-shadow:0 18px 30px -10px rgba(0,0,0,.6)}
@media (prefers-reduced-motion:reduce) {
.module-popup__card-image-tile {transition:none}
.module-popup__card-image-tile:hover {transform:none}
}
.module-popup__card-image-tile-rank {position:absolute;top:3px;left:3px;font-size:13px;line-height:1.45;font-weight:800;color:#fff;
  background:rgba(0,0,0,.62);border-radius:5px;padding:0 5px;z-index:2;pointer-events:none}
.module-popup__card-image-tile-value {position:absolute;bottom:25px;right:3px;font-size:13px;line-height:1.45;font-weight:800;color:#fff;
  background:rgba(226,60,66,.9);border-radius:5px;padding:0 5px;z-index:2;pointer-events:none;
  font-variant-numeric:tabular-nums}
.module-popup__card-image-tile-value .module-thumb-grid__card-image-tile-badge-label {font-size:13px;font-weight:700;opacity:.92}
.module-popup__card-image-tile-name {position:absolute;left:0;right:0;bottom:0;padding:2px 5px 3px;z-index:2;pointer-events:none;
  font-size:13px;line-height:1.35;font-weight:700;color:#fff;text-align:center;
  background:linear-gradient(transparent,rgba(0,0,0,.55) 38%,rgba(0,0,0,.88));
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.module-popup__card-image-tile .module-popup__card-image-fallback {display:grid;place-content:center;height:100%;padding:6px 5px 20px;text-align:center}
.module-popup__card-image-tile .module-popup__card-image-fallback-name {font-size:13px;font-weight:800;line-height:1.25;color:var(--mut)}
.module-popup__card-image-fallback {position:relative;display:grid;grid-template-rows:auto 1fr auto;gap:4px;
  aspect-ratio:745/1040;padding:7px 7px 8px;border-radius:6px;
  background:var(--surf2);border:1px solid var(--line2);cursor:default;
  overflow:hidden;text-align:left;
  container-type:inline-size}
.module-popup__card-image-fallback-name {font-size:13px;font-weight:800;color:var(--ink2);line-height:1.3;min-width:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.module-popup__card-image-fallback:hover {transform:none;box-shadow:none;border-color:var(--line2)}
a.module-popup__card-image-fallback, a .module-popup__card-image-fallback, a .module-popup__card-image-fallback * {cursor:pointer}
.module-popup__card-image-tile .module-popup__card-image-fallback-header, .module-popup__card-image-tile .module-popup__card-image-fallback-footer {display:none}
.module-popup__thumb-grid-cell-image>.module-popup__card-image-fallback {width:100%;height:100%;aspect-ratio:auto;position:relative;z-index:1}
.u-visual-block-box { margin:0 0 14px; border:0; }
.module-thumb-grid__card-image-tile-grid>* { min-width:0; }
.module-thumb-grid__card-image-tile-grid { display:grid; grid-template-columns:repeat(10,1fr); gap:7px; touch-action:pan-y; }
.module-thumb-grid__card-image-tile-grid.module-popup__card-image-tile-grid--info {
  grid-template-columns: repeat(3,1fr);
  gap: 12px;
}
@media (max-width:900px) {
.module-thumb-grid__card-image-tile-grid.module-popup__card-image-tile-grid--info { grid-template-columns: repeat(2,1fr); }
}
@media (max-width:560px) {
.module-thumb-grid__card-image-tile-grid.module-popup__card-image-tile-grid--info { grid-template-columns: 1fr; }
}
.module-popup__card-image-tile-grid--info .module-popup__card-image-fallback {
  display: grid;
  grid-template-rows: none;
  place-content: center;
  padding: 4px;
  text-align: center;
}
.module-popup__card-image-tile-grid--info .module-popup__card-image-fallback-name {
  font-size: 13px;
  font-weight: 800;
  color: var(--mut);
  white-space: normal;
  -webkit-line-clamp: 3;
}
.module-popup__card-image-tile-grid--info .module-popup__card-image-tile-info-price .module-thumb-grid__card-image-tile-badge-label {
  font-size: 13px;
  font-weight: 700;
  opacity: .78;
}
.module-popup__card-image-tile { position:relative; display:block; border-radius:7px; overflow:hidden; border:1px solid var(--line2); background:var(--surf2); aspect-ratio:745/1040; transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .2s,border-color .15s; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; -webkit-user-drag:none; }
.module-popup__card-image-tile img { width:100%; height:100%; object-fit:cover; display:block; }
.module-popup__card-image-tile:hover { transform:translateY(-9px)scale(1.09); border-color:var(--acc); z-index:5; box-shadow:0 18px 30px -10px rgba(0,0,0,.6); }
.module-popup__card-image-tile-rank { position:absolute; top:3px; left:3px; font-size:13px; line-height:1.45; font-weight:800; color:#fff; background:rgba(0,0,0,.62); border-radius:5px; padding:0 5px; z-index:2; pointer-events:none; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; -webkit-user-drag:none; }
.module-popup__card-image-tile-value { position:absolute; bottom:25px; right:3px; font-size:13px; line-height:1.45; font-weight:800; color:#fff; background:rgba(226,60,66,.9); border-radius:5px; padding:0 5px; z-index:2; pointer-events:none; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; -webkit-user-drag:none; }
.module-popup__card-image-tile-value .module-thumb-grid__card-image-tile-badge-label { font-size:13px; font-weight:700; opacity:.92; }
.module-popup__card-image-tile-name { position:absolute; left:0; right:0; bottom:0; padding:2px 5px 3px; z-index:2; pointer-events:none; font-size:13px; line-height:1.35; font-weight:800; color:#fff; text-align:center; background:linear-gradient(transparent,rgba(0,0,0,.74)38%,rgba(0,0,0,.96)); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; -webkit-user-drag:none; }
.module-thumb-grid__versus-panel-compare-side-picture--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:8px; }
.module-thumb-grid__ranked-thumbnail-list-card-row-picture--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:4px; }
.module-thumb-grid__ranked-thumbnail-list-artist-row-picture--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:5px; }
.module-popup__card-image-fallback { position:relative; display:grid; grid-template-rows:auto 1fr auto; gap:4px; aspect-ratio:745/1040; padding:7px 7px 8px; border-radius:6px; background:var(--surf2); border:1px solid var(--line2); cursor:default; overflow:hidden; text-align:left; container-type:inline-size; }
.module-popup__card-image-fallback-name { font-size:13px; font-weight:800; color:var(--ink2); line-height:1.3; min-width:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.module-thumb-grid__ranked-thumbnail-list-bar-row-picture .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border:0; border-radius:8px; }
.module-thumb-grid__badge-bar-row-picture--none .module-popup__card-image-fallback { display:grid; grid-template-rows:auto 1fr auto; width:100%; height:100%; aspect-ratio:auto; border:1px solid var(--line2); border-radius:6px; background:var(--surf2); padding:3px 4px; gap:1px; text-align:center; overflow:hidden; }
.module-popup__card-image-fallback:hover { transform:none; box-shadow:none; border-color:var(--line2); }
a.module-popup__card-image-fallback { cursor:pointer; }
a .module-popup__card-image-fallback { cursor:pointer; }
a .module-popup__card-image-fallback * { cursor:pointer; }
.module-popup__card-image-tile .module-popup__card-image-fallback-header { display:none; }
.module-popup__card-image-tile .module-popup__card-image-fallback-footer { display:none; }
.module-thumb-grid__ranked-thumbnail-list-share-row-picture--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:4px; }
.module-popup__card-image-tile-grid--set .module-popup__card-image-tile-value { background:rgba(124,108,245,.94); }
.module-popup__card-image-tile-grid--set .module-popup__card-image-tile--none .module-popup__card-image-fallback { position:absolute; left:0; right:0; top:0; bottom:0; aspect-ratio:auto; border:0; border-radius:0; padding:22px 7px 30px; }
.module-thumb-grid__table-card-thumbnail .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border:0; border-radius:4px; }
.module-thumb-grid__section-footnote-line { font-size:13.2px; color:var(--mut); margin:8px 0 14px; line-height:1.6; }
.module-thumb-grid__section-footnote-line b { color:var(--ink2); font-weight:800; }
.module-thumb-grid__board-image--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:5px; }
.module-thumb-grid__imageless-card-link .module-popup__card-image-fallback { width:100%; aspect-ratio:745/1040; }
.module-thumb-grid__imageless-card-link:hover .module-popup__card-image-fallback { border-color:var(--acc); }
.module-thumb-grid__table-scroll-hint+.u-visual-block-box { margin-top:2px; }
.module-popup__thumb-image.module-popup__card-image-fallback::after { content:"No image"; position:absolute; left:0; right:0; top:34%; text-align:center; font-size:13px; font-weight:600; letter-spacing:.03em; color:var(--mut); }
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback { background:var(--surf2); border:1px solid var(--line2); display:grid; grid-template-rows:auto 1fr auto; padding:13px 14px; place-items:stretch; }
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback::before { content:attr(data-nm); font-size:14px; font-weight:800; color:var(--ink2); line-height:1.35; align-self:start; }
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback::after { content:attr(data-no); font-size:13px; font-weight:700; color:var(--mut); align-self:end; text-align:right; }
.module-card-holo__thumb-popup-artwork-frame.module-popup__card-image-fallback>.module-popup__card-image-fallback-meta { align-self:center; text-align:center; font-size:13px; line-height:1.55; color:var(--mut); }
.module-thumb-grid__badge-bar-row-picture--none .module-popup__card-image-fallback.module-popup__card-image-fallback--row { grid-template-rows:1fr; padding:0; gap:0; }
@media (max-width:1100px) {
.module-thumb-grid__card-image-tile-grid { grid-template-columns:repeat(8,1fr); }
}
@media (max-width:820px) {
.module-thumb-grid__card-image-tile-grid { grid-template-columns:repeat(6,1fr); }
.u-visual-block-box.module-thumb-grid__key-facts-visual-box-table-scroll { padding-left:12px; padding-right:12px; }
}
@media (max-width:520px) {
.module-thumb-grid__card-image-tile-grid { grid-template-columns:repeat(4,1fr); }
}
.module-thumb-grid__chain-diagram-picture--none .module-popup__card-image-fallback { width:100%; height:100%; }
.module-popup__thumb-image--none .module-popup__card-image-fallback { width:100%; height:100%; aspect-ratio:auto; border-radius:9px; }
.module-popup__card-image-tile.module-popup__thumb-image { transition: border-color .15s; }
.module-popup__card-image-tile.module-popup__thumb-image:hover, .module-popup__card-image-tile.module-popup__thumb-image:focus-visible { transform: none; box-shadow: none; }
.module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link-image, .module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link .module-popup__card-image-fallback {
  transform-origin: 50% 100%;
  transition: transform .26s cubic-bezier(.18,.75,.28,1), box-shadow .26s;
}
.module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link:hover .module-thumb-grid__imageless-card-link-image, .module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link:focus-visible .module-thumb-grid__imageless-card-link-image, .module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link:hover .module-popup__card-image-fallback, .module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link:focus-visible .module-popup__card-image-fallback {
  transform: translateY(-14px) rotateX(8deg) scale(1.06);
  box-shadow: 0 20px 28px -10px rgba(0,0,0,.6);
}
@media (prefers-reduced-motion: reduce) {
.module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link-image, .module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link .module-popup__card-image-fallback { transition: none; }
.module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link:hover .module-thumb-grid__imageless-card-link-image, .module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link:focus-visible .module-thumb-grid__imageless-card-link-image, .module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link:hover .module-popup__card-image-fallback, .module-thumb-grid__imageless-card .module-thumb-grid__imageless-card-link:focus-visible .module-popup__card-image-fallback { transform: translateY(-6px); }
}
.module-thumb-grid__card-page { margin-top: 14px }
.module-thumb-grid__card-page-pager {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin-top: 11px; flex-wrap: wrap;
}
.module-thumb-grid__card-page-pager-note { font-size: 15px; color: var(--module-muted, #5c6779) }
.module-thumb-grid__card-page-pages { display: flex; gap: 5px; flex-wrap: wrap }
.module-thumb-grid__card-grid-page-page {
  min-width: 31px; height: 31px; display: grid; place-items: center; border-radius: 7px;
  font-size: 13.4px; font-weight: 700; text-decoration: none;
  border: 1px solid var(--module-line-2, #d7dde6);
  background: var(--module-surface, #fff); color: var(--module-ink-2, #3f4859);
}
.module-thumb-grid__card-page--on {
  background: var(--module-accent, #5747e0);
  border-color: var(--module-accent, #5747e0); color: #fff;
}
.module-thumb-grid__card-grid-page-page:hover { border-color: var(--module-accent, #5747e0) }

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-thumb-grid__card-page--combo .module-thumb-grid__card-page-grid { grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 20px; }
@media (max-width: 380px) {
  .module-thumb-grid__card-page--combo .module-thumb-grid__card-page-grid { grid-template-columns: minmax(0, 1fr); }
}
  .module-thumb-grid__card-page--combo .module-thumb-grid__card-page-thumb { position: static; aspect-ratio: auto; border: 0; border-radius: 0; overflow: visible; background: none; transition: none; }
  .module-thumb-grid__card-page--combo .module-thumb-grid__card-page-thumb:hover { transform: none; box-shadow: none; border-color: transparent; z-index: auto; }
  .module-thumb-grid__card-image-tile-value--year { background:rgba(124,108,245,.92); }
  .module-popup__card-image-tile-grid--info .module-popup__card-image-tile-info-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .module-popup__card-image-tile-grid--info .module-popup__card-image-tile-info-set em { font-style: normal; }
  .module-thumb-grid__card-image-tile-value--artwork { background:rgba(124,108,245,.92); }
  .module-popup__card-image-tile-grid--set .module-popup__card-image-tile--none { background:transparent; }
  .module-thumb-grid__card-page--named .module-thumb-grid__card-page-thumb { aspect-ratio: auto; overflow: visible; border: 0; border-radius: 0; }
  .module-thumb-grid__card-page--named .module-thumb-grid__card-page-thumb > img, .module-thumb-grid__card-page--named .module-thumb-grid__card-page-thumb > .module-thumb-grid__card-page-fb { display: block; width: 100%; height: auto; aspect-ratio: var(--module-card-grid-page-aspect, 745/1040); object-fit: cover; border: 1px solid var(--line2); border-radius: 6px; overflow: hidden; }
  .module-thumb-grid__card-page--named .module-thumb-grid__card-page-name { position: static; left: auto; right: auto; bottom: auto; box-sizing: border-box; height: 23px; padding: 5px 2px 0; font-size: 13px; font-weight: 700; line-height: 18px; background: none; color: var(--ink2); text-align: center; }
  .module-thumb-grid__card-page--named .module-thumb-grid__card-page-metric { top: 5px; bottom: auto; right: 5px; }
  .module-thumb-grid__card-page--named .module-thumb-grid__card-page-rank { top: 5px; left: 5px; }
  .module-thumb-grid__card-page-grid { display: grid; grid-template-columns: repeat(10, 1fr); gap: 12px; }
  .module-thumb-grid__card-page-grid > * { min-width: 0; }
@media (max-width: 1100px) {
  .module-thumb-grid__card-page-grid { grid-template-columns: repeat(8, 1fr); }
}
@media (max-width: 860px) {
  .module-thumb-grid__card-page-grid { grid-template-columns: repeat(6, 1fr); }
}
@media (max-width: 560px) {
  .module-thumb-grid__card-page-grid { grid-template-columns: repeat(4, 1fr); }
}
  .module-thumb-grid__card-page-thumb { position: relative; display: block; aspect-ratio: var(--module-card-grid-page-aspect, 745/1040); border-radius: 6px; border: 1px solid var(--module-line-2, #d7dde6); overflow: hidden; transition: transform .18s, border-color .18s, box-shadow .18s; }
  .module-thumb-grid__card-page-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .module-thumb-grid__card-page-thumb:hover { transform: translateY(-9px) scale(1.09); border-color: var(--module-accent, #5747e0); z-index: 5; box-shadow: 0 18px 30px -10px rgba(0,0,0,.6); }
  .module-thumb-grid__card-page-rank, .module-thumb-grid__card-page-metric { position: absolute; font-size: 13px; line-height: 1.45; font-weight: 800; color: #fff; border-radius: 5px; padding: 1px 6px; z-index: 2; pointer-events: none; font-variant-numeric: tabular-nums; }
  .module-thumb-grid__card-page-rank { top: 5px; left: 5px; background: rgba(0,0,0,.62); }
  .module-thumb-grid__card-page-metric { bottom: 5px; right: 5px; background: rgba(226,60,66,.9); }
  .module-thumb-grid__card-page-name { position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; pointer-events: none; padding: 3px 5px; font-size: 13px; /* HBS 09-28 · 11px → 13px */ font-weight: 700; line-height: 1.35; background: linear-gradient(transparent, rgba(0,0,0,.78)); color: #fff; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .module-thumb-grid__card-page-fb { position: absolute; inset: 0; display: block; overflow: hidden; }
  .module-thumb-grid__card-page-thumb--fb:hover { transform: translateY(-4px) scale(1.03); }
  .module-thumb-grid__card-page-gap { align-self: center; color: var(--module-muted, #5c6779); font-size: 13.4px; }
  .module-thumb-grid__card-page-rows { border: 1px solid var(--module-line, #e3e8ef); border-radius: 10px; background: var(--module-surface-2, #eef1f6); margin-top: 12px; overflow: hidden; }
  .module-thumb-grid__card-page-row { display: grid; grid-template-columns: 56px minmax(0,1fr) 92px 78px 62px; gap: 10px; align-items: center; padding: 7px 12px; font-size: 15px; border-top: 1px solid var(--module-line, #e3e8ef); color: var(--module-ink-2, #3f4859); text-decoration: none; }
  .module-thumb-grid__card-page-row:first-child { border-top: 0; }
  .module-thumb-grid__card-page-row:hover { background: var(--module-surface, #fff); color: var(--module-ink, #12161f); }
  .module-thumb-grid__card-page-row > * { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .module-thumb-grid__card-page-row-rank { font-size: 13px; color: var(--module-muted, #5c6779); font-variant-numeric: tabular-nums; }
  .module-thumb-grid__card-page-row-name { font-weight: 700; color: var(--module-ink, #12161f); }
  .module-thumb-grid__card-page-row-sub { font-size: 13px; color: var(--module-muted, #5c6779); }
  .module-thumb-grid__card-page-row-metric { font-weight: 800; text-align: right; font-variant-numeric: tabular-nums; }
  .module-thumb-grid__card-page-row-tail { font-size: 13px; color: var(--module-muted, #5c6779); text-align: right; }
  .module-thumb-grid__card-page-row-metric small { font-size: 13px; font-weight: 700; color: var(--module-muted, #5c6779); }
  .module-thumb-grid__card-page-note { margin-top: 10px; font-size: 13px; color: var(--module-muted, #5c6779); line-height: 1.6; }
@media (max-width: 700px) {
  .module-thumb-grid__card-page-row { grid-template-columns: 46px minmax(0,1fr) 58px; row-gap: 2px; }
  .module-thumb-grid__card-page-row-sub { grid-column: 2/4; }
  .module-thumb-grid__card-page-row-tail { display: none; }
}
  .module-thumb-grid__card-page-thumb, .module-thumb-grid__a13-c, .module-thumb-grid__mv-t, .module-thumb-grid__row-a { -webkit-touch-callout:none; -webkit-user-drag:none; }
  .module-thumb-grid__card-page-fb,.module-thumb-grid__card-page-name, .module-thumb-grid__card-page-rank,.module-thumb-grid__card-page-metric, .module-thumb-grid__a13-p,.module-thumb-grid__a13-no, .module-thumb-grid__row-p,.module-thumb-grid__row-p--none, .module-thumb-grid__lgr-p,.module-thumb-grid__vfx-one, .module-thumb-grid__noimg,.module-thumb-grid__noimg-hd,.module-thumb-grid__noimg-n,.module-thumb-grid__noimg-art,.module-thumb-grid__noimg-m,.module-thumb-grid__noimg-ft,.module-thumb-grid__noimg-set,.module-thumb-grid__noimg-c, .module-popup__thumb-preview-inner,.module-popup__thumb-preview-fallback,.module-popup__thumb-preview-go,.module-popup__thumb-preview-go-text { -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; -webkit-user-drag:none; }
/* ── 동기화 블록 끝 (sync-live) ── */

/* hand-fix:thumb-grid:쪽 넘김 감춤 */
/* ── 쪽 넘김이 «작동하지 않던» 이유 (2026-09-08 실측) ──
 * script.js 는 클릭한 쪽이 아닌 칸에 .module-thumb-grid__tile--hidden 을 붙인다.
 * 그런데 그 클래스에 «규칙이 어디에도 없어서» 아무 일도 일어나지 않았다 —
 * 그래서 51~100번 칸이 한꺼번에 다 보였다(사용자 지적).
 * 🔴 hidden 속성이 아니라 display 로 감춘다 — 라이브 card-grid-page.js 의 확정 조항과 같다
 *    (「hidden 은 보조기기에서도 «없는 것»이 되어 색인 논리가 깨진다」).
 */
.module-popup__card-image-tile.module-thumb-grid__tile--hidden { display: none; }

/* 쪽 번호는 오른쪽 아래에 선다(사용자 지시: 「오른쪽 하단 넘버링」) */
.module-thumb-grid__card-page-pager { display: flex; align-items: center; justify-content: flex-end; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.module-thumb-grid__card-page-pager-note { margin-right: auto; font-size: 13px; color: var(--mut, #64748b); }
.module-thumb-grid__card-page-pages { display: inline-flex; align-items: center; gap: 4px; }
.module-thumb-grid__card-grid-page-page { min-width: 30px; height: 30px; padding: 0 8px; border: 1px solid var(--line2, #d7dee8); border-radius: 6px; background: var(--surf, #fff); color: var(--ink2, #334155); font-size: 14px; font-weight: 700; cursor: pointer; font-family: inherit; }
.module-thumb-grid__card-grid-page-page:hover { border-color: var(--acc, #3b82f6); color: var(--acc, #3b82f6); }
.module-thumb-grid__card-page--on { background: var(--acc, #3b82f6); border-color: var(--acc, #3b82f6); color: #fff; }


/* ── v2.4(modules-v2.4-20260909) 에만 있던 규칙 보충 — 이름만 지금 이름으로 · 값은 v2.4 그대로 (2026-09-11 창D) ── */
.module-popup__card-image-tile {
  display:grid;
  grid-template-columns:repeat(10,1fr);
  gap:7px;
  touch-action:pan-y;
}
.module-popup__card-image-tile>* {
  min-width:0
}
.module-popup__card-image-tile.module-popup__card-image-tile-grid--info {
  grid-template-columns: repeat(3,1fr);
  gap: 12px;
}
.module-popup__card-image-tile {
  display:grid;
  grid-template-columns:repeat(10,1fr);
  gap:7px
}
@media (max-width:1100px) {
.module-popup__card-image-tile {
  grid-template-columns:repeat(8,1fr)
}
}
@media (max-width:820px) {
.module-popup__card-image-tile {
  grid-template-columns:repeat(6,1fr)
}
}
@media (max-width:520px) {
.module-popup__card-image-tile {
  grid-template-columns:repeat(4,1fr)
}
}
@media (max-width:900px) {
.module-popup__card-image-tile.module-popup__card-image-tile-grid--info {
  grid-template-columns: repeat(2,1fr);
}
}
@media (max-width:560px) {
.module-popup__card-image-tile.module-popup__card-image-tile-grid--info {
  grid-template-columns: 1fr;
}
}

/* ── 조 AL2(11-04) 그림 카드 격자 = 카드뉴스 꼴(thumb-grid 호출 쪽이 cards 칸을 켜면 figure 에 --cards 붙음 · 홈처럼 4열은 cards:"wide"). 사이트가 감싸개 div 를 두고 모듈 클래스를 덮어쓰던 규칙을 모듈 변형으로 옮김(기존 변형 규칙 바이트 동일 · 새 클래스만) ── */
.module-popup__card-image-tile-grid--cards .module-thumb-grid__card-image-tile-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.module-popup__card-image-tile-grid--cards-wide .module-thumb-grid__card-image-tile-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:900px){.module-popup__card-image-tile-grid--cards .module-thumb-grid__card-image-tile-grid,.module-popup__card-image-tile-grid--cards-wide .module-thumb-grid__card-image-tile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.module-popup__card-image-tile-grid--cards .module-thumb-grid__card-image-tile-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}
.module-popup__card-image-tile-grid--cards .module-popup__card-image-tile{aspect-ratio:auto;display:flex;flex-direction:column;background:#fff;border:1px solid #e3e3e3;border-radius:8px;text-decoration:none;padding:12px 12px 0}
.module-popup__card-image-tile-grid--cards .module-popup__card-image-tile:hover,.module-popup__card-image-tile-grid--cards .module-popup__card-image-tile:focus-visible{transform:translateY(-4px);border-color:var(--acc);box-shadow:0 12px 22px -10px rgba(0,0,0,.28)}
.module-popup__card-image-tile-grid--cards .module-popup__card-image-tile img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;border-radius:6px}
.module-popup__card-image-tile-grid--cards .module-popup__card-image-tile-name{position:static;background:none;color:var(--ink);text-align:left;white-space:normal;padding:0;margin:10px 0 12px;font-size:15px;line-height:1.45;max-height:2.9em;font-weight:700;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.module-popup__card-image-tile-grid--cards .module-popup__card-image-tile--none .module-popup__card-image-fallback{aspect-ratio:1/1;height:auto;border:0;border-radius:6px;padding:0;background:var(--surf2, #f3f4f6) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='1.5'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2'/%3E%3Cpath d='M21 17l-5-5-9 8'/%3E%3C/svg%3E") center/34% no-repeat}
.module-popup__card-image-tile-grid--cards .module-popup__card-image-tile--none .module-popup__card-image-fallback-name{display:none}
@media(max-width:560px){.module-popup__card-image-tile-grid--cards .module-popup__card-image-tile{padding:8px 8px 0}.module-popup__card-image-tile-grid--cards .module-popup__card-image-tile-name{font-size:14px;margin:8px 0 10px}}

/* core/modules/display/cta/style.css */
.u-width-100 { width: 100%; display: block; }
@media (prefers-reduced-motion: reduce) {
}
@media (prefers-reduced-motion: reduce) {
}
@media (max-width: 768px) {
}
.u-width-100 { width: 100% !important; display: block; }
@media (prefers-reduced-motion: reduce) {
.module-cta {
        transition: none !important;
    }
.module-cta:hover, .module-cta__step-card:hover {
        transform: none !important;
    }
.module-cta__highlight .module-cta:hover {
        transform: none !important;
    }
}
.module-cta__page-header .module-cta {
    margin-top: 20px;
    min-width: 160px;
}
.u-width-100 { width: 100%; }
.module-cta__arrow {
    display: inline-block;
    margin-left: 0.4em;
    font-weight: 700;
    animation: cta-arrow-bob 1.4s ease-in-out infinite;
    will-change: transform;
    line-height: 1;
}
.module-cta[href]:hover .module-cta__arrow, .module-cta--back a:hover .module-cta__arrow, .module-cta__content .module-cta--back a:hover .module-cta__arrow, .module-popup__thumb-more:hover .module-cta__arrow {
    animation-duration: 0.9s;
    animation-name: cta-arrow-bob-hover;
}
@media (prefers-reduced-motion: reduce) {
.module-cta__arrow {
        animation: none !important;
    }
}
.module-cta {
    position: relative;
    overflow: hidden;
    display: inline-block;
    color: white;
    text-decoration: none;
    padding: 14px 30px;
    border-radius: 8px;
    font-weight: bold;
    font-size: 18px;
    text-align: center;
    transition: all 0.3s ease;
    cursor: pointer;
    
    margin-top: 28px;
    margin-bottom: 28px;
}
.module-cta + .module-cta, .module-cta--large + .module-cta--large, .module-cta--xl + .module-cta--xl, .module-cta--hero + .module-cta--hero {
    margin-top: 12px;
}
.module-cta::before {
    content: '';
    position: absolute;
    top: 0;
    left: -120%;
    width: 80%;
    height: 100%;
    background: linear-gradient(115deg, transparent 0%, rgba(30, 64, 175, 0.15) 50%, transparent 100%);
    transform: skewX(-20deg);
    transition: left 0.7s ease;
    pointer-events: none;
    z-index: 1;
}
.module-cta:hover::before { left: 120%; }
.module-cta > * { position: relative; z-index: 2; }
.module-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.3);
}
@media (max-width: 768px) {
.module-cta, .module-cta--large, .module-cta--xl, .module-cta--hero {
        width: 100%;
    }
.module-cta + .module-cta, .module-cta--large + .module-cta--large, .module-cta--xl + .module-cta--xl, .module-cta--hero + .module-cta--hero {
        margin-top: 12px;
    }
}
a.module-cta, a.module-cta:hover, .module-cta__content a.module-cta, .module-cta__content a.module-cta:hover, .module-cta__highlight a.module-cta, .module-cta__highlight a.module-cta:hover, .module-cta__content .module-cta__highlight a.module-cta:hover {
    text-decoration: none !important;
}
.module-cta__highlight .module-cta {
    display: block;
    width: 100%;
    background: #fff;
    border-radius: 8px;
    font-weight: 700;
    text-decoration: none;
    text-align: center;
    box-sizing: border-box;
    margin-top: 12px;
}
.module-cta__highlight .module-cta:hover {
    background: white !important;
    opacity: 1 !important;
    transform: translateY(-2px);
    box-shadow:
        0 0 0 4px rgba(255, 255, 255, 0.55),
        0 12px 30px rgba(0, 0, 0, 0.35);
}
.module-cta__highlight.module-cta__bg-gradient-blue .module-cta { color: #2563eb !important; }
.module-cta__highlight.module-cta__bg-gradient-green .module-cta { color: #166534 !important; }
.module-cta__highlight.module-cta__bg-gradient-orange .module-cta { color: #92400e !important; }
.module-cta__highlight.module-cta__bg-gradient-purple .module-cta { color: #5b21b6 !important; }
.module-cta__highlight.module-cta__bg-gradient-red .module-cta { color: #991b1b !important; }
.module-cta__highlight.module-cta__bg-gradient-teal .module-cta { color: #0d9488 !important; }
.module-cta__highlight.module-cta__bg-gradient-gold .module-cta { color: #92400e !important; }
.module-cta__highlight.module-cta__bg-gradient-pink .module-cta { color: #db2777 !important; }
.module-cta__highlight.module-cta__bg-gradient-indigo .module-cta { color: #4338ca !important; }
.module-cta__highlight.module-cta__bg-gradient-violet .module-cta { color: #6d28d9 !important; }
.module-cta__highlight.module-cta__bg-gradient-cyan .module-cta { color: #0891b2 !important; }
.module-cta__highlight.module-cta__bg-gradient-brown .module-cta { color: #8b4513 !important; }
.module-cta__highlight.module-cta__bg-gradient-blue .module-cta:hover { color: #1d4ed8 !important; }
.module-cta__highlight.module-cta__bg-gradient-green .module-cta:hover { color: #059669 !important; }
.module-cta__highlight.module-cta__bg-gradient-orange .module-cta:hover { color: #78350f !important; }
.module-cta__highlight.module-cta__bg-gradient-purple .module-cta:hover { color: #4c1d95 !important; }
.module-cta__highlight.module-cta__bg-gradient-red .module-cta:hover { color: #dc2626 !important; }
.module-cta__highlight.module-cta__bg-gradient-teal .module-cta:hover { color: #0f766e !important; }
.module-cta__highlight.module-cta__bg-gradient-gold .module-cta:hover { color: #78350f !important; }
.module-cta__highlight.module-cta__bg-gradient-pink .module-cta:hover { color: #be185d !important; }
.module-cta__highlight.module-cta__bg-gradient-indigo .module-cta:hover { color: #3730a3 !important; }
.module-cta__highlight.module-cta__bg-gradient-violet .module-cta:hover { color: #5b21b6 !important; }
.module-cta__highlight.module-cta__bg-gradient-cyan .module-cta:hover { color: #0e7490 !important; }
.module-cta__highlight.module-cta__bg-gradient-brown .module-cta:hover { color: #6b3410 !important; }
.module-cta--hero:hover, .module-cta--hero:focus, .module-cta__calc-btn:hover, .module-cta__calc-btn:focus, .module-cta:not(.module-cta--secondary):not(.module-cta--outline):hover, .module-cta:not(.module-cta--secondary):not(.module-cta--outline):focus {
  color: #fff;
}
/* 🔴 animation 이 쓰는 @keyframes 정의(라이브 원문) — 없으면 요소가 «시작 상태로 굳는다» */
@keyframes cta-arrow-bob {
    0%, 100% { transform: translateX(0); }
    50%      { transform: translateX(6px); }
}
@keyframes cta-arrow-bob-hover {
    0%, 100% { transform: translateX(0); }
    50%      { transform: translateX(10px); }
}
/* 🔴 라이브 .module-cta--* 변형 전건(2026-09-08 — 색 변형 4종이 통째로 없어 파랑만 나왔다) */
.module-cta--secondary {
    background: #f1f5f9;
    color: #1e293b;
    border: 1px solid #cbd5e1;
}
.module-cta--secondary:hover {
    background: #e2e8f0;
    color: #0f172a;
}
.module-cta--outline {
    background: #ffffff;
    color: #3b82f6;
    border: 2px solid #3b82f6;
}
.module-cta--outline:hover {
    background: #eff6ff;
    color: #1d4ed8;
}
.module-cta--small {
    padding: 6px 12px;
    font-size: 14px;
    border-radius: 4px;
}
.module-cta--back {
  margin: 32px 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.module-cta--back a, .module-cta__content .module-cta--back a { position: relative; overflow: hidden; display: block; width: 100%; font-size: 24px; font-weight: 700; letter-spacing: -0.01em; color: #fff !important; background: var(--color-primary); text-align: center; text-decoration: none !important; padding: 20px 44px; min-height: 74px; border-radius: 14px; box-shadow: 0 6px 18px rgba(0,0,0,0.14); transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease; box-sizing: border-box; }
.module-cta--back a::before, .module-cta__content .module-cta--back a::before {
  content: '';
  position: absolute;
  top: 0;
  left: -120%;
  width: 80%;
  height: 100%;
  background: linear-gradient(
    115deg,
    transparent 0%,
    rgba(255,255,255,0.35) 50%,
    transparent 100%
  );
  transform: skewX(-20deg);
  transition: left 0.7s ease;
  pointer-events: none;
}
.module-cta--back a:hover::before, .module-cta__content .module-cta--back a:hover::before {
  left: 120%;
}
.module-cta--back a:nth-child(n+2), .module-cta__content .module-cta--back a:nth-child(n+2) {
  background: transparent;
  color: var(--color-primary) !important;
  border: 2px solid var(--color-primary);
}
.module-cta--back a:nth-child(n+2):hover, .module-cta__content .module-cta--back a:nth-child(n+2):hover {
  background: var(--color-primary);
  color: #fff !important;
}
.module-cta--back a:hover, .module-cta__content .module-cta--back a:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(0,0,0,0.22); filter: brightness(1.08); color: #fff !important; text-decoration: none !important; }
.module-cta--back a::before, .module-cta__content .module-cta--back a::before @media (prefers-reduced-motion: reduce) {
{ display: none; }
}

.module-cta--back a, .module-cta__content .module-cta--back a @media (prefers-reduced-motion: reduce) {
{ transition: none; }
}

.module-cta--back a:hover, .module-cta__content .module-cta--back a:hover @media (prefers-reduced-motion: reduce) {
{ transform: none; filter: none; }
}

.module-cta__result-card-link:focus-visible, .module-cta__table-link:focus-visible, .module-cta--back a:focus-visible, .module-cta__related-card:focus-visible, .module-cta__related-card:focus-visible, .module-cta__steps-content a:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--color-primary-light);
}
.module-cta__result-card-link, .module-cta__table-link, .module-cta--back @media print {
{
    display: none;
  }
}

.module-cta--back a, .module-cta__content .module-cta--back a @media (max-width: 640px) {
{
    font-size: 20px;
    padding: 18px 20px;
    min-height: 64px;
    border-radius: 12px;
  }
}

.module-cta--back-inset {
  margin: 36px 0 16px;
  padding: 12px 0;
}
.module-cta--large {
    padding: 18px 32px;
    font-size: 20px;
    font-weight: 700;
    min-height: 60px;
}
.module-cta--xl {
    padding: 18px 40px;
    font-size: 24px;
    font-weight: 700;
    min-height: 70px;
}
.module-cta--hero {
    padding: 18px 48px;
    font-size: 28px;
    font-weight: 800;
    min-height: 80px;
    border-radius: 16px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}
.module-cta--hero:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.2);
}
.module-cta--red {
    background: linear-gradient(135deg, #ef4444, #dc2626) !important;
    color: #fff !important;
    font-weight: 700 !important;
}
.module-cta--red:hover {
    background: linear-gradient(135deg, #dc2626, #b91c1c) !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(220, 38, 38, 0.45);
}
.module-cta--blue {
    background: linear-gradient(135deg, #3b82f6, #1e40af) !important;
    color: #fff !important;
    font-weight: 700 !important;
}
.module-cta--blue:hover {
    background: linear-gradient(135deg, #2563eb, #1e3a8a) !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(30, 64, 175, 0.45);
}
.module-cta--green {
    background: linear-gradient(135deg, #1e7e34, #155d27) !important;
    color: #fff !important;
    font-weight: 700 !important;
}
.module-cta--green:hover {
    background: linear-gradient(135deg, #155d27, #14532d) !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(22, 101, 52, 0.45);
}
.module-cta--purple {
    background: linear-gradient(135deg, #667eea, #764ba2) !important;
    color: #fff !important;
    font-weight: 700 !important;
}
.module-cta--purple:hover {
    background: linear-gradient(135deg, #5b6fd6, #6a4290) !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(124, 58, 237, 0.45);
}
.module-cta__info-box-body .module-cta--small { margin-top: 8px; margin-bottom: 2px; }
.module-cta__info-box--notice .module-cta--small { display: block; width: 100%; text-align: center; }

/* hand-fix:cta:큰 단추 세로 가운데 */
/* ── 큰 단추는 글자를 세로 가운데에 (2026-09-08 사용자 지적) ──
 * --large/--xl/--hero 는 min-height(60·70·80px)를 갖는데 바탕이 inline-block 이라
 * 글자가 위에 붙고 남는 높이가 «아래»로 몰린다(사용자: 「내부 아래 여백이 더 커」).
 * 🔴 라이브 값(글자 크기·여백·최소 높이)은 그대로 두고 «정렬»만 더한다.
 */
.module-cta--large, .module-cta--xl, .module-cta--hero {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
}
.module-cta--large.u-width-100, .module-cta--xl.u-width-100, .module-cta--hero.u-width-100 { display: flex; }

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-cta__box { background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%); color: #ffffff; border-radius: 12px; padding: 24px 28px; margin: 24px 0; text-align: center; }
  .module-cta__box-title { font-size: 1.25rem; font-weight: 700; margin: 0 0 12px 0; color: #ffffff; }
  .module-cta__box-text { font-size: 1rem; line-height: 1.6; margin: 0 0 16px 0; color: rgba(255, 255, 255, 0.9); }
  .module-cta__checklist { list-style: none; padding: 0; margin: 0 0 16px 0; text-align: left; }
  .module-cta__checklist--item { position: relative; padding-left: 28px; margin-bottom: 8px; font-size: 0.95rem; line-height: 1.6; }
  .module-cta__checklist--item::before { content: "✓"; position: absolute; left: 0; top: 0; color: #22c55e; font-weight: 700; }
@media (prefers-reduced-motion: reduce) {
  .module-cta--back a::before, .module-cta__content .module-cta--back a::before { display: none; }
  .module-cta--back a, .module-cta__content .module-cta--back a { transition: none; }
  .module-cta--back a:hover, .module-cta__content .module-cta--back a:hover { transform: none; filter: none; }
}
@media print {
  .module-cta__result-card-link, .module-cta--back { display: none; }
}
@media (max-width: 640px) {
  .module-cta--back a, .module-cta__content .module-cta--back a { font-size: 20px; padding: 18px 20px; min-height: 64px; border-radius: 12px; }
}
  .module-cta__highlight .module-cta--red { background: #fff !important; color: #dc2626 !important; border: 2px solid #dc2626 !important; }
  .module-cta__highlight .module-cta--red:hover { background: #fff !important; color: #dc2626 !important; box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.45), 0 10px 28px rgba(220, 38, 38, 0.32); }
  .module-cta__highlight .module-cta--blue { background: #fff !important; color: #1e40af !important; border: 2px solid #1e40af !important; }
  .module-cta__highlight .module-cta--blue:hover { background: #fff !important; color: #1e40af !important; box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.45), 0 10px 28px rgba(30, 64, 175, 0.32); }
  .module-cta__highlight .module-cta--green { background: #fff !important; color: #166534 !important; border: 2px solid #166534 !important; }
  .module-cta__highlight .module-cta--green:hover { background: #fff !important; color: #166534 !important; box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.45), 0 10px 28px rgba(22, 101, 52, 0.32); }
  .module-cta__highlight .module-cta--purple { background: #fff !important; color: #7c3aed !important; border: 2px solid #7c3aed !important; }
  .module-cta__highlight .module-cta--purple:hover { background: #fff !important; color: #7c3aed !important; box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.45), 0 10px 28px rgba(124, 58, 237, 0.32); }
/* ── 동기화 블록 끝 (sync-live) ── */


/* ── v2.4(modules-v2.4-20260909) 에만 있던 규칙 보충 — 이름만 지금 이름으로 · 값은 v2.4 그대로 (2026-09-11 창D) ── */
@media print {
.module-cta__result-card-link, .module-cta__table-link, .module-cta--back {
  display: none;
}
}
/* 2026-11-04 조 T — «shine» 변형(effect="shine" 일 때만 · 사용자 승인 «샤인, 움직임 효과 … 필요하면 범용 모듈에 보강»): 흰 빛줄기가 3.2초마다 한 번 지나감 · 기존 ::before(마우스 올림 빛줄기)와 따로 ::after · 움직임 줄이기 설정이면 0 */
.module-cta--shine::after { content: ''; position: absolute; top: 0; left: -60%; width: 40%; height: 100%; background: linear-gradient(100deg, transparent 0%, rgba(255, 255, 255, 0.45) 50%, transparent 100%); transform: skewX(-20deg); pointer-events: none; z-index: 1; animation: cta-shine 3.2s ease-in-out infinite; }
@keyframes cta-shine { 0% { left: -60%; } 45%, 100% { left: 130%; } }
@media (prefers-reduced-motion: reduce) { .module-cta--shine::after { animation: none; display: none; } }

/* ── 조 AL2(11-04) 휴대폰 아래 고정 구매 막대 — 가격 글자(__sticky-bar-label) + 단추(module-cta). 767px 이하에서만 보임. 새 클래스만 추가(기존 cta 규칙 바이트 동일) */
.module-cta__sticky-bar { display: none; }
@media (max-width: 767px) {
  /* 조 BI(11-05): sticky → fixed. 셸 .content-area 의 overflow-x:hidden 이 스크롤 상자라 sticky 가 쪽 위·중간·끝 어디서도 화면 아래에 안 붙었음(360 실측). 고정 막대가 마지막 내용을 가리지 않도록 막대가 있는 쪽 body 아래에 막대 높이만큼 여백 */
  .module-cta__sticky-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0; padding: var(--sticky-bar-pad-y, 10px) 12px calc(var(--sticky-bar-pad-y, 10px) + env(safe-area-inset-bottom, 0px)); background: #fff; border-top: 1px solid #e5e7eb; box-shadow: 0 -4px 12px rgba(15, 23, 42, .06); flex-wrap: nowrap; }
  body:has(.module-cta__sticky-bar) { padding-bottom: calc(var(--sticky-bar-body-gap, 76px) + env(safe-area-inset-bottom, 0px)); }
  .module-cta__sticky-bar > .module-cta.module-cta--xl { flex: 1 1 0; min-width: 0; margin: 0; min-height: var(--sticky-bar-button-min, 52px); padding: 8px 10px; font-size: 18px; line-height: 1.3; }
  .module-cta__sticky-bar-label { font-weight: 700; color: #111827; font-size: .95rem; }
  .module-cta__sticky-bar > .module-cta { flex: 1 1 auto; text-align: center; text-decoration: none; }
}
.module-cta__sticky-bar > .module-cta { word-break: keep-all; }
.module-cta__sticky-bar > .module-cta:only-child { flex: 1 1 auto; text-align: center; }

/* core/modules/display/ad-slot/style.css */
/* module-ad-slot/style.css — 🔴 기계 재생성(전건기계이식-20260907)
   절차 = _sandbox/전건기계이식-20260907/extract.mjs (판단 0 · 라이브 원문 그대로 · 이름만 치환)
   생성 = 전건기계이식-20260907(1회차) · 생성 시각은 R7(되풀이시험 diff 0) 을 위해 파일에 넣지 않는다 — 시각은 아래 작업 로그(_sandbox/전건기계이식-20260907/write-run*.txt)로 추적한다.
   분모 6파일(tgdist 제외):
     mk:components  22120B
     mk:item-modules  773217B
     mk:modules  684532B
     tg:components  34304B
     tg:item-modules  1260969B
     tg:modules  906829B
   규칙 수 = 12 (대응표 적용 4건, renamed_classes 있음)
   🔴 안 먹는 규칙(조상 컨텍스트) 2건 — _안먹는규칙.tsv 참조
*/

/* 원본 mk:modules L4412 */

/* 원본 mk:modules L4424 */
.module-ad-slot ins,

/* 원본 mk:modules L4429 */

/* 원본 mk:modules L4446 */

/* 원본 mk:modules L4453 */

/* 원본 mk:modules L4458 */
@media print {
}

/* 원본 tg:modules L4078 */
.module-ad-slot {
  margin: 24px 0;
  text-align: center;
  display: block;
  position: static;
  max-width: 100%;
  min-height: var(--ad-min-h, 250px);
  max-height: var(--ad-max-h, 280px);
  overflow: hidden;      /* 광고가 세로로 부풀어 본문을 밀어내는 것을 막는다 */
  contain: layout;       /* 누적 레이아웃 이동(CLS) 차단 */
}

/* 원본 tg:modules L4090 */
.module-ad-slot ins,
.module-ad-slot .adsbygoogle {
  max-width: 100%;       /* 가로 스크롤 방지 */
}

/* 원본 tg:modules L4095 */
.module-ad-slot__label {
  display: block;
  font-size: 13px; /* HBS 09-28 · 11px → 13px(사용자 「13px보다 작은 것은 너무 작아」) */
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--ink2, #6b7280);
  margin-bottom: 6px;
}

/* 🔴 회귀 복원 2026-09-10 창D — 09-07 01:46 「재이식」 회차에 사라졌던 규칙.
   출처 = core/modules/display/ad-slot/style.css.bak_20260907-전건이식전:48 (09-07 00:39)
   본문·주석·@블록 밖 위치·이웃 순서(__label 다음)를 «그대로» 옮겼다. 다시 쓰지 않았다.
   찍는 자리 = index.html:1  class="module-ad-slot ad-slot--{{slot}}"  (slot 에 top 이 오면 이 규칙이 걸린다)
   보여야 할 것 = 첫 화면 광고 자리의 높이가 90~100px 로 «더 조여지고» 위아래 여백이 12px 가 된다.
                  복원 전에는 기본 .module-ad-slot 높이가 그대로 나와 첫 화면을 더 밀어냈다. */
/* 첫 화면 광고 — 한 화면 안에서 끝나야 하므로 높이를 더 조인다 */
.module-ad-slot--top {
  --ad-min-h: 90px;
  --ad-max-h: 100px;
  margin: 12px 0;
  /* 근거: 원본 modules.css L4032-4036 */
}

/* 원본 tg:modules L4112 */
.module-ad-slot--placeholder {
  border: 1px dashed var(--line, #e2e7ef);
  color: var(--ink2, #6b7280);
  display: grid;
  place-items: center;
}

/* 원본 tg:modules L4119 */
.module-ad-slot__note {
  font-size: 16px; /* HBS 09-28 · 12px → 13px · HBY 09-28 · 13px → 16px(설명 문장 = 내용 글자 · 지휘자 판정) */
}

/* 원본 tg:modules L4124 */
@media print {
.module-ad-slot { display: none; }
}

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */

  .module-ad-slot__core ins, .module-ad-slot__core .adsbygoogle { max-width: 100%; }

@media print {

}
/* ── 동기화 블록 끝 (sync-live) ── */


/* ── v2.4(modules-v2.4-20260909) 에만 있던 규칙 보충 — 이름만 지금 이름으로 · 값은 v2.4 그대로 (2026-09-11 창D) ── */
.module-ad-slot {
  margin: 24px 0;
  text-align: center;
  display: block;
  position: static;
  max-width: 100%;
  min-height: var(--ad-min-h, 250px);
  max-height: var(--ad-max-h, 280px);
  overflow: hidden;
  contain: layout;
}
.module-ad-slot ins, .module-ad-slot .adsbygoogle {
  max-width: 100%;
}

/* core/modules/display/page-hero/style.css */
/* page-hero — 쪽 맨 위 대표 영역(그림 왼쪽 + 정보 오른쪽 · 칸이 좁으면 그림 → 정보 1단).
   상품·행사·서적·논문·단지 등 엔티티 1개 상단에 같은 한 벌. 품목 분기 0 — 차이는 칸 값뿐.
   사이트는 아래 변수만 바꾼다(부품 CSS 를 덮어쓰지 않는다). 빨강 = 사이트 토큰 --fill-accent.
   단추 = 범용 cta 클래스 계열(module-cta--xl·--shine) · 별점 줄 = rating-stars 부품 HTML(호출 쪽이 넘김).
   🔴 이 파일의 선택자는 전부 .module-page-hero 로 시작한다(맨 클래스·남의 모듈 클래스 선택자 0 · MC-411). */
.module-page-hero {
  --page-hero-accent: var(--fill-accent, #d0242b);
  --page-hero-text: #111827;
  --page-hero-muted: #6b7280;
  --page-hero-link: #374151;
  --page-hero-line: #e5e7eb;
  --page-hero-frame-border: #e5e7eb;
  --page-hero-frame-bg: #fff;
  --page-hero-radius: 12px;
  --page-hero-gap: 32px;
  --page-hero-media-width: 42%;
  --page-hero-media-max-h: 560px;                                     /* portrait·natural 그림 높이 상한 */
  --page-hero-title-size: 30px;
  --page-hero-title-size-narrow: 24px;
  --page-hero-price-size: 32px;
  --page-hero-price-size-narrow: 28px;
  --page-hero-off-bg: var(--page-hero-accent);
  --page-hero-off-text: #fff;
  --page-hero-meter-track: #f0f0f0;                                   /* 라이브 kimchimuseum.com 막대 색(product-card 와 같은 값) */
  --page-hero-meter-fill: linear-gradient(90deg, #e53e3e, #c53030);
  --page-hero-divider: var(--line, #e5e7eb);                          /* 아래 구분선 색(사이트 선 토큰 --line · 없으면 연한 회색) */
  --page-hero-divider-gap: 28px;                                      /* 선 위(모듈 안쪽 아래)·선 아래(다음 절까지) 여백 — 1280·360 같은 원칙 */
  container: page-hero / inline-size;
  width: 100%;
  box-sizing: border-box;
  margin: 16px 0 var(--page-hero-divider-gap);
  padding-bottom: var(--page-hero-divider-gap);
  border-bottom: 1px solid var(--page-hero-divider);                  /* 본문과 구분(사용자 11-04 «하단 선 · 회색 1px») · divider 칸 "off" 면 없음 */
  color: var(--page-hero-text);
}
.module-page-hero.module-page-hero--no-divider { padding-bottom: 0; border-bottom: 0; }   /* 두 단 클래스 = 순서가 아니라 무게로 이김 */

/* ── 틀: 기본 1단(그림 → 정보) · 칸 너비 600px 이상 = 2단(그림 42% · 간격 32px · 위 끝 맞춤) ── */
.module-page-hero__layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; align-items: start; }
@container page-hero (min-width: 600px) {
  .module-page-hero__layout { grid-template-columns: var(--page-hero-media-width) minmax(0, 1fr); gap: var(--page-hero-gap); }
  .module-page-hero--noimg .module-page-hero__layout { grid-template-columns: minmax(0, 1fr); }
}
/* simplified: 칸 너비 질의를 못 읽는 옛 브라우저만 화면 너비로 대신 · 업그레이드 경로 = 이 블록과 파일 끝 같은 블록 삭제(지원률이 충분해지면) */
@supports not (container-type: inline-size) {
  @media (min-width: 768px) {
    .module-page-hero__layout { grid-template-columns: var(--page-hero-media-width) minmax(0, 1fr); gap: var(--page-hero-gap); }
    .module-page-hero--noimg .module-page-hero__layout { grid-template-columns: minmax(0, 1fr); }
  }
}

/* ── 그림: 테두리 = 틀 한 겹(연한 1px) · 그림이 틀을 채움(아래 빈 틈 0) · 기본 정사각 / portrait 3:4 / natural 원본 비율 ── */
.module-page-hero .module-page-hero__media { margin: 0; padding: 0; border: 0; min-width: 0; }
.module-page-hero__stage { position: relative; }
.module-page-hero .module-page-hero__frame {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  box-sizing: border-box;
  border: 1px solid var(--page-hero-frame-border);
  border-radius: var(--page-hero-radius);
  background: var(--page-hero-frame-bg);
  overflow: hidden;
}
.module-page-hero .module-page-hero__frame[href] { cursor: zoom-in; }
.module-page-hero .module-page-hero__frame:focus-visible { outline: 3px solid var(--page-hero-accent); outline-offset: 2px; }
/* 세로로 긴 그림(포스터·표지)은 높이 상한 안에서 가운데 — 배지는 무대(=틀) 모서리에 붙으므로 크기는 무대에 준다 */
.module-page-hero__media--portrait .module-page-hero__stage { max-width: calc(var(--page-hero-media-max-h) * 3 / 4); margin-inline: auto; }
.module-page-hero__media--portrait .module-page-hero__frame { aspect-ratio: 3 / 4; }
.module-page-hero__media--natural .module-page-hero__stage { width: fit-content; max-width: 100%; margin-inline: auto; }
.module-page-hero__media--natural .module-page-hero__frame { aspect-ratio: auto; }
.module-page-hero .module-page-hero__img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  object-fit: contain;
}
.module-page-hero__media--natural .module-page-hero__img { width: auto; max-width: 100%; height: auto; max-height: var(--page-hero-media-max-h); }
.module-page-hero__media-badge {
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 2;
  padding: 4px 10px;
  border-radius: 8px;
  background: var(--page-hero-off-bg);
  color: var(--page-hero-off-text);
  font-size: 15px;
  font-weight: 800;
  line-height: 1.3;
  pointer-events: none;
}
.module-page-hero__media-badge--top-right { left: auto; right: 12px; }
.module-page-hero__media-badge--bottom-left { top: auto; bottom: 12px; }
.module-page-hero__media-badge--bottom-right { top: auto; bottom: 12px; left: auto; right: 12px; }
.module-page-hero__media-badge--dark { background: rgba(17, 24, 39, .82); color: #fff; }
.module-page-hero .module-page-hero__caption { margin: 8px 0 0; font-size: 13px; line-height: 1.4; color: var(--page-hero-muted); text-align: center; }

/* ── 정보 열: 위 → 아래 = 분류 줄 · 제목 · 부제 · 정보 배지 · 별점 · 관심도 · 가격 · 이름표·값 · 단추 · 안내 · 추가 그림 ── */
.module-page-hero__info { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.module-page-hero .module-page-hero__eyebrow { margin: 0; display: flex; flex-wrap: wrap; align-items: center; font-size: 14px; line-height: 1.4; color: var(--page-hero-muted); }
.module-page-hero__eyebrow-item + .module-page-hero__eyebrow-item::before { content: "\00B7"; margin: 0 8px; color: #cbd5e1; }
.module-page-hero .module-page-hero__eyebrow-link { color: var(--page-hero-link); font-weight: 600; text-decoration: none; }
.module-page-hero .module-page-hero__eyebrow-link:hover { color: var(--page-hero-accent); text-decoration: underline; }
.module-page-hero .module-page-hero__title {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  font-size: var(--page-hero-title-size-narrow);
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: -.02em;
  color: var(--page-hero-text);
  word-break: keep-all;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.module-page-hero .module-page-hero__subtitle { margin: -6px 0 0; font-size: 16px; line-height: 1.45; color: var(--page-hero-muted); overflow-wrap: anywhere; }

.module-page-hero .module-page-hero__badges { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.module-page-hero .module-page-hero__badge {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  margin: 0;
  padding: 6px 12px;
  border: 1px solid var(--page-hero-line);
  border-radius: 999px;
  background: #f8fafc;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  color: #374151;
}
.module-page-hero .module-page-hero__badge::before,
.module-page-hero .module-page-hero__badge::marker { content: none; }
.module-page-hero .module-page-hero__badge-label { font-weight: 800; color: inherit; }
.module-page-hero .module-page-hero__badge--accent { border-color: var(--page-hero-accent); background: #fff5f5; color: var(--page-hero-accent); }
.module-page-hero .module-page-hero__badge--good { border-color: #bbf7d0; background: #f0fdf4; color: #15803d; }
.module-page-hero .module-page-hero__badge--warn { border-color: #fde68a; background: #fffbeb; color: #b45309; }
.module-page-hero .module-page-hero__badge--muted { border-color: #e5e7eb; background: #f3f4f6; color: var(--page-hero-muted); }

.module-page-hero__rating { font-size: 16px; font-weight: 600; line-height: 1.3; color: #374151; }

/* ── 관심도 막대: 기본 = 쪽 열 때 한 번 채움(스크립트 없어도) · 화면 밖에서 시작하면 script.js 가 멈춰 두었다가 들어오면 이어서 채움 · 움직임 줄이기 = 정지한 완성 막대 ── */
.module-page-hero__meter { max-width: var(--page-hero-meter-max, 26rem); }
.module-page-hero .module-page-hero__meter-head { margin: 0 0 6px; display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 16px; line-height: 1.3; color: var(--page-hero-meter-label, var(--page-hero-muted)); }   /* 2026-11-04 사용자 «구매 관심도 … 글자 크기 최소 사이즈로 해» = 본문 최소 16px(1280·360 같음 · 조 AG · 승인 건) */
.module-page-hero .module-page-hero__meter-value { font-size: 16px; font-weight: 800; color: var(--page-hero-accent); }
.module-page-hero__meter-track { display: block; height: 10px; border-radius: 5px; background: var(--page-hero-meter-track); overflow: hidden; }
.module-page-hero__meter-fill { display: block; height: 100%; border-radius: 5px; background: var(--page-hero-meter-fill); transform-origin: left center; }
@keyframes page-hero-meter-fill { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (prefers-reduced-motion: no-preference) {
  .module-page-hero__meter-fill { animation: page-hero-meter-fill 1.1s cubic-bezier(.22, .61, .36, 1) .15s both; }
  .module-page-hero__meter--wait .module-page-hero__meter-fill { animation-play-state: paused; }
}

/* ── 가격: 할인 배지(빨강 바탕 흰 글자) → 판매가(늘 빨강 굵게 크게) → 원래 가격(회색 작게 취소선) · 원래 가격 없으면 판매가만 ── */
.module-page-hero__price { display: flex; flex-direction: column; gap: 4px; padding: 14px 0; border-top: 1px solid var(--page-hero-line); border-bottom: 1px solid var(--page-hero-line); }
.module-page-hero .module-page-hero__price-line { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; line-height: 1.2; }
.module-page-hero .module-page-hero__price-off { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 8px; background: var(--page-hero-off-bg); color: var(--page-hero-off-text); font-size: 18px; font-weight: 800; line-height: 1.2; }
.module-page-hero .module-page-hero__price-sale { font-size: var(--page-hero-price-size-narrow); font-weight: 800; letter-spacing: -.02em; color: var(--page-hero-accent); font-variant-numeric: tabular-nums; }
.module-page-hero .module-page-hero__price-regular { font-size: 16px; font-weight: 400; color: var(--page-hero-muted); text-decoration: line-through; font-variant-numeric: tabular-nums; }
.module-page-hero .module-page-hero__price-note { margin: 0; font-size: 14px; line-height: 1.4; color: var(--page-hero-muted); }

/* ── 이름표·값 줄(사양·기간·장소·서지) ── */
.module-page-hero .module-page-hero__rows { margin: 0; padding: 0; display: grid; }
.module-page-hero .module-page-hero__row { display: grid; grid-template-columns: minmax(6.5em, 24%) minmax(0, 1fr); gap: 12px; margin: 0; padding: 10px 0; border-bottom: 1px solid #eef0f3; }
.module-page-hero .module-page-hero__row-label { margin: 0; font-size: 15px; font-weight: 500; line-height: 1.5; color: var(--page-hero-muted); }
.module-page-hero .module-page-hero__row-value { margin: 0; font-size: 16px; font-weight: 600; line-height: 1.5; color: var(--page-hero-text); overflow-wrap: anywhere; }
.module-page-hero .module-page-hero__row-value a { color: var(--page-hero-link); text-decoration: underline; text-underline-offset: 3px; }

/* ── 단추: 주 = 범용 cta 클래스(xl · 샤인 · 너비 100%) 그대로 · 여기서는 바깥 여백만 0 / 보조 = 테두리 단추(샤인 0) ── */
.module-page-hero__actions { display: flex; flex-direction: column; gap: 10px; word-break: keep-all; overflow-wrap: anywhere; }   /* 좁은 칸에서 «확인/하기»처럼 낱말 가운데가 끊기지 않게(상속 속성 · 단추 규칙 덮어쓰기 0) */
.module-page-hero__actions > a.module-page-hero__action { margin: 0; box-sizing: border-box; }
.module-page-hero .module-page-hero__action--secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 56px;
  padding: 12px 20px;
  box-sizing: border-box;
  border: 1px solid var(--page-hero-accent);
  border-radius: 8px;
  background: #fff;
  color: var(--page-hero-accent);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  text-decoration: none;
  transition: background-color .15s ease;
}
.module-page-hero .module-page-hero__action--secondary:hover { background: #fff5f5; text-decoration: none; }
.module-page-hero .module-page-hero__action--secondary:focus-visible { outline: 3px solid var(--page-hero-accent); outline-offset: 2px; }

/* ── 작은 안내 줄 · 추가 그림 ── */
.module-page-hero__notes { display: flex; flex-direction: column; gap: 4px; }
.module-page-hero .module-page-hero__note { margin: 0; font-size: 13px; line-height: 1.55; color: var(--page-hero-muted); overflow-wrap: anywhere; }
.module-page-hero .module-page-hero__note-label { font-weight: 700; color: var(--page-hero-text); }
.module-page-hero__gallery { display: flex; flex-wrap: wrap; gap: 12px; }
.module-page-hero .module-page-hero__thumb { margin: 0; flex: 0 1 140px; min-width: 0; }
.module-page-hero .module-page-hero__thumb-link { display: block; }
.module-page-hero .module-page-hero__thumb-img { display: block; width: 100%; height: auto; border: 1px solid var(--page-hero-frame-border); border-radius: 8px; }
.module-page-hero .module-page-hero__thumb-caption { margin: 4px 0 0; font-size: 13px; line-height: 1.4; color: var(--page-hero-muted); }

/* ── 넓은 칸 글자 크기(제목·판매가) — 기본 규칙보다 뒤에 둬야 이긴다(같은 무게 선택자) ── */
@container page-hero (min-width: 600px) {
  .module-page-hero .module-page-hero__title { font-size: var(--page-hero-title-size); }
  .module-page-hero .module-page-hero__price-sale { font-size: var(--page-hero-price-size); }
}
@supports not (container-type: inline-size) {
  @media (min-width: 768px) {
    .module-page-hero .module-page-hero__title { font-size: var(--page-hero-title-size); }
    .module-page-hero .module-page-hero__price-sale { font-size: var(--page-hero-price-size); }
  }
}

/* 화면 낭독기 전용 글자(판매가·원래 가격·배지 풀이) */
.module-page-hero__sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ── 조 AL2(11-04) 빵부스러기 바로 뒤에 놓는 대표 영역 변형(--after-breadcrumb) — 빵부스러기 아래 → 제목(h1) 거리를 범용 셸 세트 기준(1280 50px · 360 36px)에 맞춘다.
   분류 줄(eyebrow)이 있으면 그 줄이 간격 안에 들어감. 새 클래스만 추가(기존 규칙 바이트 동일) */
.module-page-hero.module-page-hero--after-breadcrumb:not(:has(.module-page-hero__eyebrow)) { padding-top: 30px; }
.module-page-hero.module-page-hero--after-breadcrumb:has(.module-page-hero__eyebrow) { margin-top: 12px; }
@media (max-width: 600px) { .module-page-hero.module-page-hero--after-breadcrumb:not(:has(.module-page-hero__eyebrow)) { padding-top: 20px; } }

/* ── 조 AL2(11-04) 가로 띠 변형(--banner) — 메뉴 바로 아래 전체 너비 띠: 왼쪽 제목 · 값 칩(badges) · 단추(actions_html 로 받은 cta) · 안내 줄(notes) / 오른쪽 작은 그림 칸. 바탕 = 변수 --page-hero-banner-bg(기본 흰색).
   칩·제목·그림 틀은 이 변형 안에서만 모양을 바꾼다(기본 대표 영역 규칙 바이트 동일 · 새 클래스만 추가). 단추 = 범용 cta 클래스 그대로(호출 쪽이 actions_html 로 넘김) */
.module-page-hero.module-page-hero--banner { --page-hero-banner-bg: #FFFFFF; display: block; width: 100%; margin: 0; padding: 0; background: var(--page-hero-banner-bg); border-top: 1px solid var(--line-dark, #e5e7eb); border-bottom: 1px solid var(--line-dark, #e5e7eb); }
.module-page-hero.module-page-hero--banner .module-page-hero__layout { max-width: var(--site-w, 1300px); margin: 0 auto; padding: 22px 24px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.module-page-hero.module-page-hero--banner .module-page-hero__info { flex: 1 1 auto; min-width: 0; position: relative; z-index: 1; display: block; }
.module-page-hero.module-page-hero--banner .module-page-hero__title { margin: 0 0 10px; font-size: 1.45rem; line-height: 1.35; font-weight: 800; color: #7f1d1d; word-break: keep-all; letter-spacing: normal; text-wrap: wrap; overflow-wrap: normal; }
.module-page-hero.module-page-hero--banner .module-page-hero__badges { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.module-page-hero.module-page-hero--banner .module-page-hero__badge { display: block; margin: 0; padding: 4px 10px; border-radius: 999px; background: #fff; border: 1px solid #fca5a5; color: #991b1b; font-size: .85rem; font-weight: 700; line-height: inherit; }
.module-page-hero.module-page-hero--banner .module-page-hero__actions { display: block; }
.module-page-hero.module-page-hero--banner .module-page-hero__actions > a.module-page-hero__action { display: inline-flex; width: auto !important; max-width: 100%; }   /* 기존 actions 칸 단추(u-width-100 !important)를 띠 안에서는 글자 폭으로 */
.module-page-hero.module-page-hero--banner .module-page-hero__notes { display: block; margin: 10px 0 0; }
.module-page-hero.module-page-hero--banner .module-page-hero__note { margin: 0; color: #6b7280; font-size: .8rem; line-height: 1.5; max-width: 60em; }
.module-page-hero.module-page-hero--banner .module-page-hero__media { order: 2; flex: 0 0 180px; margin: 0; position: relative; z-index: 1; background: #fff; border: 1px solid #fde2e2; border-radius: 12px; padding: 10px; }
.module-page-hero.module-page-hero--banner .module-page-hero__frame { border: 0; border-radius: 0; background: none; overflow: visible; }
@media (max-width: 560px) {
  .module-page-hero.module-page-hero--banner .module-page-hero__layout { padding: 16px 10px; gap: 12px; align-items: flex-start; }
  .module-page-hero.module-page-hero--banner .module-page-hero__title { font-size: 1.1rem; }
  .module-page-hero.module-page-hero--banner .module-page-hero__media { flex-basis: 92px; padding: 6px; }
  .module-page-hero.module-page-hero--banner .module-page-hero__actions > a.module-page-hero__action { font-size: .9rem; }
}

/* core/modules/display/spec-list/style.css */


@media (max-width:820px) {
}

.module-spec-list__fact-value-cell-value { font-size: 21px; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums; line-height: 1.15; letter-spacing: -.02em; }








@media (max-width:820px) {
}





@media (max-width: 640px) {
}
@media (max-width: 640px) {
}
.u-tabular-number {
  font-variant-numeric: tabular-nums;
}
.u-visual-block-box {
  margin: 0 0 14px;
}

@media (max-width:820px) {
.module-spec-list__price-trend-line-titled-box, .u-visual-block-box.module-spec-list__key-facts-visual-box-table-scroll, .module-spec-list__card-grid-deep-dive-panel, .module-spec-list__footnote-block, .module-spec-list__cross-link-column {
    padding-left: 12px;
    padding-right: 12px;
  }
}
.module-spec-list__table-scroll-hint+.module-spec-list__prose-body-block, .module-spec-list__table-scroll-hint+.u-visual-block-box {
  margin-top: 2px;
}
.module-spec-list__page-number a.is-state-current-active {
  background: var(--acc);
  border-color: var(--acc);
  color: #fff;
}
.module-spec-list__section-footnote-line {
  font-size: 13.2px;
  color: var(--mut);
  margin: 8px 0 0;
}

body.module-spec-list__spoke-page .module-spec-list__table td:first-child, body.module-spec-list__spoke-page .module-spec-list__table-table td:first-child { font-weight: 700 }
a.module-spec-list__primary-action-button .u-tabular-number, a.module-spec-list__primary-action-button:hover .u-tabular-number { color: #fff }
a.module-spec-list__primary-action-button.module-spec-list__app-layer-primary-action-button--question .u-tabular-number { color: var(--ink) }
a.module-spec-list__primary-action-button.module-spec-list__app-layer-primary-action-button--question:hover .u-tabular-number { color: #fff }
.u-tabular-number { font-variant-numeric:tabular-nums; }
.u-figure-caption-note { margin:8px 0 14px; font-size:14px; color:var(--mut); line-height:1.55; }
.u-visual-block-box { margin:0 0 14px; border:0; }
.module-spec-list__fact-value-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(168px,1fr)); gap:9px; }
.module-spec-list__fact-value-grid>* { min-width:0; }
.module-spec-list__fact-value-cell { padding:10px 12px; background:var(--surf); border:1px solid var(--line2); border-radius:var(--r-s); }
.module-spec-list__fact-value-cell-key { font-size:13px; font-weight:700; color:var(--mut); line-height:1.35; }
.module-spec-list__fact-value-cell-value { font-size:15px; font-weight:800; color:var(--ink); font-variant-numeric:tabular-nums; line-height:1.4; }
.module-spec-list__page-number a.is-state-current-active { background:var(--acc); border-color:var(--acc); color:#fff; }
td.module-spec-list__table-number-cell { font-variant-numeric:tabular-nums; white-space:nowrap; text-align:right; font-weight:700; }
tr.is-state-current-active td { background:var(--acc-s); }
tr.is-state-current-active td:first-child { font-weight:800; }
.module-spec-list__table-scroll-frame--align-center td.module-spec-list__table-number-cell { text-align:center; }
.module-spec-list__table-scroll-frame--align-left   td.module-spec-list__table-number-cell { text-align:left; }
.module-spec-list__proportion-segment-strip i.is-state-current-active { background:var(--acc); }
.module-spec-list__proportion-segment-strip-legend .is-state-current-active i { background:var(--acc); }
.module-spec-list__proportion-segment-strip-legend .is-state-current-active { color:var(--ink); }
.module-spec-list__table-scroll-wrap.module-spec-list__bordered-table-wrapper { margin:0; }
.module-spec-list__yearly-output-spark-bars-bar.is-state-current-active { background:var(--acc); }
.module-spec-list__section-footnote-line { font-size:14px; color:var(--mut); margin:8px 0 14px; line-height:1.6; }
.module-spec-list__section-footnote-line b { color:var(--ink2); font-weight:800; }
.module-spec-list__table-scroll-wrap { overflow-x:auto; max-width:100%; -webkit-overflow-scrolling:touch; margin:16px 0 8px; border:1px solid var(--line); border-radius:8px; scrollbar-width:thin; scrollbar-color:#94a3b8 #f1f5f9; }
table td.module-spec-list__table-number-cell { white-space:nowrap; }
table th.module-spec-list__table-number-cell { white-space:nowrap; }
table td .u-tabular-number { white-space:nowrap; }
table .u-tabular-number { white-space:nowrap; }
.module-spec-list__table-scroll-hint+.u-visual-block-box { margin-top:2px; }

.module-spec-list__table tr.module-spec-list__row-highlight td { font-weight:600; background:#f9fafb; }

.module-spec-list__table tr.module-spec-list__row-highlight--current td { font-weight:600; background:#eff6ff !important; }

.module-spec-list__table tr.module-spec-list__row-highlight--green td { background:#ecfccb !important; font-weight:600; }

.module-spec-list__table tr.module-spec-list__row-highlight--yellow td { background:#fef3c7 !important; font-weight:600; }

.module-spec-list__table tr.module-spec-list__row-highlight--red td { background:#fee2e2 !important; font-weight:600; }

.module-spec-list__table tr.module-spec-list__row-highlight--green-soft td { background:#f0fdf4 !important; }

.module-spec-list__table tr.module-spec-list__row-highlight--red-soft td { background:#fef2f2 !important; }
.module-spec-list__table tr.module-spec-list__row-inactive { opacity:0.4; }
.module-spec-list__table tr.module-spec-list__row-inactive td { opacity:0.4; }
.module-spec-list__table th.module-spec-list__th-right { text-align:right; }
.module-spec-list__table td.module-spec-list__td-right { text-align:right; }
.module-spec-list__table th.module-spec-list__th-left { text-align:left; }
.module-spec-list__table td.module-spec-list__td-left { text-align:left; }
.module-spec-list__table tbody td.module-spec-list__td-center { text-align:center !important; }
.module-spec-list__table thead th.module-spec-list__td-center { text-align:center !important; }
.module-spec-list__table th.module-spec-list__td-center { text-align:center !important; }
.module-spec-list__table td.module-spec-list__td-center { text-align:center !important; }
.module-spec-list__table td:has(a.module-spec-list__hub-matrix-link) { text-align:center !important; }
.module-spec-list__table th:has(a.module-spec-list__hub-matrix-link) { text-align:center !important; }
.module-spec-list__table td.module-spec-list__td-nearby { text-align:center; }
.module-spec-list__table { width:100% !important; border-collapse:collapse !important; border-spacing:0 !important; table-layout:auto; font-size:15px; min-width:540px; margin:16px 0 8px; border:1px solid rgba(0,0,0,.1) !important; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin; scrollbar-color:#94a3b8 #f1f5f9; }
.module-spec-list__table thead { background:transparent; color:inherit; border-bottom:0; }
.module-spec-list__table caption { caption-side:top; text-align:left; font-size:15px; font-weight:700; color:#0f172a; background:#f8fafc; padding:10px 14px; border-left:4px solid var(--color-primary,#3b82f6); margin-bottom:0; border-radius:4px 4px 0 0; }
.module-spec-list__table:has(caption) { margin-top:24px; }
.module-spec-list__table th { padding:9px 14px; text-align:center; font-size:13px; letter-spacing:.05em; text-transform:uppercase; color:var(--mut); font-weight:700; border-top:1px solid var(--line); border-bottom:2px solid var(--line2); border-left:1px solid color-mix(in srgb,var(--line2)45%,transparent); border-right:1px solid color-mix(in srgb,var(--line)60%,transparent) !important; }
.module-spec-list__table th:first-child { border-left:0; }
.module-spec-list__table th:last-child { border-right:none !important; }
.module-spec-list__table td { padding:9px 14px; text-align:left; font-size:15px; color:inherit; border-top:1px solid var(--line); border-bottom:1px solid var(--line); border-left:1px solid color-mix(in srgb,var(--line2)45%,transparent); border-right:1px solid color-mix(in srgb,var(--line)60%,transparent) !important; }
.module-spec-list__table td:not(.module-spec-list__table-cell--center):not(.module-spec-list__table-cell--note):not(:first-child) { text-align:right; }
.module-spec-list__table td:first-child { border-left:0; }
.module-spec-list__table td:last-child { border-right:none !important; }
.module-spec-list__table td:first-child { text-align:left; }
.module-spec-list__table td:first-child:has(a:not(.module-spec-list__table-link)) { text-align:left; }
.module-spec-list__table td.module-spec-list__td-notes { text-align:left; font-size:inherit !important; color:inherit !important; }
.module-spec-list__table th.module-spec-list__td-notes { text-align:left; font-size:inherit !important; color:inherit !important; }
.module-spec-list__table a:not(.module-spec-list__table-link) { text-decoration:none; color:var(--color-primary); }
.module-spec-list__table a:not(.module-spec-list__table-link):hover { text-decoration:underline; color:var(--color-primary-dark); }
.module-spec-list__table a.module-spec-list__table-btn { display:inline-block; padding:6px 10px; border:1px solid var(--color-border,#cbd5e1); border-radius:6px; background:var(--color-bg-subtle,#f8fafc); color:var(--color-primary); font-weight:600; text-decoration:none; transition:background 0.15s ease,border-color 0.15s ease; min-height:36px; line-height:1.4; }
.module-spec-list__table a.module-spec-list__table-btn:hover { background:var(--color-primary-bg,#eff6ff); border-color:var(--color-primary); text-decoration:none; outline:none; }
.module-spec-list__table a.module-spec-list__table-btn:focus-visible { background:var(--color-primary-bg,#eff6ff); border-color:var(--color-primary); text-decoration:none; outline:2px solid var(--color-primary); outline-offset:2px; }
.module-spec-list__table td:has(>a.module-spec-list__table-btn) { text-align:center; }
.module-spec-list__table td:has(>strong>a.module-spec-list__table-btn) { text-align:center; }
.module-spec-list__table td:first-child:has(a.module-spec-list__table-btn) { text-align:center; }
.module-spec-list__table tbody tr:nth-child(even) { background:transparent; }
.module-spec-list__table tbody tr:nth-child(even) td { background:transparent; }
.module-spec-list__table tbody tr:hover { background:var(--surf); }
.module-spec-list__table tr:hover td { background:var(--surf); }

.module-spec-list__table tr.module-spec-list__subtotal td { background:var(--color-bg-subtle); font-weight:600; border-bottom:1px solid var(--color-border); }
.module-spec-list__table tr.module-spec-list__row-subtotal td { background:var(--color-bg-subtle); font-weight:600; border-bottom:1px solid var(--color-border); }
.module-spec-list__table tr.module-spec-list__total td { background:var(--color-primary-light); font-weight:700; color:var(--color-primary-dark); }
.module-spec-list__table tbody tr:last-child td { border-bottom:2px solid var(--color-border) !important; }
.module-spec-list__table.module-spec-list__center-first td:first-child { text-align:center; }
.module-spec-list__table-scroll-wrap>table { margin:0; }
.module-spec-list__table-scroll-wrap+.module-spec-list__table-scroll-hint:not(.module-spec-list__table-scroll-hint--top) { margin-top:14px !important; }
.module-spec-list__table-scroll-hint--top+.module-spec-list__table-scroll-wrap { margin-top:2px !important; }
.module-spec-list__matchup-table td.module-spec-list__table-number-cell { text-align:right; font-variant-numeric:tabular-nums; font-weight:700; }
.module-spec-list__app-layer-meta-tile-value.u-tabular-number { overflow:visible; text-overflow:clip; white-space:nowrap; }
@media (max-width:820px) {
.u-visual-block-box.module-spec-list__key-facts-visual-box-table-scroll { padding-left:12px; padding-right:12px; }
}
.module-spec-list__table td.module-spec-list__table-number-cell { text-align:right; font-variant-numeric:tabular-nums; font-weight:700; white-space:nowrap; }
.module-spec-list__table th.module-spec-list__table-number-cell { text-align:right; font-variant-numeric:tabular-nums; font-weight:700; white-space:nowrap; }

.module-spec-list__app-layer-attribute-chip-link.is-state-current-active { background:var(--card-edge,hsl(47 100% 78%)); border-color:transparent; color:hsl(224 30% 10%); }
th.module-spec-list__table-number-cell { text-align:right; }
td.u-tabular-number { font-variant-numeric:tabular-nums; white-space:nowrap; text-align:right; }
.module-spec-list__fact-value-cell-value { font-size: 21px; letter-spacing: -.02em; line-height: 1.15; }
.module-spec-list__table td, .module-spec-list__table th { font-variant-numeric: tabular-nums; }
.module-spec-list__table, .module-spec-list__table-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;

    border: 0 !important;
    table-layout: auto;

    font-size: 17px;
    margin: 16px 0 8px;
}
.module-spec-list__table td.module-spec-list__td-notes, .module-spec-list__table-table td.module-spec-list__td-notes {
    text-align: left !important;
    font-size: inherit !important;
    color: inherit !important;
}
.module-spec-list__table td.module-spec-list__td-center, .module-spec-list__table-table td.module-spec-list__td-center {
    text-align: center !important;
}
.module-spec-list__table thead, .module-spec-list__table-head {
    background: #e2e8f0;
    color: #1e293b;
    border-bottom: 2px solid #94a3b8;
}
.module-spec-list__table caption, .module-spec-list__table-caption-2 {
    caption-side: top;
    text-align: left;
    font-size: 16px;
    font-weight: 700;
    color: #0f172a;
    background: #f8fafc;
    padding: 10px 14px;

    margin-bottom: 10px;
    border-radius: 4px;
}
.module-spec-list__table th, .module-spec-list__table-table th {
    padding: 12px 10px;
    font-weight: 700;
    text-align: center;
    color: #1e293b;

    border-top: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
}
.module-spec-list__table td, .module-spec-list__table-table td, .module-spec-list__table-cell {
    padding: 11px 10px;
    text-align: right;
    border-bottom: 1px solid #e5e7eb !important;
    color: #374151;

    border-top: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
}
.module-spec-list__table tbody tr:nth-child(even) td { background: #f8fafc; }
.module-spec-list__table tr:hover td { background: #f1f5f9; }
.module-spec-list__table a { text-decoration: none; color: #3b82f6; }
.module-spec-list__table a:hover { text-decoration: none; color: #1d4ed8; }
.module-spec-list__table-scroll-wrap-2, .module-spec-list__table-scroll-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 16px 0;
    border-radius: 8px;
}

.module-spec-list__table--salary tr.module-spec-list__row-highlight td, .module-spec-list__table tr.module-spec-list__row-highlight td {
  font-weight: 600;
  background: #f3f4f6 !important;
}

.module-spec-list__table--salary tr.module-spec-list__row-highlight--current td, .module-spec-list__table tr.module-spec-list__row-highlight--current td {
  font-weight: 600;
  background: #eff6ff !important;
}
.module-spec-list__table tr.module-spec-list__row-highlight--green, .module-spec-list__table tr.module-spec-list__row-highlight--green td {
  background: #ecfccb !important;
  font-weight: 600;
}
.module-spec-list__table tr.module-spec-list__row-highlight--yellow, .module-spec-list__table tr.module-spec-list__row-highlight--yellow td {
  background: #fef3c7 !important;
  font-weight: 600;
}
.module-spec-list__table tr.module-spec-list__row-highlight--red, .module-spec-list__table tr.module-spec-list__row-highlight--red td {
  background: #fee2e2 !important;
  font-weight: 600;
}
.module-spec-list__table tr.module-spec-list__row-highlight--green-soft, .module-spec-list__table tr.module-spec-list__row-highlight--green-soft td {
  background: #f0fdf4 !important;
}
.module-spec-list__table tr.module-spec-list__row-highlight--red-soft, .module-spec-list__table tr.module-spec-list__row-highlight--red-soft td {
  background: #fef2f2 !important;
}
.module-spec-list__table tr.module-spec-list__row-inactive, .module-spec-list__table tr.module-spec-list__row-inactive td {
  opacity: 0.4;
}
.module-spec-list__table th.module-spec-list__th-right, .module-spec-list__table td.module-spec-list__td-right {
  text-align: right;
}
.module-spec-list__table th.module-spec-list__th-left, .module-spec-list__table td.module-spec-list__td-left {
  text-align: left;
}
body .module-spec-list__table th.module-spec-list__td-center, body .module-spec-list__table td.module-spec-list__td-center, .module-spec-list__table tbody td.module-spec-list__td-center, .module-spec-list__table thead th.module-spec-list__td-center, .module-spec-list__table th.module-spec-list__td-center, .module-spec-list__table td.module-spec-list__td-center, .module-spec-list__table td:has(a.module-spec-list__hub-matrix-link), .module-spec-list__table th:has(a.module-spec-list__hub-matrix-link) {
  text-align: center !important;
}
.module-spec-list__table td.module-spec-list__td-nearby, table td.module-spec-list__td-nearby, .module-spec-list__section-body table td.module-spec-list__td-nearby {
  text-align: center;
}
.module-spec-list__table, table, .module-spec-list__section-body table {
  width: 100% !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: auto;
  font-size: 16px;
  margin: 16px 0 8px;

  border-top: 1px solid #dbeafe !important;
  border-bottom: 1px solid #dbeafe !important;
  border-left: none !important;
  border-right: none !important;
}
.module-spec-list__table thead {
  background: #e2e8f0;
  color: #1e293b;
  border-bottom: 2px solid #94a3b8;
}
.module-spec-list__table-caption, .module-spec-list__table caption {
  caption-side: top;
  text-align: left;
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
  background: #f8fafc;
  padding: 10px 14px;
  border-left: 4px solid var(--color-primary, #3b82f6);
  margin-bottom: 0;
  border-radius: 4px 4px 0 0;
}
.module-spec-list__table:has(caption) {
  margin-top: 24px;
}
.module-spec-list__table th, table th, .module-spec-list__section-body table th {
  padding: 12px 10px;
  font-weight: 700;
  text-align: center;
  color: #1e293b;
  border-right: 1px solid #cbd5e1 !important;
}
/* 11-08 사용자 «테이블 오른쪽 세로 열려있는 건 … 원천 개선해. 재발 방지» — 범위 없는 «table th/td:last-child» 를 뺌(모든 표 마지막 칸 오른쪽 선을 지웠음) · 관문 = 범위 없는 표 선택자 늘어남 0 */
.module-spec-list__table th:last-child, .module-spec-list__section-body table th:last-child {
  border-right: none !important;
}
.module-spec-list__table td, table td, .module-spec-list__section-body table td {
  padding: 11px 10px;
  text-align: right;
  border-bottom: 1px solid var(--color-border-light);
  color: var(--color-text-body);
  border-right: 1px solid #dbeafe !important;
}
.module-spec-list__table td:last-child, .module-spec-list__section-body table td:last-child {
  border-right: none !important;
}
.module-spec-list__table td:first-child {
  text-align: left;
}
.module-spec-list__table td:first-child:has(a:not(.module-spec-list__table-link)) {
  text-align: left;
}

.module-spec-list__table td.module-spec-list__td-notes, .module-spec-list__table th.module-spec-list__td-notes {
  text-align: left;
  font-size: inherit !important;
  color: inherit !important;
}
.module-spec-list__table td, .module-spec-list__table th {
  font-size: inherit;
  color: inherit;
}
.module-spec-list__table a:not(.module-spec-list__table-link) {
  text-decoration: none;
  color: var(--color-primary);
}
.module-spec-list__table a:not(.module-spec-list__table-link):hover {
  text-decoration: underline;
  color: var(--color-primary-dark);
}
.module-spec-list__table a.module-spec-list__table-btn {
  display: inline-block;
  padding: 6px 10px;
  border: 1px solid var(--color-border, #cbd5e1);
  border-radius: 6px;
  background: var(--color-bg-subtle, #f8fafc);
  color: var(--color-primary);
  font-weight: 600;
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease;
  min-height: 36px;
  line-height: 1.4;
}
.module-spec-list__table a.module-spec-list__table-btn:hover, .module-spec-list__table a.module-spec-list__table-btn:focus-visible {
  background: var(--color-primary-bg, #eff6ff);
  border-color: var(--color-primary);
  text-decoration: none;
  outline: none;
}
.module-spec-list__table a.module-spec-list__table-btn:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}
.module-spec-list__table td:has(> a.module-spec-list__table-btn), .module-spec-list__table td:has(> strong > a.module-spec-list__table-btn), .module-spec-list__table td:first-child:has(a.module-spec-list__table-btn) {
  text-align: center;
}
.module-spec-list__table tbody tr:nth-child(even) {
  background: var(--color-bg-subtle);
}
.module-spec-list__table tbody tr:hover {
  background: #f1f5f9;
}

.module-spec-list__table tr.module-spec-list__row-highlight td {
  background: #f9fafb;
  font-weight: 600;
}
.module-spec-list__table tr.module-spec-list__subtotal td, .module-spec-list__table tr.module-spec-list__row-subtotal td {
  background: var(--color-bg-subtle);
  font-weight: 600;
  border-bottom: 1px solid var(--color-border);
}
.module-spec-list__table tr.module-spec-list__total td {
  background: var(--color-primary-light);
  font-weight: 700;
  color: var(--color-primary-dark);
}
.module-spec-list__table tbody tr:last-child td {
  border-bottom: 2px solid var(--color-border) !important;
}
.module-spec-list__table--salary.module-spec-list__center-first td:first-child, .module-spec-list__table.module-spec-list__center-first td:first-child {
  text-align: center;
}
.module-spec-list__table-scroll-wrap, .module-spec-list__calc-detail, .module-spec-list__table--salary, .module-spec-list__table {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #94a3b8 #f1f5f9;
}
.module-spec-list__table-scroll-wrap {
  margin: 16px 0 8px;
}
.module-spec-list__table-scroll-wrap > table {
  margin: 0;
}
.module-spec-list__table-scroll-wrap + .module-spec-list__table-scroll-hint:not(.module-spec-list__table-scroll-hint--top), .module-spec-list__table-wrap + .module-spec-list__table-scroll-hint:not(.module-spec-list__table-scroll-hint--top) {
  margin-top: 14px !important;
}
.module-spec-list__table-scroll-hint--top + .module-spec-list__table-scroll-wrap, .module-spec-list__table-scroll-hint--top + .module-spec-list__table-wrap {
  margin-top: 2px !important;
}
.module-spec-list__calc-detail table, .module-spec-list__calc-detail td, .module-spec-list__calc-detail th, .module-spec-list__table--salary, .module-spec-list__table--salary td, .module-spec-list__table--salary th, .module-spec-list__calc-detail td, .module-spec-list__table--salary td, .module-spec-list__calc-detail th, .module-spec-list__calc-detail td, .module-spec-list__table-scroll-wrap th, .module-spec-list__table-scroll-wrap td, .module-spec-list__table--salary th, .module-spec-list__table--salary td, .module-spec-list__table th, .module-spec-list__table td {
  white-space: nowrap !important;
}
table, .module-spec-list__table-scroll-wrap table, .module-spec-list__table-wrap table {
  width: auto !important;
  min-width: 100% !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  table-layout: auto !important;
  display: table !important;
}
.module-spec-list__table-scroll-wrap { overflow-x: auto; width: 100%; }
.module-spec-list__table tr.module-spec-list__tr-current td, .module-spec-list__table tr.module-spec-list__tr-current td, .module-spec-list__table-table tr.module-spec-list__tr-current td, table tr.module-spec-list__tr-current td {
    background: #eff6ff !important;
    font-weight: 600;
}
@media (max-width: 640px) {
.module-spec-list__calc-result-box .module-spec-list__table, .module-spec-list__table-wrap .module-spec-list__table { min-width: 420px; }
.module-spec-list__calc-detail::-webkit-scrollbar, .module-spec-list__table-scroll-wrap::-webkit-scrollbar, .module-spec-list__pyung-table::-webkit-scrollbar, .module-spec-list__area-type-table::-webkit-scrollbar, .module-spec-list__table--salary::-webkit-scrollbar, .module-spec-list__table::-webkit-scrollbar {
    height: 6px;
  }
.module-spec-list__calc-detail::-webkit-scrollbar-track, .module-spec-list__table-scroll-wrap::-webkit-scrollbar-track, .module-spec-list__pyung-table::-webkit-scrollbar-track, .module-spec-list__area-type-table::-webkit-scrollbar-track, .module-spec-list__table--salary::-webkit-scrollbar-track, .module-spec-list__table::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 3px;
  }
.module-spec-list__calc-detail::-webkit-scrollbar-thumb, .module-spec-list__table-scroll-wrap::-webkit-scrollbar-thumb, .module-spec-list__pyung-table::-webkit-scrollbar-thumb, .module-spec-list__area-type-table::-webkit-scrollbar-thumb, .module-spec-list__table--salary::-webkit-scrollbar-thumb, .module-spec-list__table::-webkit-scrollbar-thumb {
    background: #94a3b8;
    border-radius: 3px;
  }
}
.module-spec-list__method-card > table, .module-spec-list__method-card > .module-spec-list__table-scroll-wrap {
  width: 100%;
}
.module-spec-list__table tr.module-spec-list__row-current {
  background: var(--color-primary-light);
}
.module-spec-list__table tr.module-spec-list__row-current td {
  font-weight: 700;
  color: var(--color-primary-dark);
}
.module-spec-list__section--nearby .module-spec-list__table td:first-child {
  text-align: center;
}
.module-spec-list__table td:has(.module-spec-list__hub-nav-current):not(.module-spec-list__td-notes), .module-spec-list__table td:has(.module-spec-list__table-link):not(.module-spec-list__td-notes) {
  text-align: center;
}
.module-spec-list__calc-content-section > h3, .module-spec-list__calc-result > h3, .module-spec-list__table-scroll-wrap > h3 {
  font-size: 18px !important;
  font-weight: 700 !important;
  margin: 24px 0 12px 0 !important;
  line-height: 1.4 !important;
  color: #1e293b;
}
.module-spec-list__table {
  display: table !important;
  width: 100% !important;
  table-layout: auto;
  margin: 16px 0 8px;
}
.module-spec-list__table-scroll-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.module-spec-list__content table, .module-spec-list__content .module-spec-list__table, .module-spec-list__content section table, .module-spec-list__content div table, table {
  width: 100% !important; min-width: 100%; border-collapse: collapse; margin: 16px 0;
}
.module-spec-list__content .module-spec-list__table-scroll-wrap, .module-spec-list__content .module-spec-list__table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }
.module-spec-list__table tbody tr th[scope="row"], .module-spec-list__table tbody tr td, .module-spec-list__table tbody tr th[scope="row"], .module-spec-list__table tbody tr td {
  border-bottom: 1px solid #e5e7eb !important;
}
.module-spec-list__table tbody tr:last-child th[scope="row"], .module-spec-list__table tbody tr:last-child td, .module-spec-list__table tbody tr:last-child th[scope="row"], .module-spec-list__table tbody tr:last-child td {
  border-bottom: 2px solid #e5e7eb !important;
}
.module-spec-list__table.module-spec-list__hub-matrix tbody tr th[scope="row"], .module-spec-list__table.module-spec-list__hub-matrix tbody tr td, .module-spec-list__table.module-spec-list__hub-matrix tbody tr th[scope="row"], .module-spec-list__table.module-spec-list__hub-matrix tbody tr td {
  border-bottom: 1px solid #e5e7eb !important;
}
table.module-spec-list__hub-matrix, .module-spec-list__table-scroll-wrap table.module-spec-list__hub-matrix, .module-spec-list__table-wrap table.module-spec-list__hub-matrix {
  width: auto !important;
  min-width: 900px !important;
  table-layout: auto !important;
  overflow-x: visible !important;
  display: table !important;
}
.module-spec-list__hub-block--rank-x-component .module-spec-list__hub-matrix, .module-spec-list__hub-block--tis-x-component .module-spec-list__hub-matrix, .module-spec-list__hub-block--rank-x-type .module-spec-list__hub-matrix, .module-spec-list__hub-block--state-x-service .module-spec-list__hub-matrix, .module-spec-list__hub-block--rank-x-component .module-spec-list__table-scroll-wrap table.module-spec-list__hub-matrix, .module-spec-list__hub-block--tis-x-component .module-spec-list__table-scroll-wrap table.module-spec-list__hub-matrix, .module-spec-list__hub-block--rank-x-type .module-spec-list__table-scroll-wrap table.module-spec-list__hub-matrix, .module-spec-list__hub-block--state-x-service .module-spec-list__table-scroll-wrap table.module-spec-list__hub-matrix {
  min-width: 100% !important;
  width: auto !important;
  table-layout: auto !important;
}
.module-spec-list__section--scenarios .module-spec-list__table, .module-spec-list__section--scenarios .module-spec-list__table {
  width: 100% !important;
  margin: 16px 0 !important;
  table-layout: auto !important;
}
.module-spec-list__section--scenarios .module-spec-list__table th, .module-spec-list__section--scenarios .module-spec-list__table td, .module-spec-list__section--scenarios .module-spec-list__table th, .module-spec-list__section--scenarios .module-spec-list__table td {
  padding: 10px 12px !important;
  text-align: right !important;
  font-size: 15px !important;
}
.module-spec-list__section--scenarios .module-spec-list__table thead th, .module-spec-list__section--scenarios .module-spec-list__table thead th {
  background: #1a73e8 !important;
  color: #fff !important;
  text-align: center !important;
}
.module-spec-list__section--scenarios .module-spec-list__table tbody th[scope="row"], .module-spec-list__section--scenarios .module-spec-list__table tbody th[scope="row"] {
  text-align: left !important;
  background: #f9fafb !important;
  font-weight: 600 !important;
  color: #111827 !important;
}
.module-spec-list__section--state-comparison .module-spec-list__table td:first-child, .module-spec-list__section--state-comparison .module-spec-list__table th:first-child {
  text-align: left !important;
  vertical-align: middle;
}
.module-spec-list__table td:first-child:not(.module-spec-list__td-notes) {
  text-align: center;
}
.module-spec-list__table th:first-child:not(.module-spec-list__td-notes) {
  text-align: center;
}
@media (max-width: 640px) {
.module-spec-list__content .module-spec-list__table-scroll-wrap, .module-spec-list__content .module-spec-list__table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
}
.module-spec-list__table td:has(.module-spec-list__table-ico-cell), .module-spec-list__table-table td:has(.module-spec-list__table-ico-cell) { text-align: left !important; }
.module-spec-list__card-spotlight-dp-prodlink:not(.module-spec-list__table-link), .module-spec-list__content a.module-spec-list__card-spotlight-dp-prodlink:not(.module-spec-list__table-link), .module-spec-list__table a.module-spec-list__card-spotlight-dp-prodlink:not(.module-spec-list__table-link), .module-spec-list__info-box.module-spec-list__info-box a.module-spec-list__card-spotlight-dp-prodlink:not(.module-spec-list__table-link), .module-spec-list__entry-content .module-spec-list__section a.module-spec-list__card-spotlight-dp-prodlink:not(.module-spec-list__table-link) {
    font-weight: 700;
    color: var(--color-primary-dark);
    text-decoration: none;
    padding: 2px 4px;
    border-radius: 4px;
    transition: background .15s, color .15s;
}
.module-spec-list__card-spotlight-dp-prodlink:not(.module-spec-list__table-link):hover, .module-spec-list__content a.module-spec-list__card-spotlight-dp-prodlink:not(.module-spec-list__table-link):hover, .module-spec-list__table a.module-spec-list__card-spotlight-dp-prodlink:not(.module-spec-list__table-link):hover, .module-spec-list__info-box.module-spec-list__info-box a.module-spec-list__card-spotlight-dp-prodlink:not(.module-spec-list__table-link):hover, .module-spec-list__entry-content .module-spec-list__section a.module-spec-list__card-spotlight-dp-prodlink:not(.module-spec-list__table-link):hover {
    background: color-mix(in srgb, var(--color-primary-dark, #1e40af) 12%, #fff);
    color: var(--color-primary-dark);
    text-decoration: none;
}

/* ── 열별 정렬 (2026-09-08 사용자 지시) ──
 * 「항목」 가운데 · 「값」 가운데 · 「메모」 왼쪽.
 * 🔴 표 껍데기 클래스를 table 모듈과 공유하므로, 이 모듈 표에만 붙는 표식에 건다.
 */
.module-spec-list > table > thead > tr > th:nth-child(1),
.module-spec-list > table > thead > tr > th:nth-child(2),
.module-spec-list > table > thead > tr > th:nth-child(3),

/* hand-fix:spec-list:열별 정렬 */
/* ── 열별 정렬 (2026-09-08 사용자 지시) ──
 * 「항목」 가운데 · 「값」 가운데 · 「메모」 왼쪽.
 * 🔴 표 껍데기 클래스를 table 모듈과 공유하므로, 이 모듈 표에만 붙는 표식에 건다.
 */
.module-spec-list > table > thead > tr > th:nth-child(1),
.module-spec-list > table > tbody > tr > td:nth-child(1) { text-align: center; }
.module-spec-list > table > thead > tr > th:nth-child(2),
.module-spec-list > table > tbody > tr > td:nth-child(2) { text-align: center; }
.module-spec-list > table > thead > tr > th:nth-child(3),
.module-spec-list > table > tbody > tr > td:nth-child(3) { text-align: left; }

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-spec-list__table-scroll-frame--align-center th, .module-spec-list__table-scroll-frame--align-center td { text-align:center; }
  .module-spec-list__table-scroll-frame--align-left th, .module-spec-list__table-scroll-frame--align-left td { text-align:left; }
  .module-spec-list__table-scroll-frame--align-right th, .module-spec-list__table-scroll-frame--align-right td { text-align:right; }
  .module-spec-list__content-section-block>.module-spec-list__table-scroll-frame { margin-bottom:12px; }
  .module-spec-list__content-section-block>.module-spec-list__table-scroll-frame:last-child { margin-bottom:0; }
/* ── 동기화 블록 끝 (sync-live) ── */


/* ── v2.4(modules-v2.4-20260909) 에만 있던 규칙 보충 — 이름만 지금 이름으로 · 값은 v2.4 그대로 (2026-09-11 창D) ── */
.module-spec-list__table td.module-spec-list__table-cell--center, .module-spec-list__table td.module-spec-list__table-cell--center {
  text-align: center !important;
}
.module-spec-list__table td.module-spec-list__table-cell--note, .module-spec-list__table td.module-spec-list__table-cell--note {
  text-align: left !important;
}
.module-spec-list__table > table > thead > tr > th:nth-child(1), .module-spec-list__table > table > tbody > tr > td:nth-child(1) {
  text-align: center;
}
.module-spec-list__table > table > thead > tr > th:nth-child(2), .module-spec-list__table > table > tbody > tr > td:nth-child(2) {
  text-align: center;
}
.module-spec-list__table > table > thead > tr > th:nth-child(3), .module-spec-list__table > table > tbody > tr > td:nth-child(3) {
  text-align: left;
}

/* 🆕 2026-10-09 앱층 흡수(T43) — 사실 칸 아래 꼬리 글(fact_pairs[].tail). 새 클래스만. 근거(앱층): quick-fact 의 칸 아래 보조 글. 토큰만 · 13px 미만 0 */
.module-spec-list__fact-value-cell-tail { margin-top:4px; font-size:13px; line-height:1.4; color:var(--mut); }

/* 🆕 2026-10-09 간격 보장(사용자 10-09 «글자 사이 간격») — 값·이름표 바로 아래 설명 글 위 간격 ≥ 6px(실측 0~4px 이던 자리) · PL-APP-MOD-01 · CO-05 */
.module-spec-list__fact-value-cell-value { margin-top:6px; }
.module-spec-list__fact-value-cell-tail { margin-top:6px; }

/* core/modules/display/steps/style.css */


@media (max-width:900px) {
}
@media (max-width:760px) {
}

@media (max-width: 768px) {
}
@media print {
}
.module-steps__reasoning-step-grid>* { min-width:0; }
.module-steps__reasoning-step-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:12px; }
.module-steps__reasoning-step-card { padding:12px 13px; border-radius:var(--r-s); background:var(--surf2); border:1px solid var(--line2); border-top:3px solid var(--acc); }
.module-steps__reasoning-step-card-name { font-size:13px; font-weight:800; letter-spacing:.06em; color:var(--mut); }
.module-steps__process-step-diagram { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; gap:12px; align-items:stretch; padding:18px 16px; background:var(--surf); border:1px solid var(--line2); border-radius:var(--r-s); margin-bottom:12px; }
.module-steps__process-step-diagram>* { min-width:0; }
/* HAR조 2026-09-27 테두리 한 겹 — 단계 칸(item)을 품을 때만 도식 겉틀 선 0(단계 칸 테두리가 한 겹) · 구획 = 여백 */
.module-steps__process-step-diagram:has(.module-steps__item) { border-color:transparent; }
/* HCH조 2026-09-28 테두리 한 겹 — 단계 칸을 품은 도식은 겉틀 바탕·안쪽 여백도 0(kpi-card 판과 같은 부류 · 사용자 09-28 「이중 테두리야」) · 칸 사이 = 격자 gap 그대로 */
.module-steps__process-step-diagram:has(.module-steps__item) { background:transparent; padding:0; }

.module-steps__process-step-arrow { width:40px; display:grid; place-items:center; color:var(--acc); }
.module-steps__process-step-arrow svg { width:100%; height:36px; fill:none; stroke:currentColor; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
@media (max-width:900px) {
.module-steps__process-step-diagram { grid-template-columns:1fr; gap:9px; }
.module-steps__process-step-diagram .module-steps__process-step-arrow svg { transform:rotate(90deg); }
.module-steps__process-step-arrow { width:38px; height:34px; margin:0 auto; }
}
@media (max-width:760px) {
.module-steps__reasoning-step-grid { grid-template-columns:1fr; }
}
ol.module-steps__reasoning-step-grid { margin:0; padding-left:0; list-style:none; counter-reset:s; display:flex; flex-direction:column; gap:11px; }
ol.module-steps__reasoning-step-grid li { counter-increment:s; position:relative; padding-left:38px; font-size:15px; color:var(--fg-dim); line-height:1.65; }
ol.module-steps__reasoning-step-grid li::before { content:counter(s); position:absolute; left:0; top:3px; font:700 12px/24px var(--mono); text-align:center; width:24px; height:24px; border-radius:6px; background:var(--gold-soft); color:var(--gold); }
ol.module-steps__reasoning-step-grid b { color:var(--fg); font-weight:650; }
.module-steps__item {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-left: 4px solid #3b82f6;
    border-radius: 8px;
    padding: 20px 24px;
    margin-bottom: 16px;
    display: flex;
    gap: 20px;
    align-items: flex-start;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.module-steps__item:hover {
    border-color: var(--color-primary, #1a73e8);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}
.module-steps__num {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #3b82f6;
    color: #ffffff;
    font-size: 18px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}
.module-steps__content { flex: 1; }
.module-steps__title {
    font-size: 20px;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 8px 0;
}
.module-steps__desc {
    font-size: 16px;
    color: #475569;
    line-height: 1.6;
    margin: 0;
}
.module-steps {
    margin: 24px 0;
}

.module-steps__result-card-link:focus-visible, .module-steps__table-link:focus-visible, .module-steps__cta--back a:focus-visible, .module-steps__related-card:focus-visible, .module-steps__related-card:focus-visible, .module-steps__content a:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px var(--color-primary-light);
}
@media (max-width: 768px) {
.module-steps__item {
    padding: 12px;
  }
}
@media print {
.module-steps__result-card--lt, .module-steps__result-card--derived, .module-steps__item, .module-steps__info-box--insight {
    border: 1px solid #ccc;
    box-shadow: none;
    break-inside: avoid;
  }
}

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-steps__reasoning-step-card--bad { border-top-color:var(--dn); }
  .module-steps__reasoning-step-card--good { border-top-color:var(--up); }
  .module-steps__reasoning-step-card-title { font-size:14.6px; font-weight:800; margin-top:3px; line-height:1.35; }
  .module-steps__reasoning-step-card-description { font-size:14px; color:var(--ink2); margin-top:4px; line-height:1.55; }

  .module-steps__item--highlight { background: #fef3c7; border-left-color: #f59e0b; }
  .module-steps__item--complete { background: #d1fae5; border-left-color: #10b981; }
  .module-steps__item--warning { background: #fff7ed; border-left-color: #f97316; }
  .module-steps__item--current { box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2); }
/* ── 동기화 블록 끝 (sync-live) ── */
/* 🆕 2026-10-01(EYE1-MOD · A4 · 사용자 「단계 그림 세로로 겹침」 · /oil/wti/ #domestic)
   원인 = 도식 격자가 «칸 · 화살표 · 칸 · 화살표 · 칸» 5열(1fr auto 1fr auto 1fr)인데 단계 칸(item)만 4개 들어와 화살표 자리(auto 열)에 칸이 끼어 폭 0 으로 찌그러짐(900px 초과 화면).
   처방 = 단계 칸을 품은 도식은 폭과 무관하게 «한 열 세로 목록»(칸 사이 = 칸 아래 여백 16px) · 화살표 요소를 쓰는 옛 도식은 무접촉. 되돌리기 = style.css.bak_20261001-EYE1-MOD */
.module-steps__process-step-diagram:has(.module-steps__item) { grid-template-columns:minmax(0,1fr); gap:0; }

/* core/modules/display/timeline/style.css */

.module-timeline__lifespan-band-chart-axis>span { grid-row:1; grid-column:2; position:relative; font-size:13px; color:var(--mut); }
@media (max-width:640px) {
}
@media (max-width:560px) {
}
@media (prefers-reduced-motion:reduce) {
}
.module-timeline__lifespan-band-chart-axis>span { grid-row:1; grid-column:2; font-size:13px; color:var(--mut); position:relative; }
@media (max-width:560px) {
}
.module-timeline__title { font-size: 20px; font-weight: 700; color: var(--color-text-primary); margin: 0 0 24px; padding: 14px 18px 14px 56px; background: linear-gradient(135deg, color-mix(in srgb, var(--color-primary, #1a73e8) 8%, transparent), transparent 70%); border-left: 4px solid var(--color-primary, #1a73e8); border-radius: 8px; position: relative; display: inline-flex; align-items: center; text-decoration: none; line-height: 1.3; }
.module-timeline__event { position: relative; opacity: 1; transform: none; transition: opacity 0.6s ease, transform 0.6s ease; }
.module-timeline__event {
    opacity: 1; transform: none; transition: opacity 0.6s ease, transform 0.6s ease; position: relative;
}
@media (prefers-reduced-motion: reduce) {
}
@media (max-width: 640px) {
}
.u-tabular-number {
  font-variant-numeric: tabular-nums;
}
a.module-timeline__primary-action-button .u-tabular-number, a.module-timeline__primary-action-button:hover .u-tabular-number { color: #fff }
a.module-timeline__primary-action-button.module-timeline__app-layer-primary-action-button--question .u-tabular-number { color: var(--ink) }
a.module-timeline__primary-action-button.module-timeline__app-layer-primary-action-button--question:hover .u-tabular-number { color: #fff }
.u-tabular-number { font-variant-numeric:tabular-nums; }
.u-figure-caption-note { margin:8px 0 14px; font-size:14px; color:var(--mut); line-height:1.55; }
.module-timeline__lifespan-band-chart-band { transform-origin:left center; animation:none; animation-play-state:paused; position:absolute; top:0; height:100%; border-radius:7px; background:var(--et,var(--mut)); }
.module-timeline__lifespan-band-chart-band.module-timeline__sh-go { animation-play-state:running; }
.module-timeline__vertical-rail { list-style:none; margin:0 0 12px; padding:0; position:relative; }
.module-timeline__vertical-rail-name { white-space:nowrap; flex:0 0 auto; font-size:13px; font-weight:800; color:var(--acc-i); background:var(--acc-s); border-radius:999px; padding:2px 10px; }
.module-timeline__vertical-rail--markets .module-timeline__vertical-rail-name { grid-area:num; justify-self:start; width:fit-content; margin:0; }
.module-timeline__lifespan-band-chart-track { margin:0; padding:14px; background:var(--surf2); border:1px solid var(--line); border-radius:var(--r-s); }
.module-timeline__lifespan-band-chart-row { display:grid; grid-template-columns:104px minmax(0,1fr)96px; gap:9px; align-items:center; margin-bottom:7px; }
.module-timeline__lifespan-band-chart-row:last-of-type { margin-bottom:0; }
.module-timeline__lifespan-band-chart-row>* { min-width:0; }
.module-timeline__lifespan-band-chart-row-key { font-size:14px; font-weight:800; line-height:1.25; word-break:keep-all; overflow-wrap:anywhere; }
.module-timeline__lifespan-band-chart-row-key em { display:block; font-style:normal; font-size:13px; font-weight:700; color:var(--mut); }
.module-timeline__lifespan-band-chart-row-track { position:relative; height:13px; border-radius:7px; background:var(--line2); }
.module-timeline__lifespan-band-chart-row-years { font-size:13px; color:var(--ink2); text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.module-timeline__lifespan-band-chart-axis { display:grid; grid-template-columns:104px minmax(0,1fr)96px; gap:9px; font-size:13px; color:var(--mut); margin-top:8px; padding-top:7px; border-top:1px solid var(--line); }
.module-timeline__lifespan-band-chart-axis>span { grid-row:1; grid-column:2; position:relative; }
.module-timeline__lifespan-band-chart-axis>span::before { content:""; position:absolute; top:-15px; width:2px; height:15px; background:var(--line); }
.module-timeline__lifespan-band-chart-axis>span:first-child::before { left:0; }
.module-timeline__lifespan-band-chart-axis>span:last-child::before { right:0; }
.module-timeline__lifespan-band-chart-legend { display:flex; flex-wrap:wrap; gap:8px 18px; margin:10px 0 0; padding:0; list-style:none; font-size:13px; color:var(--mut); }
.module-timeline__lifespan-band-chart-legend-item { display:flex; align-items:center; gap:7px; }
.module-timeline__lifespan-band-chart-legend-glyph { flex:0 0 auto; display:block; width:22px; height:13px; border-radius:7px; }
.module-timeline__lifespan-band-chart-legend-label { min-width:0; }
table td .u-tabular-number { white-space:nowrap; }
table .u-tabular-number { white-space:nowrap; }
.module-timeline__app-layer-meta-tile-value.u-tabular-number { overflow:visible; text-overflow:clip; white-space:nowrap; }
@media (max-width:640px) {
.module-timeline__vertical-rail-name { grid-area:num; justify-self:start; width:fit-content; margin:0; }
}
@media (max-width:560px) {
.module-timeline__vertical-rail-name { margin-left:58px; }
.module-timeline__lifespan-band-chart-row { grid-template-columns:88px minmax(0,1fr)84px; gap:7px; }
}
@media (prefers-reduced-motion:reduce) {
.module-timeline__lifespan-band-chart-band { animation:none; }
}
.module-timeline__lifespan-band-chart-axis>span { grid-row:1; grid-column:2; font-size:13px; color:var(--mut); }
.module-timeline__lifespan-band-chart-axis>span:first-child { justify-self:start; }
.module-timeline__lifespan-band-chart-axis>span:last-child { justify-self:end; }
td.u-tabular-number { font-variant-numeric:tabular-nums; white-space:nowrap; text-align:right; }
@media (max-width:560px) {
.module-timeline__lifespan-band-chart-axis { grid-template-columns:88px minmax(0,1fr)84px; gap:7px; }
.module-timeline__lifespan-band-chart-row-years { text-align:left; }
}
.module-timeline {
    margin: 16px 0;
    overflow-x: clip;
}
.module-timeline__title {
    font-size: 20px;
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0 0 24px;
    padding: 14px 18px 14px 56px;
    background: linear-gradient(135deg, color-mix(in srgb, var(--color-primary, #1a73e8) 8%, transparent), transparent 70%);
    border-left: 4px solid var(--color-primary, #1a73e8);
    border-radius: 8px;
    position: relative;
    line-height: 1.3;
}
.module-timeline__title::before {
    content: '📅';
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 26px;
    line-height: 1;
}
.module-timeline--vertical .module-timeline__events {
    position: relative;
    padding-left: 48px;
}
/* 🔴 top:14px = 묶음 머리 상자(여백 6+6 + 글줄 약 16 ≈ 28)의 «한가운데».
   사건 표식이 상자 중앙에 붙는 것과 같은 자리라 묶음 배치에서 선이 머리에서 자연스럽게 시작한다.
   2026-09-09 사용자 확인 — 「우연히 제대로 된 설계」. 이유 없이 고치지 말 것.
   알려진 한계 = 시기 글자가 두 줄로 접히면 가운데가 아니게 된다(현재 어휘로는 발생 안 함). */
.module-timeline--vertical .module-timeline__events::before {
    content: '';
    position: absolute;
    top: 14px;
    bottom: 14px;
    left: 13px;
    width: 3px;
    background: linear-gradient(180deg, var(--color-primary, #1a73e8) 0%, color-mix(in srgb, var(--color-primary, #1a73e8) 30%, transparent) 100%);
    border-radius: 2px;
}
.module-timeline--vertical .module-timeline__content {
    background: #fff;
    border: 1px solid var(--color-border, #e5e7eb);
    border-radius: 10px;
    padding: 16px 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 1px 2px rgba(0, 0, 0, 0.03);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    position: relative;
}
.module-timeline--vertical .module-timeline__event:hover .module-timeline__content {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08), 0 2px 4px rgba(0, 0, 0, 0.04);
    border-color: color-mix(in srgb, var(--color-primary, #1a73e8) 30%, var(--color-border, #e5e7eb));
}
.module-timeline--vertical .module-timeline__content::before {
    content: '';
    position: absolute;
    top: 14px;
    left: -8px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 8px solid var(--color-border, #e5e7eb);
}
.module-timeline--vertical .module-timeline__content::after {
    content: '';
    position: absolute;
    top: 14px;
    left: -7px;
    width: 0;
    height: 0;
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-right: 8px solid #fff;
}
.module-timeline--vertical .module-timeline__event {
    position: relative;
    padding-bottom: 20px;
}
.module-timeline--vertical .module-timeline__event:last-child {
    padding-bottom: 0;
}
.module-timeline--vertical .module-timeline__event:last-child::after {
    content: '';
    position: absolute;
    top: 32px;       
    bottom: -14px;   
    left: -35px;     
    width: 3px;
    background: #fff;
    z-index: 1;
}
.module-timeline--vertical .module-timeline__marker {
    position: absolute;
    left: -48px;
    top: 4px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    border: 3px solid #fff;
    box-shadow: 0 0 0 2px var(--color-border);
}
.module-timeline--horizontal .module-timeline__events {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.module-timeline--horizontal .module-timeline__event {
    flex: 1;
    min-width: 180px;
    position: relative;
    padding-top: 44px;
}
.module-timeline--horizontal .module-timeline__marker {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: 700;
    color: #fff;
}
.module-timeline--horizontal .module-timeline__content {
    text-align: center;
}
.module-timeline--compact .module-timeline__events {
    margin: 0;
    padding: 0;
}
.module-timeline--compact .module-timeline__event {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid var(--color-border);
}
.module-timeline--compact .module-timeline__event:last-child {
    border-bottom: none;
}
.module-timeline--compact .module-timeline__marker {
    display: none;
}
.module-timeline__event {
    position: relative;
}
.module-timeline__date {
    font-size: 15px;
    font-weight: 700;
    color: var(--color-text-secondary);
    margin-bottom: 4px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.module-timeline__timeline-title {
    font-size: 16px;
    font-weight: 700;
    color: var(--color-text-primary);
    margin: 0 0 6px;
    line-height: 1.4;
}
.module-timeline__timeline-title a {
    color: var(--color-primary);
    text-decoration: none;
}
.module-timeline__timeline-title a:hover {
    text-decoration: underline;
}
.module-timeline__desc {
    font-size: 16px;
    line-height: 1.6;
    color: var(--color-text-secondary);
    margin: 0 0 8px;
}
.module-timeline__desc:last-child {
    margin-bottom: 0;
}
.module-timeline__sources {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 6px;
    font-size: 13px;
}
.module-timeline__source {
    color: var(--color-text-secondary);
}
a.module-timeline__source {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    background: rgba(59, 130, 246, 0.08);
    border-radius: 4px;
    color: var(--color-primary);
    text-decoration: none;
    font-weight: 600;
    position: relative;
}
a.module-timeline__source:hover {
    background: rgba(59, 130, 246, 0.15);
    color: var(--color-primary-dark);
}
.module-timeline__event {
    opacity: 1;
    transform: none;
    transition: opacity 0.6s ease, transform 0.6s ease;
}
.module-timeline__event.is-visible {
    opacity: 1;
    transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
.module-timeline__event {
        opacity: 1;
        transform: none;
        transition: none;
    }
}
html.module-timeline__no-js .module-timeline__event, .module-timeline__no-js .module-timeline__event {
    opacity: 1;
    transform: none;
}
a.module-timeline__source {
    position: relative;
}
a.module-timeline__source:hover .module-timeline__source-preview, a.module-timeline__source:focus .module-timeline__source-preview {
    opacity: 1;
    visibility: visible;
}
.module-timeline--grouped .module-timeline__group {
    margin: 10px 0 8px;
    padding: 6px 14px;
    background: var(--color-bg-subtle);
    border-radius: var(--color-radius-sm);
    font-size: 14px;
    font-weight: 700;
    color: var(--color-text-primary);
    width: fit-content;
    border: 1px solid var(--color-border);
}
.module-timeline--grouped .module-timeline__group:first-child {
    margin-top: 0;
}
.module-timeline__badge {
    display: inline-block;
    font-size: 13px; /* HBS 09-28 · 11px → 13px */
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-left: 8px;
    color: #fff;
    vertical-align: middle;
}
.module-timeline__marker.module-timeline__marker--milestone {
    background: #3b82f6;
}
.module-timeline__marker.module-timeline__marker--revision {
    background: #8b5cf6;
}
.module-timeline__marker.module-timeline__marker--warning {
    background: #f59e0b;
}
.module-timeline__marker.module-timeline__marker--event {
    background: #94a3b8;
}
/* 🔴 2026-09-09 서사 카테고리 세트 — 위 4개 원본 선언은 그대로 두고 «새 규칙을 뒤에 더해» 덮는다.
   층① 카테고리(뜻·안 바뀜)=start·change·end·note ↔ 층② 색상 세트(옷·배치마다 고를 수 있음).
   마커 규칙은 세트가 몇 개든 이 4개 변수(--nc-*)만 본다 — 세트를 늘려도 마커 규칙은 안 건드린다.
   정본 = docs/directive/platform/_서사-카테고리-세트-정본-20260909.md */
.module-timeline {
    --nc-start: var(--acc);
    --nc-change: var(--up);
    --nc-end: var(--dn);
    --nc-note: var(--mut);
}
/* 세트 「보조」— 같은 페이지에 타임라인을 둘 이상 쓸 때 «기본」과 구분되도록 다른 옷을 입힌다.
   기본과 마찬가지로 start=세트에서 가장 강한 색 · end=가장 물러난 색 순서를 지킨다. */
.module-timeline--palette-secondary {
    --nc-start: var(--acc-i);
    --nc-change: var(--acc);
    --nc-end: var(--line2);
    --nc-note: var(--mut);
}
.module-timeline__marker.module-timeline__marker--start,
.module-timeline__marker.module-timeline__marker--milestone {
    background: var(--nc-start);
}
.module-timeline__marker.module-timeline__marker--change,
.module-timeline__marker.module-timeline__marker--revision {
    background: var(--nc-change);
}
.module-timeline__marker.module-timeline__marker--end,
.module-timeline__marker.module-timeline__marker--warning {
    background: var(--nc-end);
}
.module-timeline__marker.module-timeline__marker--note,
.module-timeline__marker.module-timeline__marker--event {
    background: var(--nc-note);
}
@media (max-width: 640px) {
.module-timeline--horizontal .module-timeline__events {
        flex-direction: column;
    }
.module-timeline--horizontal .module-timeline__event {
        padding-top: 0;
        padding-left: 44px;
        text-align: left;
    }
.module-timeline--horizontal .module-timeline__marker {
        top: 4px;
        left: 0;
        transform: none;
    }
.module-timeline--horizontal .module-timeline__content {
        text-align: left;
    }
.module-timeline--compact .module-timeline__event {
        grid-template-columns: 100px 1fr;
        gap: 8px;
    }
}

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-timeline__vertical-rail-image { position:relative; padding-left:26px; }
  .module-timeline__vertical-rail-image::before { content:""; position:absolute; left:5px; top:0; bottom:0; width:1.5px; background:var(--line2); }
  .module-timeline__vertical-rail-image:first-child::before { top:22px; }
  .module-timeline__vertical-rail-image:last-child::before { bottom:calc(100% - 22px); }
  .module-timeline__vertical-rail-dot { position:absolute; left:-26px; top:16px; width:11px; height:11px; border-radius:50%; background:var(--surf); border:2px solid var(--line2); box-sizing:border-box; }
  .module-timeline__vertical-rail-rank { display:flex; align-items:center; gap:12px; padding:8px 10px; border-radius:var(--r-s); text-decoration:none; color:var(--ink2); position:relative; }
  a.module-timeline__vertical-rail-rank:hover { background:var(--surf2); }
  a.module-timeline__vertical-rail-rank:focus-visible { outline:2px solid var(--acc); outline-offset:2px; }
  span.module-timeline__vertical-rail-rank { cursor:default; }
  .module-timeline__vertical-rail-picture { flex:0 0 auto; display:block; }
  .module-timeline__vertical-rail-year { white-space:nowrap; flex:0 0 auto; font-size:14px; font-weight:800; color:var(--acc-i); font-variant-numeric:tabular-nums; letter-spacing:-.02em; }
  .module-timeline__vertical-rail--markets .module-timeline__vertical-rail-rank { display:grid; grid-template-columns:auto auto minmax(0,1fr); grid-template-areas:"pic y num" "pic s s" "pic desc desc"; align-items:start; gap:2px 10px; }
  .module-timeline__vertical-rail--markets .module-timeline__vertical-rail-picture { grid-area:pic; align-self:start; }
  .module-timeline__vertical-rail--markets .module-timeline__vertical-rail-body { display:contents; }
  .module-timeline__vertical-rail--markets .module-timeline__vertical-rail-heading { display:contents; }
  .module-timeline__vertical-rail--markets .module-timeline__vertical-rail-year { grid-area:y; }
  .module-timeline__vertical-rail--markets .module-timeline__vertical-rail-subtitle { grid-area:s; font-size:16px; font-weight:800; color:var(--ink); white-space:normal; overflow:visible; text-overflow:clip; line-height:1.35; word-break:keep-all; }
  .module-timeline__vertical-rail--markets .module-timeline__vertical-rail-width { grid-area:desc; margin-top:1px; }
  .module-timeline__vertical-rail-subtitle { font-size:15px; font-weight:800; color:var(--ink); min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .module-timeline__vertical-rail-width { display:block; margin-top:2px; font-size:13px; line-height:1.5; color:var(--mut); word-break:keep-all; }
  .module-timeline__vertical-rail-image--current>.module-timeline__vertical-rail-rank { background:var(--acc-s); box-shadow:inset 0 0 0 1px var(--acc); }
  .module-timeline__vertical-rail-image--current .module-timeline__vertical-rail-dot { background:var(--acc); border-color:var(--acc); }
  .module-timeline__vertical-rail-current { flex:0 0 auto; font-size:13px; font-weight:800; color:var(--acc-i); border:1px solid var(--acc); border-radius:999px; padding:0 8px; line-height:1.5; }
  .module-timeline__vertical-rail--markets>* { min-width:0; }
  .module-timeline__vertical-rail-rank>* { min-width:0; }
  .module-timeline__lifespan-band-chart-legend-glyph--live { background:var(--acc); }
  .module-timeline__lifespan-band-chart-legend-glyph--stopped { background:var(--mut); }
@media (max-width:640px) {
  .module-timeline__vertical-rail-rank { display:grid; grid-template-columns:auto minmax(0,1fr); grid-template-areas:"pic head" "pic num" "desc desc"; align-items:center; gap:2px 10px; }
  .module-timeline__vertical-rail-body { display:contents; }
  .module-timeline__vertical-rail-picture { grid-area:pic; align-self:stretch; display:flex; align-items:center; }
  .module-timeline__vertical-rail-heading { grid-area:head; }
  .module-timeline__vertical-rail-width { grid-area:desc; margin-top:1px; }
}
@media (max-width:560px) {
  .module-timeline__vertical-rail-rank { flex-wrap:wrap; gap:9px; }
  .module-timeline__vertical-rail-body { flex:1 1 calc(100% - 58px); }
}
  .module-timeline__vertical-rail-body { flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:2px; }
  .module-timeline__vertical-rail-heading { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
  .module-timeline--vertical .module-timeline__event--highlight { position: relative; padding: 12px 0; border-radius: var(--color-radius-sm); }
  .module-timeline--vertical .module-timeline__event--highlight::before { content: ''; position: absolute; top: 0; bottom: -10px; left: -16px; right: -16px; background: var(--color-bg-subtle); border-radius: var(--color-radius-sm); z-index: -1; }
  .module-timeline--horizontal .module-timeline__event--highlight { background: var(--color-bg-subtle); border: 1px solid var(--color-primary); border-radius: var(--color-radius-sm); padding: 44px 12px 12px; }
  .module-timeline--compact .module-timeline__event--highlight { background: var(--color-bg-subtle); border-left: 4px solid var(--color-primary); padding-left: 12px; }
  a.module-timeline__source--icon::after { content: ' ↗'; font-size: 0.85em; opacity: 0.7; margin-left: 2px; }
  a.module-timeline__source--pill { display: inline-flex; align-items: center; padding: 2px 10px; background: rgba(59, 130, 246, 0.08); border-radius: 4px; color: var(--color-primary); text-decoration: none; font-weight: 600; }
  a.module-timeline__source--pill:hover { background: rgba(59, 130, 246, 0.15); text-decoration: none; text-decoration-thickness: initial; }
  a.module-timeline__source--dot::before { content: ''; display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: var(--color-primary); margin-right: 6px; vertical-align: middle; }
  a.module-timeline__source--wavy { text-decoration: underline; text-decoration-style: wavy; text-decoration-thickness: 1px; text-underline-offset: 3px; }
  a.module-timeline__source--material::after { content: ' →'; margin-left: 4px; transition: transform 0.2s; display: inline-block; }
  a.module-timeline__source--material:hover::after { transform: translateX(3px); }
  .module-timeline__source-preview { position: absolute; bottom: calc(100% + 8px); left: 0; padding: 10px 14px; background: #1f2937; color: #fff; border-radius: 6px; font-size: 13px; font-weight: 400; line-height: 1.5; width: max-content; max-width: 280px; opacity: 0; visibility: hidden; transition: opacity 0.2s, visibility 0.2s; z-index: 100; pointer-events: none; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); text-decoration: none; }
  .module-timeline__source-preview::after { content: ''; position: absolute; top: 100%; left: 16px; border: 5px solid transparent; border-top-color: #1f2937; }
@media (hover: none) {
  .module-timeline__source-preview { display: none; }
}
  .module-timeline__badge--current { background: #059669; }
  .module-timeline__badge--upcoming { background: #f59e0b; }
@media (max-width: 640px) {
  .module-timeline--horizontal .module-timeline__event--highlight { padding: 12px 12px 12px 56px; }
}
/* ── 동기화 블록 끝 (sync-live) ── */

/* hand-fix:timeline:띠 말풍선·열린 구간 */
/* ── 띠에 «정확한 연도» 말풍선 + «열린 구간» 표시 (2026-09-08 사용자 지적) ──
 * ㉮ 「연도를 정확히 알 수가 없어」 — 띠만 보면 눈금(1999·2026) 사이를 눈으로 재야 한다.
 *    손을 얹거나 초점이 가면 그 줄의 기간을 말풍선으로 띄운다(자료가 준 값 그대로 · 셈 0).
 * ㉯ 「발매 종료면 특정 기간이 되어야 하지 않아? 구간이 아니라」 — 맞는 지적이다.
 *    «끝난 것»은 시작과 끝이 확정된 기간이고, «지금도 나오는 것»은 끝이 열린 구간이다.
 *    끝난 띠는 양끝을 둥글게(닫힘), 이어지는 띠는 오른쪽을 각지게 + 옅어지게(열림) 그린다.
 *    그러면 색을 못 가리는 사람도 «모양»으로 같은 사실을 읽는다.
 */
.module-timeline__lifespan-band-chart-row-track { overflow: visible; }
.module-timeline__lifespan-band-chart-band { position: absolute; cursor: default; }

/* 닫힌 기간 — 양끝이 둥글다(시작도 끝도 확정) */
.module-timeline__lifespan-band-chart-band--stopped { border-radius: 7px; }

/* 열린 구간 — 오른쪽 끝이 각지고 옅어져 «계속됨»을 말한다 */
.module-timeline__lifespan-band-chart-band--live { border-radius: 7px 2px 2px 7px; }
.module-timeline__lifespan-band-chart-band--live::before {
  content: ""; position: absolute; top: 0; right: 0; bottom: 0; width: 18px;
  border-radius: inherit; pointer-events: none;
  background: linear-gradient(to right, transparent, var(--surf, #fff));
  opacity: .55;
}

/* 말풍선 — 자료가 준 기간을 그대로 띄운다 */
.module-timeline__lifespan-band-chart-band::after {
  content: attr(data-range); position: absolute; left: 50%; bottom: calc(100% + 8px);
  transform: translateX(-50%); white-space: nowrap;
  padding: 5px 9px; border-radius: 7px;
  background: var(--ink, #1f2937); color: var(--surf, #fff);
  font-size: 13px; /* HBS 09-28 · 12px → 13px */ font-weight: 700; font-variant-numeric: tabular-nums;
  box-shadow: 0 6px 16px rgba(0,0,0,.28);
  opacity: 0; visibility: hidden; transition: opacity .12s; z-index: 5; pointer-events: none;
}
.module-timeline__lifespan-band-chart-band:hover::after,
.module-timeline__lifespan-band-chart-band:focus-visible::after { opacity: 1; visibility: visible; }
.module-timeline__lifespan-band-chart-band:focus-visible { outline: 2px solid var(--acc, #3b82f6); outline-offset: 2px; }

/* ── 이슈별 그림 칸 (2026-09-09 · 사용자 확정 「타임라인 각 행에 이미지」) ──
   ㉮ 라이브 계보 확인(F:/레퍼런스/TCGGrail/generatepress_child/core/template/modules/timeline.php +
      assets/css/modules.css L8574-8983) — 그림 칸이 «없다». module.jsonc coverage_gap 이 이미
      이 사실을 적어 뒀다("hub-timeline.php 의 카드 축소판 이미지... 이번 회차에서 판단을 미뤘다").
      이번이 그 판단 — 새로 만들되 movers-board 계보(gainers-losers-board__image·
      holo-thumb-popup-thumb__image)와 card-spotlight(모바일 축소 방식)를 인용했다(창작 0).
   ㉯ 자리 = «오른쪽»(지휘자 확정 2026-09-09). 왼쪽에 두면 그림 있는/없는 행의 왼쪽 끝이 달라져
      읽기 축이 흔들린다 — 오른쪽·고정폭이면 왼쪽 읽기 축(언제→무엇→왜)이 항상 같고 그림은
      세로줄을 이룬다. 연혁은 문구가 본체이고 그림은 "그때 이랬다"를 더하는 곁들이라 오른쪽이
      맞다(그림이 주인공인 card-spotlight 는 왼쪽 — 이 모듈과는 다른 판단).
   ㉰ 좁은 화면(≤640px — 이 파일이 이미 가로/컴팩트 조정에 쓰는 중단점과 통일, card-spotlight
      의 720px 대신 이 파일 자체 계보를 따랐다) = «아래로 쌓는다»(위 아님) — 읽는 순서(언제→
      무엇→왜) 보존 + 오른쪽을 억지로 유지하면 60px 안팎으로 쪼그라들어 못 읽기 때문이다.
      값·방식은 card-spotlight 의 @media(max-width:720px) 블록(width 고정→height:auto+
      max-height+object-fit:contain)을 본떴다 — 다만 그 모듈은 시각이 주인공이라 모바일에도
      고정폭(200px)을 지키지만, 이 모듈은 곁들이라 폭을 100%로 늘려 "쓸모 있는 크기"를 지킨다.
      순서는 그대로 둔다(그림이 마지막 자식 그대로 — order 로 앞당기지 않는다).
   ㉱ 그림이 «없는» 행은 이 블록의 어떤 선택자도 걸리지 않는다 — {{#if img}}(index.html)로
      요소 자체가 렌더에서 빠지고, 여기 규칙은 전부 --has-image 수식자에 걸려 있어 그 수식자가
      없으면 무관하다(판정식③ cascade-diff 대상 — 그림 없는 행은 전/후 바이트 동일이어야 한다).
   ㉲ compact 변형은 «범위 밖 발견»(marker display:none + content 단둘뿐이라 grid-template-
      columns:120px 1fr 의 1번 칸(120px)에 content 가 자동배치되는 기존 결함 — 이 회차 대상
      아님). 그림 유(--has-image) 행만 content·그림 두 자녀의 grid-column 을 명시로 고정해
      이 결함을 반복하지 않았다(그림 없는 행은 기존 결함이 그대로 — 판정식③과 정합). */
.module-timeline__event--has-image {
  display: flex;
  align-items: flex-start;
  gap: 16px;
}
.module-timeline__event--has-image .module-timeline__content {
  flex: 1 1 auto;
  min-width: 0;
}
.module-timeline__image {
  flex: 0 0 auto;
  align-self: flex-start;
}
.module-timeline__image img {
  display: block;
  width: 96px;
  height: auto;
  max-height: 96px;
  object-fit: contain;
  border-radius: 8px;
  border: 1px solid var(--color-border, #e5e7eb);
  background: var(--color-bg-subtle, #f8fafc);
}
/* horizontal(스테퍼 열) = 폭이 180px 안팎이라 그림을 옆에 못 둔다 — 열 안에서 문구 아래로
   쌓고 나머지 문구와 같은 가운데 정렬을 맞춘다(넓은 화면 기준 — 좁은 화면은 아래 재정의) */
.module-timeline--horizontal .module-timeline__event--has-image {
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.module-timeline--horizontal .module-timeline__event--has-image .module-timeline__image {
  align-self: center;
}
/* compact = grid 라 위 flex 규칙이 안 먹는다 — 3번째 칸(auto)을 새로 열어 그림을 앉힌다 */
.module-timeline--compact .module-timeline__event--has-image {
  grid-template-columns: 120px minmax(0, 1fr) auto;
}
.module-timeline--compact .module-timeline__event--has-image .module-timeline__content {
  grid-column: 2;
}
.module-timeline--compact .module-timeline__event--has-image .module-timeline__image {
  grid-column: 3;
  align-self: center;
}
@media (max-width: 640px) {
  .module-timeline__event--has-image {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .module-timeline__event--has-image .module-timeline__image {
    align-self: stretch;
  }
  .module-timeline__event--has-image .module-timeline__image img {
    width: 100%;
    max-width: 100%;
    height: auto;
    max-height: 180px;
  }
  .module-timeline--horizontal .module-timeline__event--has-image {
    align-items: flex-start;
  }
  .module-timeline--horizontal .module-timeline__event--has-image .module-timeline__image {
    align-self: flex-start;
  }
  .module-timeline--compact .module-timeline__event--has-image {
    grid-template-columns: 1fr;
    row-gap: 8px;
  }
  .module-timeline--compact .module-timeline__event--has-image .module-timeline__content {
    grid-column: 1;
  }
  .module-timeline--compact .module-timeline__event--has-image .module-timeline__image {
    grid-column: 1;
    align-self: stretch;
  }
}
/* ── 이슈별 그림 칸 끝 ── */

/* 🔴 2026-09-09 — 그림이 «안 보이던» 결함 수리.
   빌려 쓴 `.holo-thumb-popup-thumb__image`(card-holo)가 칸을 position:relative + aspect-ratio 로 두고
   안쪽 img 를 `position:absolute; inset:0` 로 «띄운다». 그래서 크기를 «그림»에 주면 칸의 내용이
   비어 폭 0 · 높이 0 이 되어 아무것도 안 보인다 — 크기는 «칸»에 줘야 한다(movers-board 계보가 그렇다).
   🔴 구체성을 두 클래스로 올려 «순서에 지지 않게» 못 박는다 — 같은 구체성이면 나중에 실린 것이 이기고,
      페이지마다 싣는 순서가 다르다(2026-09-09 팝업 회전판 결함에서 같은 함정을 겪었다). */
.module-timeline__image.module-popup__thumb-image {
  width: 114px; aspect-ratio: auto; overflow: visible; border: 0; background: none;
}
.module-timeline__image.module-popup__thumb-image > img {
  position: static; inset: auto; width: 100%; height: auto; max-height: 128px; object-fit: contain;
}
@media (max-width: 720px) {
  /* 좁은 화면 = 줄이지 않고 «쌓는다»(card-spotlight 계보) — 그림이 마지막에 오고 폭을 넓게 쓴다 */
  .module-timeline__image.module-popup__thumb-image { width: 100%; max-width: 260px; }
  .module-timeline__image.module-popup__thumb-image > img { max-height: 360px; }
}

/* 🔴 2026-09-09 — 그림 칸을 «상자 밖»에 두었더니 그림 있는 행의 상자만 96px 짧아져
   오른쪽 끝이 행마다 어긋났다(사용자 지적: 「이 둘 오른쪽 영역 길이가 달라」).
   사용자가 처음부터 「각 행 «상자 안에» 이슈별로 이미지 추가」라고 말했는데 내가 밖에 두었다.
   🔴 그림을 상자 «안»으로 옮기고, 상자 안에서 격자로 오른쪽에 세운다 —
      그러면 상자 폭은 «항상 같고» 그림만 안쪽 오른편에 나타났다 사라진다.
   그림이 «없는» 행은 이 규칙에 걸리지 않으므로 한 픽셀도 바뀌지 않는다(--has-image 로 한정). */
.module-timeline__event--has-image > .module-timeline__content {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 14px; align-items: start;
}
.module-timeline__event--has-image > .module-timeline__content > * { grid-column: 1; min-width: 0; }
.module-timeline__event--has-image > .module-timeline__content > .module-timeline__image {
  grid-column: 2; grid-row: 1 / span 99; align-self: start;
}
@media (max-width: 720px) {
  /* 좁은 화면 = 한 칸으로 되돌려 «쌓는다». 그림은 마지막에 오고 폭을 넓게 쓴다(card-spotlight 계보) */
  .module-timeline__event--has-image > .module-timeline__content { display: block; }
  .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image { margin-top: 10px; }
}

/* 🔴 2026-09-09 — 그림을 상자 «안»으로 옮기기 «전»에 쓴 변형 규칙들이 남아 어긋났다.
   530·540행 계열은 그림이 __event 의 직계 자식이던 시절의 것이라(grid-column:3 등)
   지금 구조(=__content 안)에서는 엉뚱한 격자를 가리킨다. 같은 구체성이라 순서로 이기고 있으나
   «순서로 이기는 것»은 페이지마다 뒤집힐 수 있다(2026-09-09 팝업 회전판 실증) — 못 박는다. */
.module-timeline--horizontal .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image,
.module-timeline--compact    .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image {
  grid-column: 2; grid-row: 1 / span 99; align-self: start;
}
@media (max-width: 720px) {
  .module-timeline--horizontal .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image,
  .module-timeline--compact    .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image {
    grid-column: auto; grid-row: auto; margin-top: 10px;
  }
}

/* 🔴 2026-09-09 사용자 확정 — 가로형은 그림을 «글 아래»에 둔다.
   가로형은 사건 하나가 이미 «좁은 세로 칸»(1단계 → 2단계 → 3단계)이라, 오른쪽에 그림을 세우면
   칸이 더 좁아져 단계의 흐름이 깨진다(사용자: 「간격도 조금 이해가 안 돼」).
   글 아래에 두면 칸 폭을 그대로 쓸 수 있고 읽는 순서(단계 → 이름 → 그림)도 유지된다. */
.module-timeline--horizontal .module-timeline__event--has-image > .module-timeline__content {
  display: block;
}
.module-timeline--horizontal .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image.module-popup__thumb-image {
  display: block; width: 100%; max-width: none; margin-top: 10px;
}
.module-timeline--horizontal .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image.module-popup__thumb-image > img {
  max-height: 120px;
}

/* 🔴 2026-09-09 사용자 확정 — 좁은 화면에서 그림은 «가운데», 폭은 «가로 비율»로.
   사용자: 「모바일에서 타임라인 이미지 사이즈는 가로 기준 비율로 %로 하고… 100% 너비로 하지 말고.
   너무 큰 수가 있으니까」 · 「50%, 60% 정도? 너가 설계해」
   설계 = 65% + 하한 150px + 상한 260px (사용자와 50→56→60→65 로 좁혀 확정)
     50% 는 320px 화면에서 160px 이라 봉지 글씨가 안 읽히고,
     60% 는 720px 근처에서 430px 이라 화면을 너무 먹는다.
     65% 면 320px→208px · 360px→234px · 400px 부터는 상한 260px 으로 묶인다.
     🔴 상한이 지배하므로 60%와의 실질 차이는 «400px 미만 폰»에서만 16~18px 이다.
     연혁 그림은 「그때 어땠는지」의 글씨·디테일을 봐야 해서 큰 쪽을 골랐다.
     상한 260px 은 card-spotlight 가 이미 쓰는 값이라 체계와 어긋나지 않는다.
   🔴 가로형도 같다 — 앞서 준 width:100% 를 여기서 덮는다(글 «아래»에 두는 것은 그대로). */
@media (max-width: 720px) {
  .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image.module-popup__thumb-image,
  .module-timeline--horizontal .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image.module-popup__thumb-image {
    display: block; width: 65%; min-width: 150px; max-width: 260px;
    margin-left: auto; margin-right: auto; margin-top: 12px;
  }
  .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image.module-popup__thumb-image > img,
  .module-timeline--horizontal .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image.module-popup__thumb-image > img {
    max-height: 320px;
  }
}

/* 🔴 2026-09-09 — 「정사각형 안에 이미지가 들어가 있다」(사용자) 수리.
   앞서 그림에 `width:96px; max-height:96px; border; background` 를 줘서 «정사각 상자»가 생겼고,
   300×420 그림이 contain 으로 그 안에 들어가 위아래에 바탕과 테두리가 드러났다.
   🔴 상자를 없앤다 — 폭만 정하고 높이는 «비율대로» 흐르게 두면 남는 자리가 생기지 않는다.
   테두리·바탕도 지운다(그림 자체가 모양을 갖는다). 모서리 둥글기만 남긴다. */
.module-timeline__image.module-popup__thumb-image > img {
  max-height: none; border: 0; background: none; border-radius: 8px;
}
@media (max-width: 720px) {
  .module-timeline__image.module-popup__thumb-image > img,
  .module-timeline--horizontal .module-timeline__event--has-image > .module-timeline__content > .module-timeline__image.module-popup__thumb-image > img {
    max-height: none;
  }
}

/* 🔴 2026-09-09 사용자 확정 — 「영역은 그대로 두고, 사각 테두리와 안 배경색은 안 보이게 해서
   이미지 비율이 다르더라도 같은 위치에 있게」.
   → 자리(114×160, 카드 비율 745/1040)는 «고정»하되 테두리·바탕은 «지운다».
     그림은 그 안에서 가운데에 놓이고 contain 이라 잘리지 않는다.
     비율이 제각각이어도 «차지하는 자리»가 같아 행 높이가 튀지 않는다.
   🔴 좁은 화면은 자리를 고정하지 않는다 — 세로로 쌓이므로 높이가 달라도 어긋나 보이지 않고,
      오히려 고정하면 가로로 넓은 그림이 작아진다. */
.module-timeline__image.module-popup__thumb-image {
  height: 160px; display: flex; align-items: center; justify-content: center;
  border: 0; background: none; overflow: visible;
}
.module-timeline__image.module-popup__thumb-image > img {
  width: 100%; height: 100%; object-fit: contain;
}
@media (max-width: 720px) {
  .module-timeline__image.module-popup__thumb-image { height: auto; }
  .module-timeline__image.module-popup__thumb-image > img { height: auto; }
}

/* 🔴 2026-09-09 사용자 확정 — 자리는 «정사각»이다.
   사용자: 「보이지 않는 정사각형 안에 두고, 세로 직사각형이든 가로 직사각형이든 정사각형이든
   위치는 고정 효과가 있도록 하는거잖아?」
   → 카드 비율(114×160)로 잡았던 것을 «정사각 114×114» 로 바꾼다.
     정사각이라야 세로로 긴 그림과 가로로 넓은 그림이 «같은 자리»를 차지한다
     (세로 비율로 잡으면 가로 그림이 위아래로 많이 남아 자리가 달라 보인다).
   테두리·바탕은 없고 contain 이라 어떤 비율도 잘리지 않는다. */
.module-timeline__image.module-popup__thumb-image { height: 114px; }
@media (max-width: 720px) {
  .module-timeline__image.module-popup__thumb-image { height: auto; aspect-ratio: 1 / 1; }
  .module-timeline__image.module-popup__thumb-image > img { height: 100%; }
}

/* 🔴 2026-09-09 — 그림 있는 행에서 알약(누적 N종)이 «칸을 꽉 채우던» 회귀 수리.
   상자를 격자로 바꾸자 안쪽 요소가 «격자 칸»이 되어 기본값 stretch 로 늘어났다.
   글 상자(p·div)는 늘어나는 것이 맞지만, 알약처럼 «글자 길이에 맞아야» 하는 것은 아니다.
   🔴 내가 만든 회귀다 — 격자로 바꿀 때 「무엇이 늘어나면 안 되는가」를 안 봤다. */
.module-timeline__event--has-image > .module-timeline__content > .module-timeline__vertical-rail-name,
.module-timeline__event--has-image > .module-timeline__content > .module-timeline__badge {
  justify-self: start; width: fit-content;
}

/* 🔴 2026-09-09 사용자 확정 — 알약과 아래 설명글이 붙어 있어 여백을 준다.
   알약(누적 N종)은 «값 배지»이고 바로 아래가 설명 문단이라, 붙으면 한 덩어리로 읽힌다. */
.module-timeline__vertical-rail-name { margin-bottom: 8px; }

/* 🔴 2026-09-09 — 「bar 양끝이 연도 눈금과 일치하지 않는다」(사용자) 수리.
   띠(row)는 `.…__lifespan-band-chart-track` «안»에 있고 그 상자가 padding:14px + border:1px 을 갖는다.
   눈금(axis)은 그 상자 «밖»의 형제라, 같은 격자(104px 1fr 96px)를 써도 시작점이 «15px» 어긋난다.
   🔴 캡션이 「좌우 끝은 아래 두 눈금과 같은 자리다」라고 «약속»하고 있었으므로 이것은 약속 위반이다.
   고치는 법 = 눈금 줄에 상자와 «같은 안쪽 여백»을 주어 2번 칸의 시작·끝을 맞춘다.
   (상자 쪽 padding 을 건드리면 띠의 배경 상자 모양이 바뀐다 — 눈금을 맞추는 쪽이 옳다) */
.module-timeline__lifespan-band-chart-axis { padding-left: 15px; padding-right: 15px; }

/* 🔴 2026-09-09 사용자 확정 — 열린 구간의 오른쪽 끝을 «더 분명하게» 각지게(2px → 0).
   각진 끝은 실수가 아니라 「끝이 정해지지 않았다」를 «모양»으로 말하는 장치다.
   함께 쓰는 «흐려짐»(::before 그라데이션)은 배경색에 기대는 신호라, 배경이 다른 사이트로 가면
   세기가 달라진다 — 모양은 배경과 무관하므로 이쪽을 주 신호로 둔다.
   (김치·라면 박물관 등 다른 배경의 사이트로 갈 예정이라 이 구분이 실제로 중요하다) */
.module-timeline__lifespan-band-chart-band--live { border-radius: 7px 0 0 7px; }

/* 🔴 2026-09-09 사용자 확정 — 열린 구간의 «흐려짐»을 없앤다. 색은 끝까지 «같게».
   사용자: 「진행 중인 것은 그냥 오른쪽 끝 라운드 처리하지 말고 색상 옅게 하지 말고 동일하게」
   근거 = 신호가 둘(각진 끝 + 흐려짐)이면 오히려 「값이 옅어진다」는 뜻으로 오해될 수 있고,
   흐려짐은 배경색에 기대는 신호라 사이트마다 세기가 달라진다.
   🔴 «각진 끝» 하나로만 말한다 — 모양은 배경과 무관하고 범례와 두 겹으로 겹친다. */
.module-timeline__lifespan-band-chart-band--live::before { display: none; }

/* 🔴 2026-09-11 복원 — 09-07 이후 사라진 규칙. 출처 = _assets/modules/timeline/a86b3ac6/style.css 의 .timeline__year
   본문 그대로 옮김(값 창작 0). 보여야 할 것 = 연도가 «버튼 모양»(배경·테두리·둥근 모서리)으로 감싸진다. */
.module-timeline__group { margin: 10px 0 8px; padding: 6px 14px; background: var(--color-bg-subtle); border-radius: var(--color-radius-sm); font-size: 14px; font-weight: 700; color: var(--color-text-primary); width: fit-content; border: 1px solid var(--color-border); }
.module-timeline__group:first-child { margin-top: 0; }


/* ── v2.4(modules-v2.4-20260909) 에만 있던 규칙 보충 — 이름만 지금 이름으로 · 값은 v2.4 그대로 (2026-09-11 창D) ── */
.module-timeline__desc {
  font-size: 16px;
  line-height: 1.6;
  color: var(--color-text-secondary);
  margin: 0 0 8px;
}

/* core/modules/display/download/style.css */
/* module-download — 행동 가족(§6-9) · 여러 형식(PDF·MP3·CSV·XLSX 등)의 첨부 파일을 나열하는 다운로드 영역
   출처: TCGGrail generatepress_child/core/template/modules/module-download.php (module_download())
        + assets/css/modules.css L9094-9174(본체) + L9366-9368(모바일)
   개명: 원본 클래스 밑동 `module-download*` → §9-3(클래스 밑동=모듈명) 준수를 위해 `module-download*` 로 소거.
        `.module-download__intro`(원본 L9098)는 원본에서 이미 접두어가 없어 그대로 썼다.
   이관 범위: 원본 블록 전량 — 다른 모듈과 결합·중복된 규칙 0건(전수 확인).
   색 토큰(§10-4·§15): 원본이 쓰는 `var(--color-…)` 계열은 sites/tcggrail/tokens.jsonc 28토큰과
        변수명 자체가 다르다(원본은 구 세대 토큰 체계) — 값 일치 대조 결과도 0건. 원본 하드코딩
        폴백값을 그대로 이관했다(1호 info-box·highlight 와 같은 처리 — 범용 모듈은 사이트 토큰
        파일을 직접 참조하지 못한다). */

.module-download {
  margin: 32px 0;
  /* 근거: 원본 modules.css L9095-9097 */
}


.module-download__download-list .module-download__items {
  display: flex;
  flex-direction: column;
  gap: 8px;
  /* 근거: 원본 modules.css L9102-9106 */
}

.module-download__download-grid .module-download__items {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
  /* 근거: 원본 modules.css L9107-9111 */
}

.module-download__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: var(--color-bg-light, #f7f8fa); /* 근거: 원본 L9117 */
  border: 1px solid #e0e0e0; /* 근거: 원본 L9118 — var(--color-border, #e0e0e0) */
  border-radius: 6px;
  color: #222; /* 근거: 원본 L9120 — var(--color-text, #222) */
  text-decoration: none;
  transition: background 0.15s ease, border-color 0.15s ease;
  /* 근거: 원본 modules.css L9112-9123 */
}
.module-download__item:hover {
  background: #eef2f7; /* 근거: 원본 L9125 — var(--color-bg-hover, #eef2f7) */
  border-color: #0066cc; /* 근거: 원본 L9126 — var(--color-primary, #0066cc) */
}

.module-download__icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 4px;
  background: var(--color-bg-icon, #e0e7f0) center / 60% no-repeat; /* 근거: 원본 L9133 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 13px; /* §15-a-1 글자 크기 하한 13px 준수(2026-08-15 정비 — 원본 12px) */
  color: #666; /* 근거: 원본 L9139 — var(--color-text-muted, #666) */
  /* 근거: 원본 modules.css L9128-9140 */
}
.module-download__download-icon-pdf::before  { content: 'PDF'; }
.module-download__download-icon-mp3::before  { content: 'MP3'; }
.module-download__download-icon-mp4::before  { content: 'MP4'; }
.module-download__download-icon-jpg::before  { content: 'JPG'; }
.module-download__download-icon-png::before  { content: 'PNG'; }
.module-download__download-icon-csv::before  { content: 'CSV'; }
.module-download__download-icon-xlsx::before { content: 'XLS'; }
.module-download__download-icon-docx::before { content: 'DOC'; }
.module-download__download-icon-zip::before  { content: 'ZIP'; }
.module-download__download-icon-other::before { content: 'FILE'; }
/* 근거: 원본 modules.css L9141-9150 */

.module-download__meta {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
  /* 근거: 원본 modules.css L9151-9157 */
}

.module-download__name {
  font-weight: 600;
  word-break: break-word;
  /* 근거: 원본 modules.css L9158-9161 */
}

.module-download__size {
  font-size: 13px;
  color: #888; /* 근거: 원본 L9164 — var(--color-text-muted, #888) */
  /* 근거: 원본 modules.css L9162-9165 */
}

.module-download__desc {
  font-size: 14px;
  color: #666; /* 근거: 원본 L9168 — var(--color-text-muted, #666) */
  /* 근거: 원본 modules.css L9166-9169 */
}

.module-download__arrow {
  flex-shrink: 0;
  font-size: 18px;
  color: #0066cc; /* 근거: 원본 L9173 — var(--color-primary, #0066cc) */
  /* 근거: 원본 modules.css L9170-9174 */
}

@media (max-width: 640px) {
  .module-download__download-grid .module-download__items {
    grid-template-columns: 1fr;
    /* 근거: 원본 modules.css L9366-9368 */
  }
}

/* ── 라이브가 뒤에서 덮어쓰는 규칙 벌(추출기가 놓친 것) ── */
.module-download__intro {
    margin: 8px 0 16px;
    color: var(--color-text-muted, #555);
}

/* ── 소리 파일 재생기 (2026-09-08 사용자 지시) ──
 * 목록 행이 <a> 가 아니라 <div> 이므로 링크 무늬를 그대로 쓰되 눌리는 느낌은 주지 않는다.
 */

/* hand-fix:download:소리 파일 재생기 */
/* ── 소리 파일 재생기 (2026-09-08 사용자 지시) ──
 * 목록 행이 <a> 가 아니라 <div> 이므로 링크 무늬를 그대로 쓰되 눌리는 느낌은 주지 않는다.
 */
.module-download__item--audio { cursor: default; }
.module-download__audio { display: block; width: 100%; margin-top: 8px; height: 34px; }
.module-download__save { flex: none; margin-left: auto; font-size: 18px; line-height: 1; text-decoration: none; color: var(--mut, #64748b); padding: 4px 6px; border-radius: 6px; }
.module-download__save:hover { color: var(--acc, #3b82f6); background: var(--acc-s, #eff6ff); }

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-download { margin: 32px 0; }
  .module-download--list .module-download__items { display: flex; flex-direction: column; gap: 8px; }
  .module-download--grid .module-download__items { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
  .module-download__item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--color-bg-light, #f7f8fa); border: 1px solid var(--color-border, #e0e0e0); border-radius: 6px; color: var(--color-text, #222) !important; text-decoration: none !important; transition: background 0.15s ease, border-color 0.15s ease; }
  .module-download__item:hover { background: var(--color-bg-hover, #eef2f7); border-color: var(--color-primary, #0066cc); }
  .module-download__icon { flex-shrink: 0; width: 36px; height: 36px; border-radius: 4px; background: var(--color-bg-icon, #e0e7f0) center / 60% no-repeat; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; /* HBS 09-28 · 12px → 13px */ color: var(--color-text-muted, #666); }
  .module-download__icon--pdf::before { content: 'PDF'; }
  .module-download__icon--mp3::before { content: 'MP3'; }
  .module-download__icon--mp4::before { content: 'MP4'; }
  .module-download__icon--jpg::before { content: 'JPG'; }
  .module-download__icon--png::before { content: 'PNG'; }
  .module-download__icon--csv::before { content: 'CSV'; }
  .module-download__icon--xlsx::before { content: 'XLS'; }
  .module-download__icon--docx::before { content: 'DOC'; }
  .module-download__icon--zip::before { content: 'ZIP'; }
  .module-download__icon--other::before { content: 'FILE'; }
  .module-download__meta { flex: 1 1 auto; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
  .module-download__name { font-weight: 600; word-break: break-word; }
  .module-download__size { font-size: 13px; color: var(--color-text-muted, #888); }
  .module-download__desc { font-size: 14px; color: var(--color-text-muted, #666); }
  .module-download__arrow { flex-shrink: 0; font-size: 18px; color: var(--color-primary, #0066cc); }
@media (max-width: 640px) {
  .module-download--grid .module-download__items { grid-template-columns: 1fr; }
}
/* ── 동기화 블록 끝 (sync-live) ── */


/* ── v2.4(modules-v2.4-20260909) 에만 있던 규칙 보충 — 이름만 지금 이름으로 · 값은 v2.4 그대로 (2026-09-11 창D) ── */
.module-download--list .module-download__items {
  display: flex;
  flex-direction: column;
  gap: 8px;
  /* 근거: 원본 modules.css L9102-9106 */
}
.module-download--grid .module-download__items {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
  /* 근거: 원본 modules.css L9107-9111 */
}
@media (max-width: 640px) {
.module-download--grid .module-download__items {
  grid-template-columns: 1fr;
  /* 근거: 원본 modules.css L9366-9368 */
}
}

/* core/modules/display/pdf-embed/style.css */
/* module-pdf-embed — 미디어 가족(§6-10) · PDF 문서를 페이지 안에서 iframe 으로 바로 보여 주는 인라인
   미리보기(브라우저 내장 PDF 뷰어만 쓰고 외부 라이브러리는 부르지 않는다 — 원본 헤더 주석 원칙)
   출처: TCGGrail generatepress_child/core/template/modules/pdf.php (module_pdf())
        + assets/css/modules.css L9176-9220(본체) + L9369-9378(모바일)
   개명: 원본 클래스 밑동 `module-pdf*`·`pdf__caption` → §9-3(밑동=모듈명) 준수를 위해
        `module-pdf-embed*` 로 정리.
   이관 범위: 원본 PHP(module_pdf)가 실제로 찍는 마크업·클래스에 대응하는 규칙만 포함한다.
        module-pdf__actions·__download-link·__open-link(+그 :hover, +미디어쿼리 대응분) 5개는
        PHP 도달 불가 — module.jsonc 의 "coverage_gap" 참조.
   색 토큰(§10-4·§15): 원본이 쓰는 `var(--color-…, #fallback)` 계열은 sites/tcggrail/tokens.jsonc
        28토큰과 변수명 자체가 다르다(구세대 토큰 체계) — 값 일치 대조 결과도 0건. 원본 하드코딩
        폴백값을 그대로 이관했다(info-box·download 와 같은 처리 — 범용 모듈은 사이트 토큰 파일을
        직접 참조하지 못한다). */

.module-pdf-embed {
  margin: 32px 0;
  /* 근거: 원본 modules.css L9177-9179 */
}

.module-pdf-embed__title {
  /* §9-3(밑동=모듈명) 준수를 위해 새로 지은 클래스 — 원본은 공용 module-section__title 을 그대로
     썼고(modules.css L46-74, 이 모듈 소관 밖) 이 모듈 전용 정의는 원본에 없었다. download 모듈의
     download__title 과 같은 처지라 별도 스타일을 창작하지 않고 비워 둔다(§13-1 은 «PHP 가 찍는
     변형»의 CSS 공백을 보완하라는 규칙이지, 애초에 이 모듈 소관이 아니던 공용 계보를 이 모듈
     스타일로 새로 지으라는 뜻이 아니다). */
}

.module-pdf-embed__caption {
  margin: 8px 0 12px;
  color: #666; /* 근거: 원본 L9182 — var(--color-text-muted, #666) */
  /* 근거: 원본 modules.css L9180-9183 */
}

.module-pdf-embed__embed-wrap {
  width: 100%;
  border: 1px solid #e0e0e0; /* 근거: 원본 L9186 — var(--color-border, #e0e0e0) */
  border-radius: 6px;
  overflow: hidden;
  background: #f5f5f5;
  /* 근거: 원본 modules.css L9184-9190 */
}

.module-pdf-embed__embed {
  display: block;
  width: 100%;
  border: 0;
  /* 근거: 원본 modules.css L9191-9195 */
}

.module-pdf-embed__fallback {
  /* 원본 <noscript> 안 fallback 문단 — modules.css 전수 검색에도 대응 정의가 없었다(원본부터
     비스타일 상태). §13-1(변형 보완 규칙)은 «PHP $class_map 이 찍는 변형»에 적용되는 조항이지
     이 경우처럼 원본 자체가 애초에 비스타일이던 요소까지 새로 꾸미라는 뜻이 아니라 스타일을
     창작하지 않고 원본 그대로(비스타일) 이관한다. */
}

@media (max-width: 640px) {
  .module-pdf-embed__embed {
    min-height: 400px;
    /* 근거: 원본 modules.css L9369-9371 */
  }
}

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */

@media (max-width: 640px) {

}
/* ── 동기화 블록 끝 (sync-live) ── */

/* core/modules/display/media-player/style.css */
/* module-media-player/style.css — 🔴 기계 재생성(전건기계이식-20260907)
   절차 = _sandbox/전건기계이식-20260907/extract.mjs (판단 0 · 라이브 원문 그대로 · 이름만 치환)
   생성 = 전건기계이식-20260907(1회차) · 생성 시각은 R7(되풀이시험 diff 0) 을 위해 파일에 넣지 않는다 — 시각은 아래 작업 로그(_sandbox/전건기계이식-20260907/write-run*.txt)로 추적한다.
   분모 6파일(tgdist 제외):
     mk:components  22120B
     mk:item-modules  773217B
     mk:modules  684532B
     tg:components  34304B
     tg:item-modules  1260969B
     tg:modules  906829B
   규칙 수 = 28 (대응표 적용 13건, renamed_classes 있음)
   🔴 안 먹는 규칙(조상 컨텍스트) 0건 — _안먹는규칙.tsv 참조
*/

/* 원본 mk:modules L9386 */

/* 원본 mk:modules L9389 */

/* 원본 mk:modules L9394 */

/* 원본 mk:modules L9397 */

/* 원본 mk:modules L9401 */

/* 원본 mk:modules L9409 */

/* 원본 mk:modules L9417 */

/* 원본 mk:modules L9423 */

/* 원본 mk:modules L9430 */

/* 원본 mk:modules L9436 */

/* 원본 mk:modules L9442 */

/* 원본 mk:modules L9445 */

/* 원본 mk:modules L9461 */

/* 원본 mk:modules L9465 */

/* 원본 tg:modules L9332 */
.module-media-player {
    margin: 24px 0;
}

/* 원본 tg:modules L9335 */
.module-media-player__title {
    margin: 0 0 12px;
    font-size: 20px;
    font-weight: 600;
}

/* 원본 tg:modules L9340 */
.module-media-player__media {
    width: 100%;
}

/* 원본 tg:modules L9343 */
.module-media-player__audio {
    width: 100%;
    max-width: 600px;
}

/* 원본 tg:modules L9347 */
.module-media-player__youtube-wrap {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    border-radius: 6px;
    background: #000;
}

/* 원본 tg:modules L9355 */
.module-media-player__youtube {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* 원본 tg:modules L9363 */
.module-media-player__video {
    width: 100%;
    max-width: 100%;
    border-radius: 6px;
    background: #000;
}

/* 원본 tg:modules L9369 */
.module-media-player__caption {
    margin: 8px 0 0;
    font-size: 14px;
    color: var(--color-text-muted, #666);
}

/* 원본 tg:modules L9376 */
.module-media-player--tts-inline {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    line-height: 1.4;
}

/* 원본 tg:modules L9382 */
.module-media-player--tts-block {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 4px 0;
}

/* 원본 tg:modules L9388 */
.module-media-player__tts-text {
    font-weight: 500;
}

/* 원본 tg:modules L9391 */
.module-media-player__tts-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    background: var(--color-bg-icon, #e0e7f0);
    border: 1px solid var(--color-border, #c0d0e0);
    border-radius: 50%;
    color: var(--color-primary, #0066cc);
    cursor: pointer;
    font-size: 13px; /* HBS 09-28 · 10px → 13px(22px 원 단추 안 아이콘 글자) */
    line-height: 1;
    transition: background 0.15s ease, transform 0.1s ease;
}

/* 원본 tg:modules L9407 */
.module-media-player__tts-btn:hover {
    background: var(--color-primary, #0066cc);
    color: #fff;
}

/* 원본 tg:modules L9411 */
.module-media-player__tts-btn:active {
    transform: scale(0.92);
}

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */

/* ── 동기화 블록 끝 (sync-live) ── */

/* core/modules/display/link-grid/style.css */
.module-link-grid__pill { background: #fff; border-color: var(--line2); color: #1e40af; flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 10px 8px; border: 1px solid #d1d5db; border-radius: 6px; text-decoration: none; font-size: 0.95rem; line-height: 1.3; text-align: center; transition: all 0.15s ease; min-height: 44px; }
.module-link-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 140px), 1fr)); display: grid; gap: 8px; list-style: none; margin: 8px 0 0; padding: 0; }
.module-link-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr)); gap: 8px; list-style: none; margin: 8px 0 0; padding: 0;
}
@media (max-width: 640px) {
}
@media (prefers-reduced-motion: reduce) {
}
.module-link-grid__pill {
  background: var(--surf2);
  border-color: var(--line2);
  color: var(--acc-i);
}
.module-link-grid__pill:hover {
  background: var(--acc-s);
  border-color: var(--acc);
}
.module-link-grid__info-box .module-link-grid__pill, .module-link-grid__info-box a.module-link-grid__pill {
  color: var(--acc-i);
}
.module-link-grid__info-box .module-link-grid__pill:hover, .module-link-grid__info-box a.module-link-grid__pill:hover {
  color: var(--acc-i);
  background: var(--acc-s);
  border-color: var(--acc);
}
.module-link-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 140px), 1fr)); }
.module-link-grid--narrow { grid-template-columns: repeat(auto-fit, minmax(min(100%, 100px), 1fr)); }
.module-link-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 140px), 1fr));   
    gap: 8px;
    list-style: none;
    margin: 8px 0 0;
    padding: 0;
}
.module-link-grid--narrow {           
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 100px), 1fr));
}
.module-link-grid__item {
    display: flex;
}
.module-link-grid__pill {
    flex: 1;
    min-width: 0;          
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px 8px;
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    text-decoration: none;
    color: #1e40af;
    font-size: 0.95rem;
    line-height: 1.3;
    text-align: center;
    transition: all 0.15s ease;
    min-height: 44px;
}
.module-link-grid__pill:hover {
    background: #eff6ff;
    border-color: #2563eb;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(37, 99, 235, 0.1);
    text-decoration: none;
}
.module-link-grid__label {
    font-weight: 600;
    overflow-wrap: break-word;
    word-break: keep-all;   
}
.module-link-grid__meta {
    font-size: 0.85rem;
    color: #6b7280;
    margin-top: 2px;
}
@media (max-width: 640px) {
.module-link-grid {
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 110px), 1fr));
    }
.module-link-grid--narrow {
        grid-template-columns: repeat(auto-fill, minmax(min(100%, 84px), 1fr));
    }
}
.module-link-grid__info-box .module-link-grid { padding-left: 0; margin: 8px 0 0; }
.module-link-grid__info-box .module-link-grid__pill, .module-link-grid__info-box a.module-link-grid__pill {
    color: #1e40af;
    text-decoration: none;
}
.module-link-grid__info-box .module-link-grid__pill:hover, .module-link-grid__info-box a.module-link-grid__pill:hover {
    color: #1e40af;
    background: #eff6ff;
    border-color: #2563eb;
    text-decoration: none;
}
.module-link-grid__pill[href="#summary"] {
  flex: 0 0 auto;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  gap: 6px;                        
  margin: 14px 0 0;                
  padding: 0;
  min-height: 0;
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: #727E92;                  
  font-size: 13px;                 
  font-weight: 700;                
  text-align: left;
}
.module-link-grid__pill[href="#summary"]::before {
  content: "↑";
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  width: 19px;                     
  height: 19px;
  border-radius: 50%;
  background: #EEF1F6;             
  border: 1px solid #CFD6E2;       
  color: #727E92;                  
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  transition: transform .13s ease, background .13s ease, color .13s ease;
}
.module-link-grid__pill[href="#summary"] .module-link-grid__label { font-weight: 700 }
.module-link-grid__pill[href="#summary"]:hover, .module-link-grid__pill[href="#summary"]:focus-visible {
  background: none;
  border-color: transparent;
  box-shadow: none;
  transform: none;                 
  color: #3B2DBF;                  
}
.module-link-grid__pill[href="#summary"]:hover::before, .module-link-grid__pill[href="#summary"]:focus-visible::before {
  background: #5747E0;             
  border-color: #5747E0;
  color: #fff;
  transform: translateY(-2px);     
}
.module-link-grid:has(.module-link-grid__pill[href="#summary"]) {
  display: block;
  margin: 0;
}
.module-link-grid__pill[href^="/"] {
  position: relative;
  padding-left: 26px;
  padding-right: 26px;
}
.module-link-grid__pill[href^="/"]::after {
  content: "→";
  position: absolute;
  top: 6px;
  right: 6px;
  display: inline-grid;
  place-items: center;
  width: 19px;                     
  height: 19px;
  border-radius: 50%;
  background: #EEF1F6;             
  border: 1px solid #CFD6E2;       
  color: #727E92;                  
  font-size: 13px;                 
  font-weight: 800;
  line-height: 1;
  transition: transform .13s ease, background .13s ease, color .13s ease;
}
.module-link-grid__pill[href^="/"]:hover::after, .module-link-grid__pill[href^="/"]:focus-visible::after {
  background: #5747E0;             
  border-color: #5747E0;
  color: #fff;
  transform: translateX(2px);      
}
@media (prefers-reduced-motion: reduce) {
.module-link-grid__pill[href^="/"]::after { transition: none; }
}

/* ── 알약 글자 최소 16px (2026-09-08 사용자 지시) ──
 * 라이브 값은 0.95rem(≈15.2px)이라 지역명이 작게 보인다.
 */



/* hand-fix:link-grid:알약 글자 최소 16px */
/* ── 알약 글자 최소 16px (2026-09-08 사용자 지시) ──
 * 라이브 값은 0.95rem(≈15.2px)이라 지역명이 작게 보인다.
 */
.module-link-grid__pill { font-size: 1rem; }
.module-link-grid__label { font-size: 1rem; }

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-link-grid__card--thumb { flex-direction:row; align-items:flex-start; text-align:left; gap:11px; }
  .module-link-grid__card-thumb { flex:0 0 auto; display:block; width:46px; aspect-ratio:745/1040; border-radius:5px; overflow:hidden; background:var(--surf2); }
  .module-link-grid__card-thumb img { width:100%; height:100%; object-fit:cover; display:block; }
  .module-link-grid__card-body { flex:1 1 0; min-width:0; }
  .module-link-grid__card-sub { display: block; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; font-size: 0.85rem; color: #4b5563; margin-top: 4px; line-height: 1.4; }
  .module-link-grid--cards { grid-template-columns: repeat(auto-fill, minmax(min(100%, 180px), 1fr)); gap: 12px; }
  .module-link-grid--cta { grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); }
  .module-link-grid--cols-2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
  .module-link-grid--cols-3 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 185px), 1fr)); }
  .module-link-grid--cols-4 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 145px), 1fr)); }
  .module-link-grid__card-meta { color: #64748b; font-size: 14px; font-weight: 600; line-height: 1.45; margin-top: 3px; }
  .module-link-grid__info-box a.module-link-grid__card, .module-link-grid__info-box a.module-link-grid__card:hover { color: #1e293b; text-decoration: none; }
  .module-link-grid__info-box .module-link-grid__card-cta { color: #2563eb; }
  .module-link-grid__card { position: relative; flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 16px 12px; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; text-decoration: none; color: #1e293b; transition: border-color .2s, box-shadow .2s, transform .15s; }
  .module-link-grid__card:hover { border-color: #3b82f6; box-shadow: 0 2px 8px rgba(59,130,246,0.1); transform: translateY(-2px); text-decoration: none; }
  .module-link-grid__card-icon { font-size: 34px; margin-bottom: 8px; line-height: 1; }
  .module-link-grid__card-title { display: block; font-size: 1rem; font-weight: 700; color: #1e293b; line-height: 1.3; overflow-wrap: break-word; word-break: keep-all; }
  .module-link-grid__card-desc { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; overflow: hidden; font-size: 0.9rem; color: #4b5563; margin-top: 6px; line-height: 1.5; overflow-wrap: break-word; word-break: keep-all; }
  .module-link-grid__card-desc, .module-link-grid__card-meta { text-align: left; align-self: stretch; }
@media (max-width: 768px) {
  .module-link-grid__card { align-items: flex-start; text-align: left; }
}
  .module-link-grid__info-box .module-link-grid__card, .module-link-grid__info-box .module-link-grid__card:hover { text-decoration: none; }
  .module-link-grid__card--cta { align-items: stretch; text-align: left; background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%); border-color: #93c5fd; padding: 16px; }
  .module-link-grid__card--cta:hover { border-color: #2563eb; box-shadow: 0 4px 8px rgba(37,99,235,0.15); }
  .module-link-grid__card-cta { display: inline-block; margin-top: 8px; color: #2563eb; font-size: 0.85rem; font-weight: 600; }
  .module-link-grid--cards-green .module-link-grid__card { background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%); border-color: #86efac; }
  .module-link-grid--cards-amber .module-link-grid__card { background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%); border-color: #fcd34d; }
  .module-link-grid--cards-rose .module-link-grid__card { background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%); border-color: #fca5a5; }
  .module-link-grid--cards-purple .module-link-grid__card { background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%); border-color: #d8b4fe; }
  .module-link-grid--cards-gray .module-link-grid__card { background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%); border-color: #cbd5e1; }
  .module-link-grid__related-card-icon--img, .module-link-grid__card-icon--img { font-size: 0; }
  .module-link-grid--chips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
@media (max-width: 820px) {
  .module-link-grid--chips { grid-template-columns: repeat(2, 1fr); }
}
  .module-link-grid__chip { display: flex; align-items: center; justify-content: space-between; gap: 8px; background: rgba(255,255,255,0.96); border-radius: 10px; padding: 12px 14px; min-height: 52px; color: #1e293b; text-decoration: none; transition: transform .15s ease, box-shadow .2s ease; }
  .module-link-grid__chip:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0,0,0,0.25); color: #1e293b; }
  .module-link-grid__chip-name { font-size: 14px; font-weight: 700; }
  .module-link-grid__chip-val { font-size: 13px; font-weight: 700; text-align: right; line-height: 1.3; }
  .module-link-grid__chip-unit { font-size: 11px; font-weight: 400; color: #475569; margin-left: 2px; }
  .module-link-grid__chip-chg { display: block; font-size: 11px; font-weight: 700; }
  .module-link-grid--chips-card { grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 8px; }
@media (max-width: 820px) {
  .module-link-grid--chips-card { grid-template-columns: repeat(2, 1fr); }
}
  .module-link-grid--chips-card .module-link-grid__chip { justify-content: flex-start; border: 1px solid #e2e8f0; background: #f8fafc; min-height: 46px; padding: 9px 12px; }
  .module-link-grid--chips-card .module-link-grid__chip:hover { border-color: var(--color-primary, #2563eb); background: #fff; box-shadow: 0 6px 16px rgba(37, 99, 235, 0.12); }
  .module-link-grid__chip-ico { font-size: 21px; line-height: 1; flex: 0 0 auto; }
  .module-link-grid--chips-card .module-link-grid__chip-name { font-size: 14.5px; font-weight: 600; }
  .module-link-grid__chip-ico-img { width: 21px; height: 21px; flex: 0 0 auto; display: block; }
  .module-link-grid__card-icon--svg { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: rgba(87, 71, 224, .10); color: #3B2DBF; flex: 0 0 auto; }
  .module-link-grid__card-icon--svg svg { width: 21px; height: 21px; display: block; fill: none; stroke: currentColor; stroke-width: 2.1; stroke-linecap: round; stroke-linejoin: round; }
  .module-link-grid__card-icon--svg svg .module-link-grid__f, .module-link-grid__card-icon--svg svg rect { fill: currentColor; stroke: none; }
  .module-link-grid__card-value { font-size: 19px; font-weight: 800; letter-spacing: -.025em; line-height: 1.2; margin-top: 2px; }
  .module-link-grid__card-value--up { color: var(--lp-up, #16a34a); }
  .module-link-grid__card-value--down { color: var(--lp-down, #dc2626); }
  .module-link-grid__card-badge { display: inline-block; align-self: flex-start; margin-top: 6px; padding: 3px 10px; border-radius: 999px; font-size: 13px; font-weight: 700; line-height: 1.35; background: rgba(100, 116, 139, .15); color: #475569; }
  .module-link-grid__card-badge--paid { background: rgba(87, 71, 224, .14); color: #3B2DBF; }
  .module-link-grid__card-badge--never { background: rgba(220, 38, 38, .14); color: #b91c1c; }
@media (prefers-color-scheme: dark) {
  .module-link-grid__card-meta { color: #94a3b8; }
}
/* ── 동기화 블록 끝 (sync-live) ── */

/* 🔴 2026-09-23 라이브 규칙 이식 — info-box 안에 들어간 link-grid 의 모양(우리 CSS 0건).
   출처 = 시세 로컬 assets/css/modules.css «선언 그대로». info-box 쪽 목록에도 같은 세 줄이
   빠져 있었으나 «꾸며지는 요소»가 link-grid 라 여기 한 번만 둔다(중복 0). */
.module-info-box .module-link-grid { padding-left: 0; margin: 8px 0 0; }
.module-info-box .module-link-grid__pill,
.module-info-box a.module-link-grid__pill { color: #1e40af; text-decoration: none; }
.module-info-box .module-link-grid__pill:hover,
.module-info-box a.module-link-grid__pill:hover { color: #1e40af; background: #eff6ff; border-color: #2563eb; text-decoration: none; }


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
@media (max-width: 820px) {
  .module-link-grid--chips--card { grid-template-columns: repeat(2, 1fr); }   /* modules.css:10398 */
}
.module-link-grid + .module-info-box__title { margin-top: 1.75rem; }   /* modules.css:1130 */
.module-info-box a.module-link-grid__card { color: #1e293b; text-decoration: none; }   /* modules.css:1144 */
.module-info-box a.module-link-grid__card:hover { color: #1e293b; text-decoration: none; }   /* modules.css:1144 */
.module-info-box .module-link-grid__card-cta { color: #2563eb; }   /* modules.css:1149 */
.module-info-box .module-link-grid__card { text-decoration: none; }   /* modules.css:1189 */
.module-info-box .module-link-grid__card:hover { text-decoration: none; }   /* modules.css:1189 */
.module-link-grid__card-icon--img .core-issuer-ico { width: 34px; height: 34px; }   /* modules.css:9874 */
.module-link-grid--chips--card { grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 8px; }   /* modules.css:10390 */
.module-link-grid--chips--card .module-link-grid__chip { justify-content: flex-start; border: 1px solid #e2e8f0; background: #f8fafc; min-height: 46px; padding: 9px 12px; }   /* modules.css:10397 */
.module-link-grid--chips--card .module-link-grid__chip:hover { border-color: var(--color-primary, #2563eb); background: #fff; box-shadow: 0 6px 16px rgba(37, 99, 235, 0.12); }   /* modules.css:10405 */
.module-link-grid--chips--card .module-link-grid__chip-name { font-size: 14.5px; font-weight: 600; }   /* modules.css:10415 */


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
@media (max-width: 640px) {
  .module-link-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 110px), 1fr)); }   /* modules.css:1120 */
  .module-link-grid--narrow { grid-template-columns: repeat(auto-fill, minmax(min(100%, 84px), 1fr)); }   /* modules.css:1123 */
}
@media (max-width: 820px) {
  .module-link-grid--chips { grid-template-columns: repeat(2, 1fr); }   /* modules.css:10350 */
  .module-link-grid--chips--card { grid-template-columns: repeat(2, 1fr); }   /* modules.css:10398 */
}
.module-link-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 140px), 1fr)); gap: 8px; list-style: none; margin: 8px 0 0; padding: 0; }   /* modules.css:1057 */
.module-link-grid--narrow { grid-template-columns: repeat(auto-fill, minmax(min(100%, 100px), 1fr)); }   /* modules.css:1070 */
.module-link-grid__item { display: flex; }   /* modules.css:1074 */
.module-link-grid__pill { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 10px 8px; background: #fff; border: 1px solid #d1d5db; border-radius: 6px; text-decoration: none; color: #1e40af; font-size: 0.95rem; line-height: 1.3; text-align: center; transition: all 0.15s ease; min-height: 44px; }   /* modules.css:1078 */
.module-link-grid__pill:hover { background: #eff6ff; border-color: #2563eb; transform: translateY(-1px); box-shadow: 0 2px 4px rgba(37, 99, 235, 0.1); text-decoration: none; }   /* modules.css:1098 */
.module-link-grid__label { font-weight: 600; overflow-wrap: break-word; word-break: keep-all; }   /* modules.css:1106 */
.module-link-grid__meta { font-size: 0.85rem; color: #6b7280; margin-top: 2px; }   /* modules.css:1112 */
.module-info-box .module-link-grid { padding-left: 0; margin: 8px 0 0; }   /* modules.css:1118 */
.module-link-grid + .module-info-box__title { margin-top: 1.75rem; }   /* modules.css:1130 */
.module-info-box .module-link-grid__pill { color: #1e40af; text-decoration: none; }   /* modules.css:1132 */
.module-info-box a.module-link-grid__pill { color: #1e40af; text-decoration: none; }   /* modules.css:1132 */
.module-info-box .module-link-grid__pill:hover { color: #1e40af; background: #eff6ff; border-color: #2563eb; text-decoration: none; }   /* modules.css:1137 */
.module-info-box a.module-link-grid__pill:hover { color: #1e40af; background: #eff6ff; border-color: #2563eb; text-decoration: none; }   /* modules.css:1137 */
.module-info-box a.module-link-grid__card { color: #1e293b; text-decoration: none; }   /* modules.css:1144 */
.module-info-box a.module-link-grid__card:hover { color: #1e293b; text-decoration: none; }   /* modules.css:1144 */
.module-info-box .module-link-grid__card-cta { color: #2563eb; }   /* modules.css:1149 */
.module-link-grid--cards { grid-template-columns: repeat(auto-fill, minmax(min(100%, 180px), 1fr)); gap: 12px; }   /* modules.css:1150 */
.module-link-grid--cta { grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); }   /* modules.css:1156 */
.module-link-grid--cols-2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }   /* modules.css:1160 */
.module-link-grid--cols-3 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 185px), 1fr)); }   /* modules.css:1162 */
.module-link-grid--cols-4 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 145px), 1fr)); }   /* modules.css:1163 */
.module-link-grid__card { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 16px 12px; background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; text-decoration: none; color: #1e293b; transition: border-color .2s, box-shadow .2s, transform .15s; }   /* modules.css:1164 */
.module-link-grid__card:hover { border-color: #3b82f6; box-shadow: 0 2px 8px rgba(59,130,246,0.1); transform: translateY(-2px); text-decoration: none; }   /* modules.css:1180 */
.module-link-grid__card-icon { font-size: 34px; margin-bottom: 8px; line-height: 1; }   /* modules.css:1186 */
.module-link-grid__card-title { display: block; font-size: 1rem; font-weight: 700; color: #1e293b; line-height: 1.3; overflow-wrap: break-word; word-break: keep-all; }   /* modules.css:1187 */
.module-link-grid__card-desc { display: block; font-size: 0.9rem; color: #4b5563; margin-top: 6px; line-height: 1.5; overflow-wrap: break-word; word-break: keep-all; }   /* modules.css:1188 */
.module-info-box .module-link-grid__card { text-decoration: none; }   /* modules.css:1189 */
.module-info-box .module-link-grid__card:hover { text-decoration: none; }   /* modules.css:1189 */
.module-link-grid__card--cta { align-items: stretch; text-align: left; background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%); border-color: #93c5fd; padding: 16px; }   /* modules.css:1191 */
.module-link-grid__card--cta:hover { border-color: #2563eb; box-shadow: 0 4px 8px rgba(37,99,235,0.15); }   /* modules.css:1199 */
.module-link-grid__card-sub { display: block; font-size: 0.85rem; color: #4b5563; margin-top: 4px; line-height: 1.4; }   /* modules.css:1200 */
.module-link-grid__card-cta { display: inline-block; margin-top: 8px; color: #2563eb; font-size: 0.85rem; font-weight: 600; }   /* modules.css:1201 */
.module-link-grid--cards-green .module-link-grid__card { background: linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%); border-color: #86efac; }   /* modules.css:1202 */
.module-link-grid--cards-amber .module-link-grid__card { background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%); border-color: #fcd34d; }   /* modules.css:1205 */
.module-link-grid--cards-rose .module-link-grid__card { background: linear-gradient(135deg, #fef2f2 0%, #fee2e2 100%); border-color: #fca5a5; }   /* modules.css:1206 */
.module-link-grid--cards-purple .module-link-grid__card { background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%); border-color: #d8b4fe; }   /* modules.css:1207 */
.module-link-grid--cards-gray .module-link-grid__card { background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%); border-color: #cbd5e1; }   /* modules.css:1208 */
.module-link-grid__card-icon--img { font-size: 0; }   /* modules.css:9871 */
.module-link-grid__card-icon--img .core-issuer-ico { width: 34px; height: 34px; }   /* modules.css:9874 */
.module-link-grid--chips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }   /* modules.css:10341 */
.module-link-grid__chip { display: flex; align-items: center; justify-content: space-between; gap: 8px; background: rgba(255,255,255,0.96); border-radius: 10px; padding: 12px 14px; min-height: 52px; color: #1e293b; text-decoration: none; transition: transform .15s ease, box-shadow .2s ease; }   /* modules.css:10349 */
.module-link-grid__chip:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0,0,0,0.25); color: #1e293b; }   /* modules.css:10364 */
.module-link-grid__chip-name { font-size: 14px; font-weight: 700; }   /* modules.css:10369 */
.module-link-grid__chip-val { font-size: 13px; font-weight: 700; text-align: right; line-height: 1.3; }   /* modules.css:10373 */
.module-link-grid__chip-unit { font-size: 13px; font-weight: 400; color: #475569; margin-left: 2px; }   /* modules.css:10379 · HBS 09-28 · 11px → 13px */
.module-link-grid__chip-chg { display: block; font-size: 13px; font-weight: 700; }   /* modules.css:10385 · HBS 09-28 · 11px → 13px */
.module-link-grid--chips--card { grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 8px; }   /* modules.css:10390 */
.module-link-grid--chips--card .module-link-grid__chip { justify-content: flex-start; border: 1px solid #e2e8f0; background: #f8fafc; min-height: 46px; padding: 9px 12px; }   /* modules.css:10397 */
.module-link-grid--chips--card .module-link-grid__chip:hover { border-color: var(--color-primary, #2563eb); background: #fff; box-shadow: 0 6px 16px rgba(37, 99, 235, 0.12); }   /* modules.css:10405 */
.module-link-grid__chip-ico { font-size: 21px; line-height: 1; flex: 0 0 auto; }   /* modules.css:10410 */
.module-link-grid--chips--card .module-link-grid__chip-name { font-size: 14.5px; font-weight: 600; }   /* modules.css:10415 */
.module-link-grid__chip-ico-img { width: 21px; height: 21px; flex: 0 0 auto; display: block; }   /* modules.css:10419 */

/* 🔴 2026-09-27 지휘자(사용자 「4열 배열 vs 현재 6열 배열」·유류세 카드 「4열로 해」 A72 · 모듈 CSS 수정 = 사용자 지시) —
   넓은 화면에서 알약·카드 격자를 고정 4열로(자동 채움 최소 140px 이면 본문 폭에서 5~6열이 됐다 · 라이브도 같은 자동 채움).
   짧은 지역명 알약(--narrow)·행동 버튼(--cta)은 제외 · 좁은 화면(≤640px)은 기존 규칙 그대로. 되돌리기 = .bak_20260927-지휘자-4열 */
@media (min-width: 641px) {
  .module-link-grid:not(.module-link-grid--narrow):not(.module-link-grid--cta) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* 2026-10-09 FIX8 사용자 «아이콘과 글자가 동일하게 연속되면 왼쪽 정렬 · 아이콘이 별도로 상단에 있거나 없으면 글자 가운데 정렬» — 조립기가 라벨이 이모지로 시작하는 알약에만 --inline-icon 을 단다(기본 = 가운데) */
.module-link-grid__pill--inline-icon { align-items: flex-start; text-align: left; }

/* 2026-10-09 FIX8 사용자 «너 판단대로 해»(지휘자 판단) — 알약 글자 중 가장 긴 것이 16자를 넘는 격자(조립기가 --long 부여)는 휴대폰(≤480px)에서만 1열 · 넓은 화면 열 수·짧은 글자 격자(2열)는 그대로 */
@media (max-width: 480px) {
  .module-link-grid.module-link-grid--long { grid-template-columns: 1fr; }
}

/* 2026-10-10 FIX16 사용자 «지휘자 판단 하에 진행해» — 긴 제목 격자(--long · 조립기 자동)는 넓은 화면(≥900px) 3열 · 481~899px 2열 · ≤480px 1열(위 규칙). 짧은 글자 격자는 그대로 */
@media (min-width: 900px) {
  .module-link-grid.module-link-grid--long:not(.module-link-grid--narrow):not(.module-link-grid--cta) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 481px) and (max-width: 899px) {
  .module-link-grid.module-link-grid--long:not(.module-link-grid--narrow):not(.module-link-grid--cta) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* core/modules/display/faq/style.css */

@media (prefers-reduced-motion: reduce) {
}

.module-faq, .module-faq__related-grid, .module-faq__hub-nav {
    content-visibility: auto;
    contain-intrinsic-size: 0 600px;
}
.module-faq__entry-content .module-faq__step-card ul, .module-faq__entry-content .module-faq__step-card ol, .module-faq__entry-content .module-faq__highlight ul, .module-faq__entry-content .module-faq__highlight ol, .module-faq__entry-content .module-faq ul, .module-faq__entry-content .module-faq ol {
    padding-left: 1.5em !important;
    margin-left: 0 !important;
    margin-bottom: 0 !important;
}
details.module-faq__item {
    list-style: none;
}
/* HAR조 2026-09-27 테두리 한 겹 — 질문 칸 안 링크 단추 = 바탕색만(질문 칸 테두리가 한 겹) · 단추 선 원천 = table 모듈 .module-table__link */
.module-faq__item.module-faq__item a.module-table__link { border-color: transparent; }
details.module-faq__item::-webkit-details-marker, details.module-faq__item::marker {
    display: none;
}
details.module-faq__item > summary.module-faq__question {
    cursor: pointer;
    font-size: 1.0625rem;
    font-weight: 600;
    color: #2d3748;
    padding-right: 28px;
    position: relative;
    list-style: none;
    min-height: 44px;
    padding: 10px 28px 10px 0;
}
details.module-faq__item > summary.module-faq__question:focus-visible {
    outline: 2px solid var(--color-primary, #1a73e8);
    outline-offset: 2px;
}
details.module-faq__item > summary.module-faq__question::-webkit-details-marker {
    display: none;
}
details.module-faq__item > summary.module-faq__question::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234a5568'%3E%3Cpath d='M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z'/%3E%3C/svg%3E") center/contain no-repeat;
    transition: transform 0.25s ease;
}
details.module-faq__item[open] {
    border-left-color: #4285F4;
    background-color: #EFF6FF;
}
details.module-faq__item[open] > summary.module-faq__question::after {
    transform: translateY(-50%) rotate(180deg);
}
details.module-faq__item .module-faq__answer {
    font-size: 1rem;
    color: #4a5568;
    line-height: 1.7;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px dashed #cbd5e0;
}
@media (prefers-reduced-motion: reduce) {
details.module-faq__item > summary.module-faq__question::after {
        transition: none !important;
    }
}
.module-faq { contain-intrinsic-size: auto 0px auto 950px; }
/* 🔴 2026-09-15 사용자 지정값(재확정) — 코더 판단(상단 0, sources 와 같은 축)은 폐기하고
   사용자가 직접 준 수치로 정정한다: 상단 1.5rem · 하단 1.5rem.
   🔴 `sources`(상단 0)와 다른 이유 = 사용자가 이 자리에 «약간의 상단 여백»을 원함(h2 하단과
   완전히 붙지 않게 — 0 으로 완전히 붙이는 것과 «약간 띄우는» 것은 다른 의도다). 같은 축(절
   제목 뒤 첫 모듈)이라도 값이 갈릴 수 있으니 다음 조는 임의로 sources 에 맞추지 마라. */
.module-faq {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}
.module-faq__briefing > *:last-child, .module-faq__briefing-body > *:last-child, .module-faq__info-box > *:last-child, .module-faq__a > *:last-child, .module-faq__key-facts-core-text > *:last-child, .module-faq__quick-answer-content > *:last-child, .module-faq__answer-first > *:last-child, .module-faq__answer-first-answer > *:last-child, .module-faq__highlight > *:last-child, .module-faq__page-header > *:last-child {
    margin-bottom: 0;
}
.module-faq__list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  counter-reset: faq-counter;
}
.module-faq__item {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: var(--color-radius-sm);
  padding: 18px 18px 16px;
  transition: border-color .2s, box-shadow .2s;
  counter-increment: faq-counter;
}
.module-faq__item:hover {
  border-color: var(--color-primary);
  box-shadow: 0 4px 12px rgba(0,0,0,0.06);
  background: #eff6ff;
}
.module-faq__q {
  font-size: 20px;
  font-weight: 700;
  color: var(--color-primary-dark);
  margin: 0 0 10px;
  line-height: 1.5;
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
.module-faq__q::before {
  content: counter(faq-counter);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  min-width: 28px;
  border-radius: 50%;
  background: var(--color-primary);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
  flex-shrink: 0;
  margin-top: 1px;
}
.module-faq__a {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.7;
  color: var(--color-text-body);
  padding-left: 38px;
}
.module-faq__a p {
  margin: 0;
  font-weight: 400;
}
.module-faq__a strong {
  color: var(--color-primary-dark);
  font-weight: 700;
  background: var(--color-primary-light);
  padding: 1px 6px;
  border-radius: 4px;
}

/* ── 라이브 결손 규칙 동기화 (sync-live) ── */
/* 라이브 원문 순서 · 우리에 없던 선택자만 */
  .module-faq__items { background: #ffffff; padding: 0; margin-top: 20px; border-radius: 8px; list-style: none; margin-left: 0; padding-left: 0; text-align: left; }

/* ── 동기화 블록 끝 (sync-live) ── */


/* ── 짝 맞추기 — 마크업이 찍는데 규칙이 없던 이름 (2026-09-10 창D) ────────── */
/* 🔴 짝 맞추기(2026-09-10 창D) — 공용 module-section__title 계보 — pdf-embed 선례대로 창작하지 않는다.
   마크업이 이 이름을 찍는데 규칙이 없어 «자리»만 만든다. 생김새는 «창작하지 않는다»
   (선례 = display/pdf-embed/style.css .module-pdf-embed__title). */
/* 🔴 값 복원(2026-09-10 창D) — 창작이 아니라 복원이다.
   개명 «전»에 이 요소가 화면에서 받던 값 · 출처 = core/modules/_harvest/base.css:8317-8344 (.module-section__title 및 820/600px 변형) 선언 그대로 */
.module-faq__section-title {
  font-size: 24px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -.02em;
  margin: 70px 0 15px 0;
  padding-left: 15px;
  border-left: 4px solid var(--acc);
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line2);
  color: var(--ink);
  text-transform: none;
  text-wrap: balance;
}
@media (max-width:820px) {
  .module-faq__section-title { font-size: 21px; margin: 50px 0 13px 0; padding-left: 12px; border-left-width: 3px; }
}
@media (max-width:600px) {
  .module-faq__section-title { font-size: 19px; margin: 40px 0 12px 0; }
}


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
.entry-content .module-faq ul { padding-left: 1.5em !important; margin-left: 0 !important; margin-bottom: 0 !important; }   /* components.css:744 */
.entry-content .module-faq ol { padding-left: 1.5em !important; margin-left: 0 !important; margin-bottom: 0 !important; }   /* components.css:744 */
.module-content .module-faq-item { border: 1px solid #e5e7eb; border-radius: 8px; margin-bottom: 8px; overflow: hidden; }   /* modules.css:6983 */
.module-content .module-faq-item summary { background: #f8fafc; padding: 14px 18px; font-weight: 600; font-size: 16px; color: #1e293b; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }   /* modules.css:6986 */
.module-content .module-faq-q { background: #f8fafc; padding: 14px 18px; font-weight: 600; font-size: 16px; color: #1e293b; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }   /* modules.css:6986 */
.module-content .module-faq-item summary::after { content: '+'; font-size: 20px; color: #9ca3af; }   /* modules.css:6988 */
.module-content .module-faq-item[open] summary::after { content: '\2212'; }   /* modules.css:6989 */
.module-content .module-faq-item[open] summary { background: #eff6ff; border-bottom: 1px solid #e5e7eb; }   /* modules.css:6990 */
.module-content .module-faq-a { padding: 14px 18px; margin: 0; font-size: 16px; line-height: 1.8; color: #374151; }   /* modules.css:6991 */
.module-content .module-faq-item p { padding: 14px 18px; margin: 0; font-size: 16px; line-height: 1.8; color: #374151; }   /* modules.css:6991 */
.module-faq-list { margin: 16px 0; }   /* modules.css:7689 */
.module-faq-item__question { background: #f8fafc; padding: 14px 18px; font-weight: 600; font-size: 16px; color: #1e293b; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }   /* modules.css:7694 */
.module-faq-item__answer { padding: 14px 18px; margin: 0; font-size: 16px; line-height: 1.8; color: #374151; }   /* modules.css:7706 */


/* ══ 라이브 CSS 자동 이식(pull-live-module-css · 2026-09-22 · 트리=sise) ══
   우리에 «선택자 자체가 없던» 규칙만 떠 왔다. 값이 다른 것은 손대지 않는다(apply-live-css 소관).
   각 줄 끝 [파일:줄] 이 라이브 원본 자리다. @media 조건은 «감싼 채로» 옮긴다. */
@media (prefers-reduced-motion: reduce) {
  details.module-faq__item > summary.module-faq__question::after { transition: none !important; }   /* components.css:1041 */
}
.module-faq { content-visibility: auto; contain-intrinsic-size: 0 600px; }   /* components.css:500 */
.entry-content .module-faq ul { padding-left: 1.5em !important; margin-left: 0 !important; margin-bottom: 0 !important; }   /* components.css:744 */
.entry-content .module-faq ol { padding-left: 1.5em !important; margin-left: 0 !important; margin-bottom: 0 !important; }   /* components.css:744 */
details.module-faq__item { list-style: none; }   /* components.css:952 */
details.module-faq__item::-webkit-details-marker { display: none; }   /* components.css:963 */
details.module-faq__item::marker { display: none; }   /* components.css:963 */
details.module-faq__item > summary.module-faq__question { cursor: pointer; font-size: 1.0625rem; font-weight: 600; color: #2d3748; padding-right: 28px; position: relative; list-style: none; min-height: 44px; padding: 10px 28px 10px 0; }   /* components.css:968 */
details.module-faq__item > summary.module-faq__question:focus-visible { outline: 2px solid var(--color-primary, #1a73e8); outline-offset: 2px; }   /* components.css:980 */
details.module-faq__item > summary.module-faq__question::-webkit-details-marker { display: none; }   /* components.css:985 */
details.module-faq__item > summary.module-faq__question::after { content: ''; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234a5568'%3E%3Cpath d='M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6-6-6 1.41-1.41z'/%3E%3C/svg%3E") center/contain no-repeat; transition: transform 0.25s ease; }   /* components.css:989 */
details.module-faq__item[open] { border-left-color: #4285F4; background-color: #EFF6FF; }   /* components.css:1001 */
details.module-faq__item[open] > summary.module-faq__question::after { transform: translateY(-50%) rotate(180deg); }   /* components.css:1006 */
details.module-faq__item .module-faq__answer { font-size: 1rem; color: #4a5568; line-height: 1.7; margin-top: 0.75rem; padding-top: 0.75rem; border-top: 1px dashed #cbd5e0; }   /* components.css:1010 */
.module-faq { margin: 2.5rem 0; }   /* modules.css:444 */
.module-faq__items { background: #ffffff; padding: 0; margin-top: 20px; border-radius: 8px; list-style: none; margin-left: 0; padding-left: 0; text-align: left; }   /* modules.css:451 */
.module-faq__a > *:last-child { margin-bottom: 0; }   /* modules.css:1477 */
.module-faq__list { display: flex; flex-direction: column; gap: 12px; counter-reset: faq-counter; }   /* modules.css:4098 */
.module-faq__item { background: #fff; border: 1px solid var(--color-border); border-radius: var(--color-radius-sm); padding: 18px 18px 16px; transition: border-color .2s, box-shadow .2s; counter-increment: faq-counter; }   /* modules.css:4107 */
.module-faq__item:hover { border-color: var(--color-primary); box-shadow: 0 4px 12px rgba(0,0,0,0.06); background: #eff6ff; }   /* modules.css:4115 */
.module-faq__q { font-size: 20px; font-weight: 700; color: var(--color-primary-dark); margin: 0 0 10px; line-height: 1.5; display: flex; align-items: flex-start; gap: 10px; }   /* modules.css:4120 */
.module-faq__q::before { content: counter(faq-counter); display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; min-width: 28px; border-radius: 50%; background: var(--color-primary); color: #fff; font-size: 13px; font-weight: 800; line-height: 1; flex-shrink: 0; margin-top: 1px; }   /* modules.css:4130 */
.module-faq__a { font-size: 16px; font-weight: 400; line-height: 1.7; color: var(--color-text-body); padding-left: 38px; }   /* modules.css:4147 */
.module-faq__a p { margin: 0; font-weight: 400; }   /* modules.css:4154 */
.module-faq__a strong { color: var(--color-primary-dark); font-weight: 700; background: var(--color-primary-light); padding: 1px 6px; border-radius: 4px; }   /* modules.css:4158 */
.module-content .module-faq-item { border: 1px solid #e5e7eb; border-radius: 8px; margin-bottom: 8px; overflow: hidden; }   /* modules.css:6983 */
.module-content .module-faq-item summary { background: #f8fafc; padding: 14px 18px; font-weight: 600; font-size: 16px; color: #1e293b; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }   /* modules.css:6986 */
.module-content .module-faq-q { background: #f8fafc; padding: 14px 18px; font-weight: 600; font-size: 16px; color: #1e293b; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }   /* modules.css:6986 */
.module-content .module-faq-item summary::after { content: '+'; font-size: 20px; color: #9ca3af; }   /* modules.css:6988 */
.module-content .module-faq-item[open] summary::after { content: '\2212'; }   /* modules.css:6989 */
.module-content .module-faq-item[open] summary { background: #eff6ff; border-bottom: 1px solid #e5e7eb; }   /* modules.css:6990 */
.module-content .module-faq-a { padding: 14px 18px; margin: 0; font-size: 16px; line-height: 1.8; color: #374151; }   /* modules.css:6991 */
.module-content .module-faq-item p { padding: 14px 18px; margin: 0; font-size: 16px; line-height: 1.8; color: #374151; }   /* modules.css:6991 */
.module-faq-list { margin: 16px 0; }   /* modules.css:7689 */
.module-faq-item__question { background: #f8fafc; padding: 14px 18px; font-weight: 600; font-size: 16px; color: #1e293b; cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; }   /* modules.css:7694 */
.module-faq-item__answer { padding: 14px 18px; margin: 0; font-size: 16px; line-height: 1.8; color: #374151; }   /* modules.css:7706 */

/* sites/kimchimuseum/static-root/assets/css/km-site.css */
:root{--fill-accent:#D2232A}   /* 조 AG 11-04(조 AD 메모): 범용 page-hero·강조 토큰 = 사이트 빨강(라이브 rgb(210,35,42)) */
:root{--fill-nav:#D2232A;--fill-brand-strong:#A81B21}   /* 메뉴 줄 배경 = 라이브 rgb(210,35,42) · 마우스 올림 = 진한 빨강(사용자 11-04) */
/* km-site.css — 김치박물관 값만(범용 부품 변수 값 · 셸 한 줄 보정). 모양 규칙은 전부 범용 모듈·프리셋 쪽(조 AL2 11-04 · 사이트 전용 클래스 0) · 범용 레이아웃 너비 var(--site-w) 는 건드리지 않는다 */
:root{--table-line-color:#74BABA;--table-head-bg:#DBEEF3;--table-tint-0:#F2F9F9;--table-tint-1:#DBEEF3;--table-tint-2:#E9FFE9;--table-tint-3:#E9FFFF;--table-tint-4:#E9E9FF;--table-tint-5:#FFE9FF;--table-tint-6:#F1F7E4}   /* 본문 격자선 표·칸 색 값(범용 prose 변형 module-table--lined · __cell--tint-N 이 읽는 변수 · 라이브 테마 청록 색표) */
:root{--review-interest-track:#f0f0f0;--review-interest-fill:linear-gradient(90deg,#e53e3e,#c53030)}   /* 구매 관심도 막대 색 = 라이브 kimchimuseum.com 상품 카드 막대(트랙 rgb(240,240,240) · 채움 linear-gradient(90deg, rgb(229,62,62), rgb(197,48,48))) */
/* 푸터 «전체 분류» 열(15링크) = 그 열만 격자 2칸 폭 + 안쪽 3단(901px 이상 · 1280·1000 · 2단은 높이가 다른 열의 1.25배라 판정 ⑦ 1.2배 초과 → 3단) · 360 등 좁은 폭은 1단 그대로 — 범용 셸 세트 고침 0(조 AB 11-04 지휘자 결정) */
@media(min-width:901px){.site-footer-credit--v2 .site-footer-credit__col[aria-label="전체 분류"]{grid-column:span 2}.site-footer-credit--v2 .site-footer-credit__col[aria-label="전체 분류"] .site-footer-credit__col-list{column-count:3;column-gap:24px}.site-footer-credit--v2 .site-footer-credit__col[aria-label="전체 분류"] .site-footer-credit__col-list li{break-inside:avoid}}
.module-page-hero{--page-hero-radius:0;--page-hero-meter-label:#374151;--page-hero-meter-max:none}   /* 조 BL 11-05(P12 · 사용자 «page-hero 왼쪽 이미지 라운드 처리 없도록»): 그림 틀 모서리 직각 — 부품이 변수를 .module-page-hero 안에 정의하므로 같은 선택자로 뒤에서 덮음 */

/* V5(11-05 조 BO): 상품 쪽 마지막 구매 상자 — 휴대폰(767px 이하)은 아래 고정 구매 바가 대신하므로 숨김 */
@media (max-width: 767px) { #purchase { display: none; } }
/* V7(11-05 조 BO · 사용자 «고지 색상 약간 회색»): 쿠팡 파트너스 고지 글자 = 회색 #6b7280(흰 바탕 대비 4.8:1 · 더 연하게 하지 않음) · 굵기 일반 */
[data-notice="partners"] { color: #222; font-weight: 400; }   /* 11-08 사용자 «승인용 캡쳐에는 쿠팡 문구 글자색 완전 검정으로 해» → 정정 «완전 검정보다는 그냥 검정» = #222 · 쿠팡 심사 캡처 동안만 · 되돌릴 때 = #6b7280(쿠팡 심사 모드 스위치 끌 때 함께) */
@media (max-width: 640px) { [data-notice="partners"] { font-size: 0.875rem; line-height: 1.5; } }   /* 11-08 사용자 «모바일에서는 상단 쿠팡 문구 글자 사이즈 조금 줄여 1em으로 하든지. 너무 부강되면 안돼» → 휴대폰 = 14px */
/* V10(11-05 조 BO): 휴대폰에서 page-hero 구매 단추(최저가·혜택 바로 확인하기 →)가 두 줄로 접히지 않게 글자 크기만 화면 폭에 맞춤 */
@media (max-width: 767px) { .module-page-hero__action { font-size: clamp(14px, 5vw, 18px); white-space: nowrap; } }
/* V14(11-05 조 BO · 사용자 «링크가 제일 오른쪽 항상 고정 · 최저가 확인은 링크 앞»): 출처 행 안 순서만 바꿈(flex order) — 이름 왼쪽 · 최저가 확인 글 · 도메인 링크 오른쪽 끝 */
.module-sources__item .module-sources__pages { order: 2; }
.module-sources__item .module-sources__link { order: 3; margin-left: auto; }

/* 조 BQ(11-05 V13): 모바일 하이라이트 좌우 안쪽 여백 24px → 16px (상하 불변 · 범용 부품의 변수 --module-highlight-pad-x 값만 바꿈) */
@media (max-width: 767px) { .module-highlight { --module-highlight-pad-x: 16px; } }

/* 조 BQ(11-05 V28): 상품 카드 «구매 관심도: N%» 글자색 = 같은 카드 «전문 평가: N/5» 줄 글자색(검정) — 범용 부품 변수 값만 */
.module-product-card { --product-card-interest-text: #000; }   /* 사이트 값은 색 변수만(조 DB 11-06 · 크기·그림 폭·지표 간격은 범용 product-card 기본값) */

/* 조 BT B9(11-05 · 사용자 «지휘자가 판단해서 진행해»): 구매 바 높이 = 단추 48px + 위아래 여백 4px + 윗줄 1px = 57px(범용 cta 부품의 변수 값만 지정 · 변수 안 주는 사이트는 기존 10px/52px/76px) · 본문 아래 여백 = 막대 높이 */
:root{--sticky-bar-pad-y:4px;--sticky-bar-button-min:48px;--sticky-bar-body-gap:57px}

/* 조 CJ(11-06 · 사용자 «테이블이 이상한데» · 라이브 = 칸에 맞춤): 범용 table 부품의 «칸 줄바꿈 금지(white-space:nowrap !important)»가 본문 표를 칸의 7.75배(6,976px)로 늘림 — 본문 안 표 칸만 줄바꿈 허용(표는 width:100% 그대로 · 숫자 칸 u-tabular-number 의 nowrap 은 유지) */
.module-prose__body-block .module-table__scroll-wrap :is(th, td) { white-space: normal !important; }
/* 조 CJ(11-06 · 360 그림 넘침 · 라이브 = 칸에 맞춤): 본문 그림은 칸 폭을 넘지 않음(높이 자동 · 1280 에서 칸보다 좁은 그림은 그대로) */
.module-prose__body-block img { max-width: 100%; height: auto; }
/* 조 CJ(11-06): 12칸 이상 넓은 표(영양성분 17칸 등 · 라이브도 칸보다 넓어 가로 스크롤)만 라이브 머리 칸 안쪽 여백(8px 0)·칸 글자 13px·좌우 여백 2px 로 줄여 라이브 폭(칸의 1.38배) 안에 둠 — 칸 값이 인라인 style 이라 !important */
.module-prose__body-block table:has(tr > :nth-child(12)) th { padding: 8px 0 !important; }
.module-prose__body-block table:has(tr > :nth-child(12)) td { font-size: 13px !important; padding: 8px 2px !important; }
/* 조 CM(11-06 사용자 «헤드 오른쪽 텍스트 배너 글자·배너 크기 20% 더 크게 · 헤더 높이는 그대로»): 범용 셸 값(글자 20/22px · 여백 10/20px)의 1.2배 · 위아래 바깥 여백을 더 음수로 줘 헤더 높이는 그대로(값 = 아래 한 곳) */
.chrome .chrome-promo { margin-block: -12.6px; }
.chrome .chrome-promo__link { padding: 12px 24px; gap: 12px; }
.chrome .chrome-promo__lead { font-size: 24px; }
.chrome .chrome-promo__query { font-size: 26.4px; }
@media (max-width: 1100px) { .chrome .chrome-promo { margin-block: -8px; } .chrome .chrome-promo__link { padding: 9.6px 19.2px; } .chrome .chrome-promo__lead { font-size: 21.6px; } .chrome .chrome-promo__query { font-size: 24px; } }


/* 조 CT 수리(11-06): 아래 고정 구매 바 글자는 휴대폰 360·320 에서도 한 줄 — 폭에 비례해 줄이고(13~18px) 줄바꿈 0. 긴 모델명은 틀 값(_shop.mjs BUY_BAR_LABEL)에서 뺀다 */
@media (max-width: 767px) { .module-cta__sticky-bar > .module-cta.module-cta--xl { font-size: clamp(13px, 4.2vw, 18px); white-space: nowrap; } }

/* 샤인 전 사이트 0(사용자 11-06 «샤인은 빼»): 렌더 뒤 걷기는 worker.mjs render 한 곳 · 아래는 혹시 남은 샤인 클래스의 빛줄기·움직임을 끄는 안전망 */
.module-cta--shine::after { content: none; display: none; animation: none; }

/* 고르기 절 위치(조 CU 11-06): 사이트 머리는 쪽과 함께 올라가는 정적 머리인데 html 에 머리 높이만큼 scroll-padding-top 이 잡혀 있어 #pick·scrollIntoView 로 뛰면 절 위가 머리 높이(75·132px)만큼 비었다. 절의 scroll-margin 을 그만큼 음수로 상쇄해 절 맨 위가 화면 맨 위(0)에 닿는다(모듈 변수 --tournament-top-offset 로 전달 · 모듈 수정 0) */
.module-tournament { --tournament-top-offset: calc(var(--chrome-h, 96px) * -1); }

/* 고르기 시작 절 색(조 CU 11-06 · 사용자 «시작 선택 카드 배경색을 원안처럼»): 빠른 추천 = 옅은 파랑 바탕 + 파랑 테두리·제목 / 정밀 추천 = 옅은 주황 바탕 + 주황 테두리·진한 주황 제목.
   글자 대비(WCAG): 파랑 제목 #1d4ed8 on #eff6ff = 6.0:1 · 주황 제목 #9a3412 on #fff7ed = 7.3:1 (측정값은 작업 보고). VS 원 = 사이트 강조 진한 빨강 바탕 + 흰 글자(카드에 색이 들어가도 묻히지 않음) */
.module-tournament {
  --tournament-quick-bg: #eff6ff; --tournament-quick-line: #2563eb; --tournament-quick-ink: #1d4ed8;
  --tournament-full-bg: #ecfdf5; --tournament-full-line: #059669; --tournament-full-ink: #065f46;   /* 전체 비교 카드 = 초록 계열(빠른 파랑 · 정밀 주황과 구분) */
  --tournament-deep-bg: #fff7ed; --tournament-deep-line: #ea580c; --tournament-deep-ink: #9a3412;
  --tournament-vs-bg: #b42318; --tournament-vs-ink: #fff;
  --tournament-frame-border: 0 none; --tournament-frame-pad: 24px 12px; --tournament-mode-content-align: space-evenly; --tournament-result-pad: 8px 0 8px; --tournament-frame-overflow: visible;
  /* 시작 화면(조 DB 11-06 · 사용자 «정사각형 박스 · 글자 키워 · 라이브처럼 눈에 띄게»): 옅은 배경 판(테두리 없음) · 빠른·정밀 카드 = 정사각형 둘 나란히(모바일도) · 글자는 박스에 맞춰 크게 */
  --tournament-start-bg: #f1f5f9; --tournament-mode-columns: 1fr 1fr; --tournament-mode-ratio: 1; --tournament-mode-gap: 14px; --tournament-mode-pad: 4px;
  --tournament-mode-title-size: 22px; --tournament-mode-desc-size: 11px; --tournament-mode-count-size: 12px; --tournament-mode-count-lead-size: 20px;
  --tournament-result-rows-gap: 24px; --tournament-cheer-gap: 7px; --tournament-again-bg: #374151; --tournament-again-ink: #fff;   /* 결과 세로 간격 3곳 = 24px 한 변수(상자 가장자리↔타이머 · 타이머↔다시 하기 · 다시 하기↔공유 줄) · 머리 2·3줄 사이 7px · 다시 하기 = 진회색 바탕 + 흰 글자(대비 약 10:1) */
  --tournament-action-shine-duration: 1.8s;   /* 우승 결과 빨강 특가 단추 하나에만 빛줄기(사용자 11-06 예외 지시 · 그 밖 샤인 0 유지) */
  --tournament-glow-color: #FFC107; --tournament-card-line: #FFC107; --tournament-track-height: 20px; --tournament-action-radius: 25px; --tournament-rank-bg: #e8f5e9; --tournament-rank-ink: #2e7d32; --tournament-rank-mark: "✓"; --tournament-gap-price-action: 12px;   /* 원안 값: 금색 #FFC107 빛·테두리 · 진행 막대 20px · 시각 단추 알약 25px · 확신 줄 #e8f5e9/#2e7d32 */
  --tournament-metric-size: 14px; --tournament-cell-price-size: 20px; --tournament-facts-ink: #15803d; --tournament-round-size: 22px;   /* 판 카드 지표 글자 최소 14px · 가격 빨강 20px · 근거 줄 원안 초록 · 라운드 안내 크게 */
  --tournament-result-metric-size: 15px; --tournament-result-meter-height: 10px; --tournament-result-rank-size: 16px; --tournament-result-strength-size: 15px; --tournament-result-old-size: 15px; --tournament-badge-size: 15px;   /* 결과 카드 안 가장 작은 글자 15px */
  --tournament-result-note-size: 14px; --tournament-secondary-line: #1d4ed8; --tournament-secondary-ink: #1d4ed8; --tournament-secondary-width: 1.5px; --tournament-secondary-weight: 700;   /* 결과 화면 안내 글자 ≥ 14px · 보조 단추 = 파랑 1.5px 테두리 + 굵은 파랑 글자(흰 바탕 대비 약 6.7:1) */
  --tournament-mode-bounce: 1.02; --tournament-result-max: 440px; --tournament-cheer-title-size: 24px; --tournament-cheer-title-ink: #333; --tournament-card-pad: 14px 16px; --tournament-photo-max-height: clamp(100px, 14svh, 300px); --tournament-badge-bg: #c2410c; --tournament-info-width: 55%;
  /* 모바일 바깥 틀(조 DB 11-06 · 사용자 «좌우 테두리 없이 너비 모두 사용 · 상하 선만» · 안 ② 채택 — 360 정사각 카드 145~147px(안 ① 136~137) · 320 125~127px(안 ① 116~118) · 그림 폭 +18px): 상하 선만 */
  --tournament-box-border: 2px solid #2563eb; /* 지휘자 11-07 사용자 «토너먼트 박스 테두리를 회색이 아닌 더 구분이 되도록 … 킬러 콘텐츠» · «파랑이라든가» · «밖의 테두리선에 적용해야지» → 바깥선(회색 #d9dee5 → 파랑 2px · 빠른 비교 카드 선과 같은 색) */ --tournament-box-border-inline: 0 none; --tournament-box-pad: 16px 12px; --tournament-box-radius: 0; --tournament-box-bg: #f1f5f9; --tournament-start-bg: transparent; --tournament-frame-pad: 0; --tournament-split-bg: transparent; --tournament-split-pad: 0; --tournament-inner-x: 0px;   /* 상자 하나 = 회색 영역 자체 + 가장자리 선 + 안쪽 패딩 하나(11-06 «이중 틀 없앰» · 모바일 위아래 16 · 좌우 12 · 결과 화면만 바탕 없음) */   /* 결과 카드 폭 = 원안(400px 안팎)에 맞춰 가운데 열 · 판 카드 정보 칸 폭(모바일: ★★★★★ 전문 평가 4.9 가 한 줄로 담기는 폭) */   /* 시작·결과 화면 바깥 선·여백 없음(모바일 폭을 넓게 · 사용자 11-06) · 우승 카드 테두리·빛만 남김 */
  --tournament-action-bg: #b42318; --tournament-action-ink: #fff;
  --tournament-price-ink: #b42318; --tournament-price-size: 24px;   /* 결과 우승 카드 판매가 = 빨강 · 상품명(20px)보다 크게(11-06) */
  /* 결과 화면 글자 크기·색 = 원본 ai-tournament.css 값(우승 설명 18px·모바일 16px #7346F3 500 · 카드 제목 20px · 카운트다운 24px 굵게 #FF5722 · 타이머 상자 #fff8e1 + 1px 점선 #FFC107 · 반지름 8px) */
  --tournament-cheer-line-size: 16px; --tournament-cheer-line-ink: #7346F3; --tournament-cheer-line-weight: 500; --tournament-result-name-size: 20px;
  --tournament-timer-count-size: 24px; --tournament-timer-count-ink: var(--tournament-action-bg); --tournament-timer-strong-ink: var(--tournament-action-bg);   /* 시각 숫자·«24시간» = 결과 단추와 같은 빨강 변수 */ --tournament-timer-note-size: 16px; --tournament-timer-bg: #fff8e1; --tournament-timer-border: 1px dashed #FFC107; --tournament-timer-radius: 8px;
  --tournament-bar-fill: linear-gradient(90deg, #e53e3e, #c53030); --tournament-bar-track: #f0f0f0; --tournament-star-fill: #FF8A00; --tournament-star-empty: #d6d9de;   /* 구매 관심도 막대 = 상품 카드와 같은 빨강(--product-card-bar-fill · -bar-track 값 그대로) */
}
@media (min-width: 769px) { .module-tournament { --tournament-cheer-line-size: 18px; } }
/* 넓은 화면: 모드 카드 정사각형 한 변 260px 가운데 · 글자 더 크게 */
@media (min-width: 700px) { .module-tournament { --tournament-share-width: 620px; --tournament-cheer-title-size: 30px; --tournament-photo-max-height: clamp(160px, 32svh, 300px); --tournament-mode-columns-wide: repeat(2, 260px); --tournament-mode-columns-wide-3: repeat(3, 250px); --tournament-mode-count-lead-size: 36px; --tournament-mode-justify: center; --tournament-mode-gap: 26px; --tournament-mode-pad: 18px; --tournament-mode-title-size: 28px; --tournament-mode-desc-size: 16px; --tournament-mode-count-size: 19px; } }
/* 데스크톱(1000px 이상): 토너먼트 전체를 테두리 상자 하나로 감쌈(원안) · 모바일은 폭 때문에 테두리·바깥 여백 없음 */
@media (min-width: 768px) { .module-tournament { --tournament-box-border: 2px solid #2563eb; --tournament-box-border-inline: 2px solid #2563eb; --tournament-box-radius: 14px; --tournament-box-pad: 32px; --tournament-card-media-height: clamp(120px, 28svh, 260px); --tournament-play-title-size: 22px; } }   /* 원본: 우승 설명 18px(769px 이상) · 모바일 16px */
/* VS 원 지름 시작 절·판 화면 같게 44px(모듈 기본 42·50px) — 모듈 CSS 가 뒤에 실려서 한 단계 구체적인 선택자로 */
.module-tournament .module-tournament__vs, .module-tournament .module-tournament__split .module-tournament__vs { width: 44px; height: 44px; margin: -22px 0 0 -22px; font-size: 16px; }
/* 정밀 추천 카드 둘째 줄 «중간에 결과 보기 가능» = 설명 글을 줄바꿈 그대로(\n) 두고 첫 줄만 보통 크기 · 둘째 줄은 작게 */
/* (정사각형 카드로 바뀌어 둘째 줄 축소 규칙 제거 — 줄바꿈 유지·글자 크기는 모듈 변수) */
/* 표 규칙(조 CU 11-06 · 사용자 «왼쪽 1열 고정하지 마 · 원안처럼 어느 정도 열 너비 고정»): ① 첫 열(행 머리·머리 첫 칸) 고정 끔 — 범용 table 의 --sticky-first 는 다른 사이트용으로 남기고 이 사이트에서만 끔
   ② 열 너비 고정(table-layout: fixed): 첫 열(상품명·비교 항목) 360 = 130px · 768 이상 = 200px / 네 열 이상 표의 나머지 열 = 100px · 768 이상 120px / 비교표 상품 열(머리에 링크) = 130px · 768 이상 150px — 이름이 길어도 줄바꿈하고 표 전체 폭은 이 합을 넘지 않는다(말줄임 0) */
.module-table.module-table--sticky-first th[scope=row], .module-table.module-table--sticky-first thead th:first-child { position: static; background: inherit; }
.module-table__scroll-wrap > table.module-table { table-layout: fixed !important; width: 100% !important; }   /* 범용 표 규칙이 width:auto !important 라 고정 레이아웃이 자동 레이아웃으로 돌아감 → 폭을 100%로(열 폭 합이 더 크면 표가 그만큼 늘고 감싸개가 좌우 스크롤) */
.module-table__scroll-wrap > table.module-table tr:first-child > :first-child { width: 130px; }
.module-table__scroll-wrap > table.module-table:has(tr > :nth-child(4)) tr:first-child > :not(:first-child) { width: 100px; }
.module-table__scroll-wrap > table.module-table:has(tr > :nth-child(4)) thead th:not(:first-child):has(a) { width: 160px; }   /* 비교표 상품 열: 구매 버튼 문구 «최저가·혜택 확인하기 →» 가 한 줄이 되는 폭(글자 크기가 아니라 열 폭으로 해결) */
.module-table__scroll-wrap > table.module-table th, .module-table__scroll-wrap > table.module-table td { overflow-wrap: anywhere; white-space: normal !important; text-overflow: clip; }
.module-table__scroll-wrap > table.module-table th a, .module-table__scroll-wrap > table.module-table td a:not(.module-cta) { white-space: normal !important; overflow-wrap: anywhere; }
@media (min-width: 768px) {
  .module-table__scroll-wrap > table.module-table tr:first-child > :first-child { width: 200px; }
  .module-table__scroll-wrap > table.module-table:has(tr > :nth-child(4)) tr:first-child > :not(:first-child) { width: 120px; }
  .module-table__scroll-wrap > table.module-table:has(tr > :nth-child(4)) thead th:not(:first-child):has(a) { width: 170px; }
}
/* 조 DU 11-07(사용자 «비교표 1열 너비를 줄여»): 1열 머리 칸이 낱말마다 줄바꿈(<br>)된 비교표(추천 모델 비교표)만 1열을 좁힌다 — 모델 목록 표 등 다른 표의 1열(200·130px)은 그대로 */
.module-table__scroll-wrap > table.module-table:has(thead th:first-child br) tr:first-child > :first-child { width: 96px; }
@media (min-width: 768px) {
  .module-table__scroll-wrap > table.module-table:has(thead th:first-child br) tr:first-child > :first-child { width: 120px; }
}

/* 칩 묶음(필터·정렬·좁혀 보기·형태 칩) 아래 여백(조 CU 11-06 · 사용자 «칩 아래 붙어서 나와»): 칩 묶음 맨 아래와 다음 내용(카드 목록 등) 사이 18px */
[data-filter-bar] { margin-bottom: 18px; }
.module-filter-chips:last-child { margin-bottom: 18px; }

.module-tournament .module-tournament__mode-desc { color: #4b5563; }   /* 모드 카드 설명 글자 대비 ≥ 4.5 (옅은 파랑 바탕 #eff6ff 위 #4b5563 = 약 7:1) */

/* 고르기 절(조 DB 11-06 · 사용자 «절 자체를 감싸지 않아야 단독으로 어디든 붙인다»): 절·H2·소개·#pick 앵커는 쪽 틀(kinds/_rank.mjs)이 쓰고 H2 는 다른 절과 같은 앱층 제목 클래스. 절 위 간격은 다른 절 H2 위 간격(70px · 820px 이하 50px)을 절에 주고 H2 위 여백은 0
   모바일 판 화면 = 절 전체(제목·소개·상자)가 한 화면 — 절을 화면 높이로 잡고 상자가 나머지를 채움(모듈은 바깥을 모름) */
#pick { margin-top: 70px; }
#pick > h2.module-app-layer__lens-entry-panel-title { margin-top: 0; }
@media (max-width: 820px) { #pick { margin-top: 50px; } }
@media (max-width: 767px) and (min-height: 800px) {   /* 한 화면 제약은 412x915 같은 큰 화면부터 — 360x640 은 스크롤 허용(지휘자 결정 11-06: 판 카드 비율 우선) */
  section#pick:has(> .module-tournament[data-stage="play"]) { display: flex; flex-direction: column; height: clamp(480px, 100svh, 760px); }
  section#pick > .module-tournament[data-stage="play"] { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; margin: 0; }
  section#pick > .module-tournament[data-stage="play"] > .module-tournament__stage { flex: 1 1 0; min-height: 0; height: auto; }
}

/* 모바일 상자 안쪽 여백(조 CU 11-06 · 사용자 «상하좌우 패딩값이 너무 커서 공간 낭비»): 즉답 상자 · 정보 상자 · 하이라이트 상자 = 767px 이하에서 상하좌우 12px(모듈 기본 16~28px). 모듈 수정 0 — 사이트 CSS 가 뒤에 실려 같은 선택자로 이김 */
@media (max-width: 767px) {
  .module-answer-first { padding: 12px; }
  .module-info-box { padding: 12px; }
  .module-highlight { padding: 12px; }
  /* 즉답 안 1위 구매 단추(조 CU 11-06 · «버튼이 너무 크게 줄바꿈»): 글자 12~14px(화면 폭 비례) · 한 줄 · 위 여백 8px · 높이 40px — 구매 바와 같은 규칙. 모델명이 길면 문구는 틀(BUY_BAR_LABEL)이 «1위 최저가·혜택 확인하기»로 줄임 */
  .module-answer-first .module-cta.module-cta--xl { font-size: clamp(12px, 3.8vw, 14px); white-space: nowrap; padding: 6px 4px; min-height: 40px; height: auto; line-height: 1.3; margin-top: 8px; }
}

/* 비교표 구매 칸 문구(조 DB 11-06 사용자 «그것도 잘리면 확인 →»): 768px 이상 «확인하기 →» · 767px 이하(열 폭 77px 로 줄바꿈되는 폭)는 «확인 →» · 글자 크기는 그대로 */
.module-table a.module-cta [data-buy-short] { display: none; }
@media (max-width: 767px) { .module-table a.module-cta [data-buy-long] { display: none; } .module-table a.module-cta [data-buy-short] { display: inline; } }

/* 고르기 판 화면이 한 화면에 들어오게(조 CU 11-06): ① 절 높이 = 화면 높이(480~760px) — 모듈 기본은 위쪽 높이(--tournament-top-offset)를 빼는데 이 사이트는 앵커 정렬용으로 그 값을 음수로 줘서 판이 머리 높이(75·132px)만큼 화면보다 컸다 → 높이를 직접 줌 ② 진행 중에는 아래 고정 구매 바를 숨겨 판을 가리지 않음 */
.module-tournament { --tournament-stage-height: clamp(480px, calc(100svh - 2px), 760px); }   /* 2px = 모바일 상하 선 */
body:has([data-tournament][data-stage="play"]) .module-cta__sticky-bar, body[data-pick-result-visible] .module-cta__sticky-bar { display: none; }   /* 결과 화면이 보이는 동안도 숨김(my-pick.js 가 body 표시를 켬 · 공유 단추 가림 방지) */
@media (max-width: 767px) { .module-tournament { --tournament-result-name-size: 18px; --tournament-result-rank-size: 15px; } }   /* 사용자 11-06 모바일 우승 상품명 약간 작게(20→18) · 확신 줄 한 단계 작게(16→15) */
.module-tournament { --tournament-reserve: 460px; } @media (min-width: 768px) { .module-tournament { --tournament-reserve: 540px; } }   /* 사용자 11-06 새로고침 때 상품 목록 깜빡임 수리 · 시작 화면 높이만큼 자리 예약 */

/* 11-07 사용자 «모바일 너비가 있어서 줄바꿈이 안 되도록» — 토너먼트 남은 시간 안내 둘째 줄을 좁은 폭에서도 한 줄로(값 = 320px 실측) */
@media (max-width: 480px) { .module-tournament .module-tournament__timer { font-size: clamp(13px, 3.9vw, 16px); white-space: pre-line; } }
@media (max-width: 345px) { .module-tournament .module-tournament__timer { padding-left: 2px; padding-right: 2px; } }

/* 지휘자 11-07 사용자 «이 섹션 상단 여백 조금 더 줄여» — 홈 첫 줄 값 타일 위 여백(배너 아래 21px + 본문 상자 40px + 목록 8px ≈ 69px)을 24px 줄인다 · 홈 첫 절만 · 공용 상자 여백 변경 0 */
#top-picks{margin-top:-24px}

/* 지휘자 11-07 사용자 «소형 김치냉장고 추천 비교 글자 크기 조금 더 키워. 최소 사이즈보다 더 크게» — 시작 화면 분류 알약 14px → 17px(범용 모듈 고정값 · 사이트 설정 · 판 카드 배지 알약은 그대로) */
.module-tournament__stage .module-tournament__head > .module-tournament__pill { font-size: 17px; padding: 5px 14px; }
/* 지휘자 11-07 사용자 «휴대폰 첫 줄 타일 삭제해» — 홈 첫 줄 값 타일(#top-picks)은 PC(768px 이상)만 · 휴대폰은 4장 1열 약 750px 이라 숨김 */
@media (max-width: 767px) { #top-picks { display: none; } }
/* 지휘자 11-07 사용자 «모바일 모드에서 4개 칩 없애니까 김치의 종류 절 h2 … 큰 여백이 남아 있어» — 타일이 숨는 휴대폰에서만 바로 뒤 첫 절 제목 위 여백 0(배너~제목 91px → 51px 실측 기준) · 전체 보기 링크도 같은 높이 */
@media (max-width: 767px) { #top-picks + .module-section h2.module-app-layer__lens-entry-panel-title { margin-top: 0; } #top-picks + .module-section .module-app-layer__lens-entry-panel-head > .module-app-layer__lens-entry-panel-more { margin-top: 2px; } }
/* 지휘자 11-07 사용자 «모바일 모드에서 상단 … 히어로 부분 cta 버튼이 여백이 너무 큰데?» — 홈 상단 배너 버튼(범용 module-cta--xl · 위아래 18px · 높이 70px)을 휴대폰에서만 줄임 */
@media (max-width: 767px) { [data-banner="home-top"] .module-cta--xl { padding: 11px 16px; min-height: 0; font-size: 18px; } }

/* 11-08 사용자 «테이블 셀 내용에 정보가 많은 경우에는 좌우로 스크롤을 적용하면 한 줄로 길게 늘어지니까 그렇게 하지 않아야 … 특히 모바일» — 범용 표 모듈(core/modules/display/table/style.css:615 «td nowrap !important»)이 긴 글 칸까지 한 줄로 묶어 좌우 스크롤이 생김 → 긴 글 칸(범용 클래스 wrap-column · note)만 줄바꿈 · 짧은 값 칸은 그대로 · 범용 모듈 보강 후보(승인 뒤 core 로 올리면 이 규칙 걷음) */
.module-table td.module-table__wrap-column, .module-table th.module-table__wrap-column,
.module-table__scroll-wrap td.module-table__wrap-column, .module-table__scroll-wrap th.module-table__wrap-column,
.module-table td.module-table__cell--note, .module-table__scroll-wrap td.module-table__cell--note { white-space: normal !important; word-break: keep-all; overflow-wrap: anywhere; }

/* 11-08 사용자 «사이드바 애드센스 위치 테두리 없애. 애드센스만 적용해» — 사이드바 광고 패널 = 테두리·배경·그림자·안쪽 여백·광고 상자 바깥 여백 0(애드센스 ins 만 남김) · 다른 사이드바 패널 모양은 그대로 */
.info-sidebar__panel.info-sidebar__panel--ad { border: 0; background: transparent; box-shadow: none; padding: 0; border-radius: 0; }
.info-sidebar__panel--ad .module-ad-slot { margin: 0; border: 0; background: transparent; }