















/* ── 0. 토큰 되돌림 — _tokens-v2.css 가 대비와 무관하게 바꾸는 값만 현행으로(세그 고른 칸 면 · r-10 · 바람/땅 속성 칩 글자).
   --r-10 되돌림은 D-03(#35) 이관 단계 몫이라 아직 둔다(라운드 10 → 12 는 룩 통일 10건 밖). 다크 --sel 신설값은 토큰 파일 것을 채택(#8, 결함 수정).
   바람/땅 속성 글자 되돌림은 라이트에만 건다(4차 실측 P1: :root 에 두면 _tokens-v2.css 의 다크 값 #F5B800·#05C917 까지 덮어
   다크 속성 칩이 2.1:1 로 떨어졌다). 다크는 토큰 파일 = viewer.css 현행값 그대로. ── */
:root{--seg-on:#FFFFFF;--r-10:10px}
:root:not([data-theme="dark"]){--el-wind-fg:#8F6B00;--el-earth-fg:#03830F}
[data-theme="dark"]{--seg-on:#34353D}

/* ── 0b. 딥링크 부팅 골격(4차 실측 P1) — site-v2.html 머리 스크립트가 html 에 data-boot-view(목적지 화면 id)를 찍고,
   _viewer-v2.js 의 첫 setTab 이 지운다. 그 사이(데이터 fetch 60~1500ms)에 도감 골격 대신 목적지 화면의 view-top(제목·빈 세그 트랙·부제·도구줄)만 그린다.
   [hidden]{display:none!important}(viewer.css) 를 넘어야 하므로 !important. 속성이 지워지면 이 규칙은 전부 죽는다. ── */
html[data-boot-view]:not([data-boot-view="catalog"]) #viewMainTop,
html[data-boot-view]:not([data-boot-view="catalog"]) #viewMain,
html[data-boot-view]:not([data-boot-view="catalog"]) .lower{display:none !important}
html[data-boot-view="viewTier"] #viewTier[hidden],html[data-boot-view="viewBp"] #viewBp[hidden],
html[data-boot-view="viewTips"] #viewTips[hidden],html[data-boot-view="viewUpdate"] #viewUpdate[hidden],html[data-boot-view="viewReport"] #viewReport[hidden],
html[data-boot-view="viewSearch"] #viewSearch[hidden],html[data-boot-view="viewYukseong"] #viewYukseong[hidden],html[data-boot-view="viewDogam"] #viewDogam[hidden],
html[data-boot-view="viewGacha"] #viewGacha[hidden],html[data-boot-view="viewShop"] #viewShop[hidden],
html[data-boot-view="viewDeck"] #viewDeck[hidden],html[data-boot-view="viewMaker"] #viewMaker[hidden]{display:block !important}   /* #76: ?tab=deck·?tab=maker 딥링크도 목적지 골격부터 */
/* 헤더 활성 칸도 첫 페인트부터 목적지 칸 — 마크업의 정적 .on(도감)은 파서가 뒤따르는 인라인 스크립트를 돌리기 전 한 프레임 그려질 수 있어 CSS 로 먼저 덮는다(룩은 viewer.css .hd-nav .on 그대로) */
html[data-boot-cell="gacha"] #hdNav .on,html[data-boot-cell="growth"] #hdNav .on,html[data-boot-cell="analysis"] #hdNav .on,html[data-boot-cell="board"] #hdNav .on,html[data-boot-cell=""] #hdNav .on{color:var(--sub);font-weight:600}   /* :not() 은 특이도를 올려 아래 목적지 규칙을 이기므로 칸을 나열한다 */
html[data-boot-cell="gacha"] #hdNav .on::after,html[data-boot-cell="growth"] #hdNav .on::after,html[data-boot-cell="analysis"] #hdNav .on::after,html[data-boot-cell="board"] #hdNav .on::after,html[data-boot-cell=""] #hdNav .on::after{display:none}
html[data-boot-cell="gacha"] #hdNav [data-tab="gacha"],html[data-boot-cell="growth"] #hdNav [data-tab="growth"],
html[data-boot-cell="analysis"] #hdNav [data-tab="analysis"],html[data-boot-cell="board"] #hdNav [data-tab="board"]{color:var(--blue7);font-weight:700}
html[data-boot-cell="gacha"] #hdNav [data-tab="gacha"]::after,html[data-boot-cell="growth"] #hdNav [data-tab="growth"]::after,
html[data-boot-cell="analysis"] #hdNav [data-tab="analysis"]::after,html[data-boot-cell="board"] #hdNav [data-tab="board"]::after{content:'';display:block;position:absolute;left:13px;right:13px;bottom:-1px;height:2px;background:var(--blue)}
@media (max-width:1080px){html[data-boot-cell] #hdNav [data-tab]::after{left:10px;right:10px}}
@media (max-width:860px){html[data-boot-cell] #hdNav [data-tab]::after{left:25%;right:25%}}

/* ── 1. 헤더 (IA_SPEC §1-1). 860↓ grid 는 라이브 viewer.css 의 네 칸("logo search theme btn" / "nav nav nav nav") 그대로 — 보정 버튼이 헤더에 남는다 ── */
a.hd-logo{color:inherit;text-decoration:none}
.hd-nav button,.hd-nav a{min-width:44px}                       /* 감사 (g): 누르는 것 44 이상 */
@media (max-width:860px){
  .hd-in{row-gap:0}                                  /* 감사 결론 6: 데스크톱 gap 16 이 row-gap 으로 새어 16px 유령 줄 */
  .hd-logo{height:var(--hd-logo-h)}                  /* 로고 줄 44 */
  .hd-nav{height:var(--hd-nav-h)}                    /* 탭 줄 48(위 보더 1 포함) → 44 + 48 + 아래 보더 1 = 93 */
  .hd-nav button,.hd-nav a{min-width:56px;padding:0 var(--sp-2)}   /* DECISIONS #9: 5칸 균등 56 = 280, 320 본체 280 에 정확히 */
}

/* ── 2. 화면 틀 — 상단 여백 24(861↑)/20(860↓) 하나로 ── */
.main-top{max-width:var(--page-w);margin:0 auto;padding:24px 32px 0}
.main{padding-top:0;align-items:start}               /* 감사 P0-1: 1440 이름 제목 611/315/621 → 한 값 */
@media (min-width:1561px){.main-top{max-width:1840px;padding:24px 48px 0}}
@media (max-width:860px){.main-top{padding:20px 20px 0}}

/* ── 3. 상단 골격 .view-top — 2026-09-13 사용자 최상위 기준 2(심플)·3(첫 화면에 핵심 정보) 반영판(S-01·D-01·S03-1·S-02·L-01 채택).
   행1 [제목 | 1차 세그](861↑) 은 전 화면 같은 자리·같은 높이. 부제·도구줄은 "있는 화면만" 높이를 낸다 — 빈 줄 예약(D-21·L-01 옛 조항) 폐기:
   부제가 비면(:empty) 0, 도구줄에 보이는 자식이 없으면 0. 같은 헤더 칸의 세그끼리는 줄 구성이 같다(검사 (a)(b) 가 칸 단위로 잰다).
   860↓ 도구줄은 넘치면 줄바꿈(가로 스크롤로 버튼을 숨기지 않는다, S-02): 거르개는 내용 폭(최대 100%), 앵커는 오른쪽 끝 — 한 줄에 못 서면 앵커가 둘째 줄로.
   값은 tokens.json components.view-top.slots(_tokens-v2.css --vt-*). 검색(세그 없음)은 860↓ 세그 줄도 없다. ── */
.view-top{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-rows:var(--vt-row-h) auto auto;                       /* 행1 48 / 부제(있으면 4 + 19.4) / 도구줄(있으면 16 + 48, 860↓ 줄바꿈 시 + 8 + 48) */
  grid-template-areas:"title seg" "sub sub" "tool tool";
  column-gap:var(--sp-2);align-items:center;                        /* 8 */
  margin-bottom:var(--vt-gap);                                      /* 첫 콘텐츠 +16 */
}
.view-h2{
  grid-area:title;min-width:0;min-height:var(--vt-row-h);overflow:hidden;
  display:flex;align-items:center;gap:var(--sp-2);white-space:nowrap;
  font-size:var(--fs-20);font-weight:800;line-height:var(--lh-tight);letter-spacing:-.01em;   /* 룩 통일 (7): 줄 높이 30 → 26, 글자는 48 안 세로 가운데 */
}
.view-h2 .beta{margin-left:0;font-size:12px}                       /* 간격은 gap 8 하나로. 배지 글자 12 하한 */
.view-top>.seg{grid-area:seg;justify-self:end;align-self:center;width:var(--seg-w,auto);max-width:100%}   /* 세그 48 = 행1 48. 861↑ 칸 수별 고정폭(런타임 --seg-w) */
.view-sub{
  grid-area:sub;align-self:end;height:var(--vt-sub-h);line-height:var(--vt-sub-h);margin:var(--sp-1) 0 0;
  font-size:var(--fs-14);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;   /* 본문 14 · 본문색(대비 4.5 예외 없음) */
}
.view-sub:empty{display:none}
.view-sub b{font-weight:700}
/* 도구줄(COMPONENT_SPEC §15): 861↑ grid 두 열 — 왼쪽 거르개 .toolbar-filters minmax(0,1fr)(넘치면 이 영역만 가로 스크롤 — 연구 25칸뿐) + 오른쪽 고정 앵커 .toolbar-end auto.
   앵커의 오른쪽 가장자리 = .toolbar 오른쪽 = 콘텐츠 폭 오른쪽 끝. 보이는 자식이 없는 도구줄은 display:none(줄 자체가 0) */
.toolbar{
  grid-area:tool;align-self:end;min-height:var(--vt-tool-h);margin-top:var(--vt-gap);min-width:0;
  display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;
}
.toolbar:not(:has(> .toolbar-filters > :not([hidden]), > .toolbar-end:not(:empty):not([hidden]))){display:none}
.view-top.keep-tool>.toolbar{display:grid !important}                /* D-01: 같은 헤더 칸 안에 도구줄이 있는 화면이 있으면 그 칸의 빈 화면도 줄을 지킨다(뽑기·육성·게시판) */
.toolbar-filters{
  min-width:0;min-height:var(--vt-tool-h);
  display:flex;align-items:center;gap:var(--sp-2);flex-wrap:nowrap;
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;
}
.toolbar-filters::-webkit-scrollbar{display:none}
/* 거르개가 넘칠 때의 단서(연구 25칸): _viewer-v2.js 가 scrollWidth > clientWidth 면 .is-more · scrollLeft > 0 면 .is-past 를 켠다 */
.toolbar-filters.is-more{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent)}
.toolbar-filters.is-past{-webkit-mask-image:linear-gradient(to right,transparent,#000 28px);mask-image:linear-gradient(to right,transparent,#000 28px)}
.toolbar-filters.is-more.is-past{-webkit-mask-image:linear-gradient(to right,transparent,#000 28px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,transparent,#000 28px,#000 calc(100% - 28px),transparent)}
.toolbar-filters>*{flex:0 0 auto}
.toolbar-filters>.input,.toolbar-filters>.dex-search{flex:0 1 auto;width:100%;max-width:var(--input-w-toolbar);margin:0}   /* 검색 입력: 거르개 첫째, 861↑ 236 상한(DECISIONS #7) */
.toolbar-end{
  min-height:var(--vt-tool-h);padding-left:var(--sp-2);
  display:flex;align-items:center;justify-content:flex-end;gap:var(--sp-2);white-space:nowrap;
}
.toolbar-end:empty,.toolbar-end[hidden]{display:none}
.toolbar-chips{display:flex;align-items:center;gap:var(--sp-2);flex-wrap:nowrap}   /* 거르개 안 칩 묶음(꿀팁 분류) */
.view-body>*:first-child{margin-top:0}                             /* 첫 콘텐츠 자체 여백 금지. 간격은 .view-top margin-bottom 만 */
@media (max-width:860px){
  .view-top{
    grid-template-columns:minmax(0,1fr);                             /* 한 열. 행1 은 제목만 */
    grid-template-rows:var(--vt-row-h) auto auto auto;               /* 행1 48 / 세그 줄(있으면 8 + 48) / 부제 / 도구줄 */
    grid-template-areas:"title" "seg" "sub" "tool";
  }
  .view-h2{align-self:start}                                        /* 행1 위쪽 48 안에 */
  .view-top>.seg{justify-self:stretch;width:100%;margin:calc(var(--vt-gap-sm) + (var(--vt-row-h) - var(--seg-h)) / 2) 0 calc((var(--vt-row-h) - var(--seg-h)) / 2)}   /* 세그 줄 48 안 가운데(트랙 44) */
  /* 860↓ 도구줄: 넘치면 줄바꿈(S-02·D-02). 거르개는 내용 폭(최대 100%, 그 안에서만 가로 스크롤 — 연구 25칸), 앵커는 오른쪽 끝(둘째 줄로 내려가도 오른쪽 끝) */
  .toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--vt-gap-sm)}
  .view-top.keep-tool>.toolbar{display:flex !important}
  .toolbar-filters{flex:1 0 auto;max-width:100%}
  .toolbar-end{flex:0 1 auto;max-width:100%;margin-left:auto;padding-left:0;flex-wrap:wrap;justify-content:flex-end;row-gap:var(--vt-gap-sm)}   /* 앵커가 폭을 넘으면 그 안에서 줄바꿈(덱 편성 메타 + 버튼 3) */
  .toolbar-filters:empty{display:none}                               /* 빈 거르개가 한 줄을 차지하지 않게(앵커만 있는 화면) */
  .toolbar-end>.num{flex:1 1 100%;text-align:right;min-height:0}     /* 메타(조련사 0/6 · 펫 0/18)는 제 줄, 버튼 줄은 그 아래 */
  .toolbar-end .ghost{padding:0 12px}                               /* 390 티어표: 세그 147 + [기준 보기][배치 초기화] 189 = 344 ≤ 350 */
  .toolbar-filters>.input,.toolbar-filters>.dex-search{max-width:none;flex:1 1 var(--input-w-min-mobile);min-width:var(--input-w-min-mobile)}   /* 입력은 남는 폭(혼자면 350). 개수·버튼과 같이 서면 200 아래로 줄지 않고 나머지가 둘째 줄로 */
}

/* ── 4. 세그 한 벌 (DECISIONS #2 (1)·#10 → 2026-09-13 사용자 최상위 기준 3: 누르는 것 44 예외 없음) — 1차 세그(5칸 전부)·도구줄 2겹(티어 카테고리·꾸미기·상점·티어메이커)·표 머리 작은 세그.
   규격: 트랙 48(--seg-h) · 안쪽 2(--seg-pad) · 칸 44 · gap 0 · r12 · --tint / 칸 r8 · 13px/700 · 안 고른 칸 --seg-off(4.5 이상) / on: pick 쌍 · sh-1. 옛 42/3(칸 36)·작은 세그 32(칸 26) 폐기(D-11·D-03).
   성급 세그(.grade-row .seg, 줄바꿈)·태생 등급(.av-tier)·평가 유보 행(.tu-seg)도 칸 44.
   1차 세그 861↑ 고정폭은 렌더러가 --seg-w 로 준다(도감·게시판 354 · 뽑기 400 · 육성 686 · 공략 472). 칸 수는 --cols(옛 c2~c5 도 받는다). ── */
.seg{
  display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));
  height:var(--seg-h);padding:var(--seg-pad);gap:0;border-radius:var(--r-12);background:var(--tint);
}
/* 폭은 자리별로만 정한다 — 1차 세그 .view-top>.seg(--seg-w / 860↓ 100%), 도구줄·표 머리 2겹은 내용 폭. 성급 세그(.grade-row .seg)는 viewer.css 860↓ width:100% 그대로(4차 실측 P1) */
.toolbar-filters>.seg,.tier-head .seg{width:auto}
.seg.c2{--cols:2}.seg.c3{--cols:3}.seg.c4{--cols:4}.seg.c5{--cols:5}
.seg>button,.seg>a{
  min-width:0;padding:0;border-radius:var(--r-8);font-size:var(--fs-13);font-weight:700;color:var(--seg-off);
  display:flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap;overflow:hidden;
  transition:none;   /* 현행 .jewel-seg button 은 전환 없음 */
}
.seg>button:hover,.seg>a:hover{color:var(--ink);background:none}   /* 룩 통일 (9) D-17: 링크 칸도 글자만 */
.seg>.on,.seg>.on:hover{background:var(--pick-bg);color:var(--pick-fg);box-shadow:var(--sh-1)}
/* 도구줄·표 머리 안 2겹 세그는 내용 폭: 칸 = 라벨 + 좌우 16, 최소 44(--touch-min). 1차 세그는 등분·패딩 0 */
.toolbar-filters>.seg,.tier-head .seg{grid-template-columns:repeat(var(--cols,3),minmax(var(--touch-min),auto))}
.toolbar-filters>.seg>button,.toolbar-filters>.seg>a{padding:0 var(--sp-4);min-width:var(--touch-min)}
/* 작은 세그(표 머리 콘텐츠·투력·과금): 트랙 44(--ctl-h-sm) · 안쪽 0 · 칸 44 · 12px/700 · 칸 = 라벨 + 16 최소 44 · 칸 r8 */
.seg.seg--sm{height:var(--ctl-h-sm);padding:0;grid-template-columns:repeat(var(--cols,3),minmax(var(--touch-min),auto))}
.seg.seg--sm>button,.seg.seg--sm>a{font-size:var(--fs-12);font-weight:700;border-radius:var(--r-8);padding:0 var(--sp-2);min-width:var(--touch-min)}
@media (max-width:860px){
  .toolbar-filters>.seg,.tier-head .seg{width:auto}                                                          /* viewer.css 860↓ .seg{width:100%} 를 2겹 자리에서만 되돌린다 */
  /* 5차 실측 P2-3(#89): 2겹 세그 폭은 앵커 폭에 따라 달라지지 않는다 — 같은 세그(펫·무기·탑승펫)가 티어표·티어메이커 두 화면에서 같은 rect 여야 하므로
     앵커(.toolbar-end)가 있는 도구줄의 2겹 세그는 내용 폭(칸 = 라벨 + 좌우 12, 최소 44 · 861↑ 의 16 보다 좁게 — 390 앵커 [i][내 배치 초기화 (1)] 옆 169.3 안에 서야 한다).
     앵커가 없는 도구줄(도감 획득처 · 꾸미기)의 혼자 선 2겹 세그만 100%(등분 · 패딩 0, 1차 세그와 같은 규칙) */
  .toolbar-filters>.seg>button,.toolbar-filters>.seg>a{padding:0 var(--sp-2)}   /* 390 티어표 세그 147 — 앵커 [기준 보기][배치 초기화] 와 한 줄(344 ≤ 350) */
  .toolbar:not(:has(> .toolbar-end))>.toolbar-filters>.seg:only-child{width:100%;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr))}
  .toolbar:not(:has(> .toolbar-end))>.toolbar-filters>.seg:only-child>button,.toolbar:not(:has(> .toolbar-end))>.toolbar-filters>.seg:only-child>a{padding:0;min-width:0}
}
/* 태생 등급 .av-tier · 평가 유보 .tu-seg: 트랙 48 · 안쪽 2 · 칸 44 · 12px/600 · gap 2, 성급 세그 줄바꿈 · 칸 44 · 14px/600 */
.seg.av-tier,.seg.tu-seg{display:flex;height:var(--seg-h);padding:var(--seg-pad);gap:2px}
.seg.av-tier>button,.seg.tu-seg>button{font-size:12px;font-weight:600;padding:0 11px;display:inline-flex;gap:5px;transition:color .15s;min-height:var(--touch-min)}
.seg.av-tier>button.on,.seg.tu-seg>button.on{font-weight:700}
.grade-row .seg{padding:var(--seg-pad);min-height:var(--seg-h)}
.grade-row .seg>button{font-size:14px;font-weight:600;transition:color .15s;height:var(--touch-min)}
.grade-row .seg>button.on{font-weight:700}
@media (max-width:860px){
  .seg.av-tier,.seg.tu-seg{display:grid;width:100%;height:auto;min-height:var(--seg-h)}
  .seg.av-tier>button,.seg.tu-seg>button{padding:0;font-size:13px}
  .grade-row .seg>button{padding:0 2px;font-size:13px}   /* 라이브 390 실측 padding 0 2px · 13px(4차 P1 대조) */
}
/* 감사 §1: 옛 .jewel-seg 마크업(라이브)에도 같은 색 */
.jewel-seg button,.jewel-seg .ana-link{color:var(--seg-off)}
.jewel-seg button.on{color:var(--pick-fg)}

/* ── 5. 버튼 — 고스트 44(--ctl-h), 아이콘 버튼 44, 오늘로 → 고스트, 헤더 보정 버튼도 44(누르는 것 44 예외 없음, 2026-09-13). 글자 13→14(본문 하한과 같은 크기) ── */
.ghost{height:var(--ctl-h);padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);line-height:1;white-space:nowrap;font-size:var(--fs-14);color:var(--ink)}
.ghost svg{width:16px;height:16px;flex:none}
.hd .ghost{height:var(--touch-min);padding:0 14px;display:inline-flex;line-height:1;font-size:var(--fs-14);background:var(--card);color:var(--ink);border-color:var(--line);font-weight:600}   /* 옛 37.5×103.4(1440) · 34×89.8(390) → 44. S-07: 파란 면은 고른 상태에만 — 보정 버튼은 고스트 */
.hd .ghost:hover{background:var(--soft);border-color:var(--line)}
@media (max-width:860px){.hd .ghost{padding:0 10px;font-size:var(--fs-13)}}
a.ghost{color:inherit;text-decoration:none}                          /* 감사 P1: 티어메이커 링크가 a 기본 파랑을 입던 것 */
.ghost.danger{color:var(--st-alert-fg);border-color:var(--st-alert-line)}   /* 파괴적(초기화·새로 시작)은 액션 슬롯 마지막 */
.ghost.danger:hover{background:var(--st-alert-bg)}
/* 기준 보기(S21-3): 860↓ 도 글자 라벨 그대로(아이콘만 있는 버튼은 숨은 기능). 아이콘은 쓰지 않는다 */
.btn--info>svg{display:none}
.tl-arrow{width:var(--ctl-h);height:var(--ctl-h);border-radius:var(--r-8);color:var(--sub-2)}   /* (4) 36 → 44, .btn--icon 정본 */
.tl-today{height:var(--ctl-h);padding:0 14px;font-size:var(--fs-14);font-weight:600;color:var(--ink);background:none;border:1px solid var(--line);border-radius:var(--r-8);display:inline-flex;align-items:center}   /* (5) .btn--ghost */
.tl-today:hover:not(:disabled){filter:none;background:var(--soft)}

/* ── 6. 도구줄·본문 부품 — 칩(꿀팁 분류·검색 첫 묶음; 티어 콘텐츠 기준은 5차 실측 뒤 표 머리 작은 세그)·검색 입력·고지·구획 머리(표 머리) ── */
.toolbar .chip{height:var(--ctl-h-sm);padding:0 var(--sp-3);font-size:var(--fs-13);font-weight:600;color:var(--ink);background:var(--card);cursor:pointer;transition:background var(--dur-1),color var(--dur-1)}
.toolbar .chip:hover{background:var(--soft)}
.toolbar .chip.on{background:var(--pick-bg);border-color:var(--pick-bg);color:var(--pick-fg);font-weight:700}
.toolbar .sch-chip{flex:0 0 auto}
.toolbar .num{font-size:var(--fs-13);color:var(--sub-2);white-space:nowrap}
.toolbar .num b{color:var(--ink);font-weight:800}                  /* 앵커 메타(편성 개수·보석 개수)의 숫자 */
.toolbar .sch-count{font-size:14px;font-weight:800;color:var(--ink)}
.toolbar .sch-reset{margin-left:0}
/* 조건 지우기(검색·상점, S41-2·S-10): 12px 밑줄 글자 버튼 → 고스트 44·14px·동사 라벨 */
.sch-reset{height:var(--ctl-h);padding:0 12px;border:1px solid var(--line);border-radius:var(--r-8);background:var(--card);color:var(--ink);font-size:var(--fs-14);font-weight:600;text-decoration:none;display:inline-flex;align-items:center;white-space:nowrap}
.sch-reset:hover{background:var(--soft)}
/* 고지 .notice (COMPONENT_SPEC §13): 위아래 선, 14/1.65, 한 줄 ≤ 48. summary(누르는 것)는 44. 첫 콘텐츠이지 예약 줄이 아니다 */
.notice{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:11px 0;margin:0;font-size:var(--fs-14);line-height:var(--lh-loose);color:var(--ink)}   /* p.notice 한 줄 = 14 × 1.65 + 11 × 2 + 2 = 47.1 */
.notice+.notice{border-top:0}
details.notice{padding:0}
details.notice[open]{padding-bottom:var(--sp-3)}
.notice>summary{cursor:pointer;font-weight:600;list-style:none;user-select:none;padding:0;min-height:var(--touch-min);display:flex;align-items:center}   /* 접힌 한 줄 = 44 + 2 = 46 */
.notice>summary::-webkit-details-marker{display:none}
.notice>summary::before{content:'▸ ';color:var(--sub-2)}
.notice[open]>summary::before{content:'▾ '}
.notice[open]>summary{margin-bottom:var(--sp-1)}
.notice p{margin:0}
.notice b{font-weight:700;color:var(--blue7)}
p.notice.tier-disc{color:var(--ink)}
/* 표 머리(티어표): 왼쪽 메타 #tierNote · 오른쪽 작은 세그(콘텐츠 → 투력 → 과금, #89). min-height 32 · margin 8 0. 표의 일부라 선 없음(DECISIONS #3) */
.section-head{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);min-height:var(--ctl-h);margin-bottom:var(--sp-4)}
.section-head .section-title{font-size:var(--fs-18);font-weight:700;line-height:var(--lh-tight);letter-spacing:-.01em;margin:0}   /* 구획 제목 한 종(옛 .tips-title 32/28 은 화면 제목 h2 가 맡는다) */
.section-tools{display:flex;align-items:center;gap:var(--sp-2);flex:0 0 auto;white-space:nowrap}
.section-meta{font-size:var(--fs-14);color:var(--ink)}
.tier-head{min-height:var(--ctl-h-sm);margin:var(--sp-2) 0}
.tier-head .tier-note{font-size:var(--fs-14);color:var(--ink)}
.tier-head .tier-note{margin-left:0;min-width:0;overflow:hidden;text-overflow:ellipsis}
.tier-head .section-tools{margin-left:auto}
.tier-head .tools-lb{font-weight:600}                                /* 작은 세그의 뜻 라벨(전투력·과금, 4차 P2-5). 세그가 hidden 이면 같이 숨는다 */
.tier-head .tools-lb:has(+ [hidden]){display:none}
@media (max-width:860px){
  /* 5차 실측 P1-2(#89): 표 머리에 콘텐츠 세그가 들어와 860↓ 는 두 줄 — 줄1 메타(2줄까지 clamp, 4차 P2-4) · 줄2 작은 세그들(콘텐츠 → 전투력 → 과금, 넘치면 줄바꿈).
     계산값 390 표 머리 = 18.2 + 8 + 32 = 58.2 → 첫 티어 행 442.1(옛 415.9, 라이브 540). 메타가 없으면(준비 중) 줄1 도 18.2 를 지킨다 */
  .tier-head{flex-wrap:wrap;gap:var(--sp-2) var(--sp-3);min-height:0}
  .tier-head .tier-note{flex:1 1 100%;min-height:calc(var(--fs-14) * 1.4);white-space:normal;line-height:1.4}
  .tier-head .section-tools{flex:1 1 100%;margin-left:0;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--sp-2) var(--sp-3);white-space:normal}   /* 2026-09-13: 라벨 | 세그 한 줄씩(라벨이 홀로 남지 않게) */
  .tier-head .section-tools>.seg{justify-self:start;max-width:100%}
}
#viewTier .tier-top{display:none}                                  /* 옛 도구줄은 쓰지 않는다 */
.tier-foot{margin-top:14px;font-size:var(--fs-14);color:var(--ink)}
/* 거르개 판(검색 나머지 10묶음·상점 칩 묶음·보석 등급/계열): 도구줄 다음 묶음부터 — 현행 .sch-fbar/.j-filters 룩 그대로 */
.filter-panel{margin-bottom:var(--sp-4)}
/* 연구 페이지 줄 25칸: 거르개 영역 안 가로 스크롤(L-07). 현행 칩 룩 그대로, 아래 패딩만 0 */
.toolbar-filters>.rs-chips{padding:0;overflow:visible}
/* 게시판 글 화면 도구줄: 거르개 "목록으로" + 앵커(링크 복사·포럼 원문 보기). 목록/글 상태는 한 도구줄 안 두 묶음([data-tb])을 display:none 으로 바꾼다 —
   앵커 .toolbar-end[data-tb] 는 grid 자식이라 숨은 쪽은 열을 차지하지 않고 보이는 쪽이 오른쪽 끝에 선다 */
.tips:has(> .view-body > .tips-board-detail:not([hidden])) .toolbar [data-tb="list"],
.tips.board.is-detail .toolbar [data-tb="list"]{display:none}
.tips:not(:has(> .view-body > .tips-board-detail:not([hidden]))):not(.is-detail) .toolbar [data-tb="article"]{display:none}
.toolbar .tip-category-filter{flex-wrap:nowrap;display:flex;width:auto;grid-template-columns:none}
.toolbar .tip-category-filter button{min-height:var(--ctl-h-sm);height:var(--ctl-h-sm);padding:0 var(--sp-3);font-size:var(--fs-13);flex:0 0 auto;min-width:var(--touch-min)}
.toolbar .tip-filter-count{margin-left:0}
.tips-board-detail .tip-reader-toolbar{display:none}
.tips .tips-board-list>*:first-child,.tips .tips-board-detail>*:first-child{margin-top:0}
.tips .tips-intro{max-width:none;margin-bottom:var(--sp-4)}
.tips .tips-intro .tips-lead{margin-top:var(--sp-1);font-size:var(--fs-14);line-height:var(--lh-body)}
.tips .tips-summary-line{margin-top:0}
.board .tips-board-detail{margin-top:0}

/* ── 7. 도감 — 2026-09-13: 도감 .view-top 은 행1(제목·세그)뿐(부제·도구줄 없음, L-01·S-01). 획득처 세그 #srcFilter 는 라이브처럼 프로필 열(무대 아래)로 되돌렸다(D-06).
   860↓ 순서(260914 사용자 정정): 무대(.pet-head) → 다른 항목 목록(#avTierFilter·#petAvs, 획득처 세그 바로 아래) → 성급 세그·스킬(.sk-col) → 단계 변화(.col-stages) → 세트 칩 → 일정. (옛: 목록이 스킬 뒤 — 사용자 반려)  옛 주석: 무대(.pet-head: 배지·이름·칭호·문구·비주얼·세트·획득처) → 성급 세그·스킬(.sk-col) → 단계 변화(.col-stages) → 다른 항목 목록(#avTierFilter·#petAvs) → 이 항목의 일정(#petSched).
   .pet-col 은 861↑ 그대로(flex 세로), 860↓ 는 display:contents 로 풀어 .main(flex 세로)에서 order 로 세운다. 접기 없음(S01-1). ── */
#srcFilter{margin-top:22px;width:100%;max-width:340px;order:2}
#setRow{order:1}                                                     /* 861↑: 비주얼 → 세트 칩 → 획득처(라이브 순서). .pet-head 는 display:contents 라 .pet-col flex 순서로 */
#avTierFilter,#petAvs,#petSched{order:3}
.pet-head{display:contents}
@media (max-width:860px){
  .main{display:flex;flex-direction:column}
  .pet-col{display:contents}
  .pet-head{
    order:1;display:grid;text-align:left;column-gap:16px;row-gap:2px;
    grid-template-columns:96px minmax(0,1fr);
    grid-template-areas:
      "vis badges"
      "vis name"
      "vis title"
      "vis copy"
      "src src";
  }
  #srcFilter{grid-area:src;margin-top:14px;max-width:none}
  /* 260914 사용자: "픽업펫들 위치 어디 갔어, 여기(획득처 세그) 아래에 있어야지" — 항목 목록은 861↑ 처럼 획득처 세그 바로 아래(무대 → 목록 → 성급 세그·스킬). 6차의 '스킬 뒤로' 순서 폐기 */
  #avTierFilter{order:2;margin-top:16px}
  #petAvs{order:2;margin-top:12px}
  .sk-col{order:3;margin-top:28px}
  .col-stages{order:4;margin-top:28px}
  #setRow{order:5;margin:24px 0 0;max-width:none;justify-content:flex-start}
  #petSched{order:6;margin-top:24px;align-items:flex-start}
}

/* ── 8. 성급 효율·효과로 찾기·보석 — 검색 입력은 거르개 첫째(DECISIONS #7), 보석 개수는 앵커 메타. 옛 .bp-tools 는 없다 ── */
.toolbar-filters>.dex-search{height:var(--ctl-h)}
.toolbar-filters>.j-filter-row{padding:0;align-items:center;gap:var(--sp-2)}                    /* 소원 석상 레벨 칩 · 토템 스타일 칩(첫 묶음, §1-3). 룩은 viewer.css .j-filter-chips 그대로 */
.toolbar-filters>.j-filter-row .j-filter-label{padding-top:0;width:auto;white-space:nowrap}
.toolbar-filters>.j-filter-row .j-filter-chips{flex-wrap:nowrap}
.toolbar-filters>.j-filter-row .j-filter-chips button{white-space:nowrap}
.toolbar-filters .j-search-wrap{display:contents}
.toolbar-filters .j-search-wrap input{width:100%;max-width:var(--input-w-toolbar);height:var(--ctl-h);margin:0}
@media (max-width:860px){.toolbar-filters .j-search-wrap input{max-width:none;flex:1 1 var(--input-w-min-mobile);min-width:var(--input-w-min-mobile)}}
.j-filters.filter-panel{border-top:0;padding-top:0}

/* ── 9. (폐지) 공유 바텀시트 — 2026-09-13 C-6: 덱 편성·티어메이커의 [링크 복사][이미지로 저장] 은 도구줄 앵커의 직접 버튼(라이브 방식). 시트 마크업·규칙 없음 ── */

/* ── 10. 공략 안 뷰 — 덱 편성 .view--deck · 티어메이커 .view--maker (DECISIONS #76). 화면 틀은 .tier/.bp 와 같은 24/32(860↓ 20/20).
   body.fm-page{--page-w:1400} 와 maker.html 안 <style> 의 body 수준 규칙을 뷰 컨테이너로 옮겼다(#mkStage·.mk-* 는 원본 값 그대로).
   5차 실측 P1-1(#88): 덱 편성 본문도 다른 공략 화면과 같은 1240(콘텐츠 1176) — 옛 .view--wide(본문만 1400)는 첫 콘텐츠 상자가 제목·도구줄보다 양쪽 80 씩 튀어나오고
   편성판 620 + 패널 520 은 그 여분을 쓰지도 않았다. 전 화면 .view-body 좌우 = .view-top 좌우(검사 (v2)). ── */
.view--deck,.view--maker{max-width:var(--page-w);margin:0 auto;padding:24px 32px 64px}
/* 지연 초기화 자리표시자(검사 (x), #78 · 5차 P2-9): 데이터를 받기 전에만 — 초기화 뒤에는 판 높이가 문서 높이라 트레이가 판 바로 아래에 선다(원본과 같은 배치).
   초기화 전에는 골격 .view-skel(#91)이 첫 콘텐츠 자리를 그리고, min-height 가 푸터를 뷰포트 아래에 잡아 둔다 */
.view--deck>.view-body:has(> #fmStage[hidden]),.view--maker>.view-body:has(> #mkStage[hidden]),
.view--maker>.view-body:has(> #mkStage > #mkStart:not([hidden])){min-height:calc(100vh - 200px)}   /* 시작 판이 열린 동안도(판·트레이가 숨어 문서가 짧아지면 푸터가 뷰포트로 올라와 layout-shift 가 생긴다, 검사 (x)) */
.view-body:has(> #fmStage:not([hidden]))>.view-skel,.view-body:has(> #mkStage:not([hidden]))>.view-skel{display:none}
.view-skel{padding:0 0 16px}
.view-skel i{display:block;border:1.5px dashed var(--line);border-radius:12px;background:var(--soft)}
.skel-split{display:grid;grid-template-columns:minmax(0,max-content) minmax(420px,520px);justify-content:center;align-items:start}
.skel-stage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;width:620px;max-width:100%;padding:clamp(16px,2.4vw,30px);margin-right:36px;border:1px solid var(--line);border-radius:22px;background:var(--soft)}
.skel-stage i{aspect-ratio:170/114;border-radius:11px;background:var(--card)}   /* 파티 칸 = 라벨 18 + 얼굴 2장(62:68) — 620 판에서 170×114 */
.skel-panel{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-left:34px;border-left:1px solid var(--line)}   /* 오른쪽 패널 = 빈 칸 머리 한 장 + 조련사 카드 2열 */
.skel-panel i{height:56px}
.skel-panel i:first-child{grid-column:1/-1;height:70px}
.skel-rows{display:grid;gap:0}
.skel-rows i{height:64px;border-radius:0;border-width:0 0 1px;border-style:solid;background:none;position:relative}
.skel-rows i::before{content:'';position:absolute;left:0;top:20px;width:44px;height:24px;border-radius:8px;background:var(--tint)}
.view--deck #fmStage{max-width:none;margin:0;padding:0 0 16px}
.view--maker #mkStage{max-width:none;margin:0 auto;padding:0}
/* 인라인 시작 판(#90): 옛 시작 모달의 카피·두 버튼을 판 자리에 — 카드 한 장, 버튼 두 개 나란히(560↓ 세로). 덮어쓰기 확인만 모달(#mkModal) */
.mk-start{max-width:560px;margin:0 auto;padding:var(--sp-6) var(--sp-5);border:1px solid var(--line);border-radius:16px;background:var(--card);text-align:center}
.mk-start-t{margin:0;font-size:var(--fs-18);font-weight:700;line-height:var(--lh-tight);letter-spacing:-.01em}
.mk-start .mk-modal-sub{margin-top:6px}
.mk-start-acts{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);margin-top:var(--sp-4)}
.mk-start-acts .mok{width:100%;margin:0}
@media (max-width:560px){.mk-start-acts{grid-template-columns:1fr}}
/* maker.html <style> 이식 — 티어 판·드래그 표시·sticky 트레이·모달 보조(원본 값, 색은 토큰) */
.view--maker .mk-drop{transition:background var(--dur-1)}
.view--maker .mk-drop.dropover{background:var(--st-soon-bg)}
.view--maker .mk-drop.dropover .tlab{color:var(--blue7)}
#mkBoard .tchip.mk-ins-before{box-shadow:-6px 0 0 -2px var(--blue)}
.view--maker .mk-drop.mk-ins-end .tchips::after{content:'';align-self:stretch;width:3px;min-height:32px;border-radius:2px;background:var(--blue)}
#mkStage .tchip{touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;cursor:grab}
#mkStage .tchip:active{cursor:grabbing}
.view--maker .tchip.mk-sel{border-color:var(--blue);box-shadow:0 0 0 2px var(--sel);background:var(--soft)}
.mk-tray{
  position:sticky;bottom:0;z-index:var(--z-sticky);margin-top:10px;
  padding:12px 32px calc(14px + env(safe-area-inset-bottom));
  background:var(--bg);border-top:1px solid var(--line);
  box-shadow:0 -8px 24px -14px rgba(0,0,0,.28);
}
.mk-tray-head{display:flex;align-items:baseline;gap:8px;margin-bottom:8px}
.mk-tray-head .mk-tray-t{font-size:13px;font-weight:700;color:var(--ink)}
.mk-tray-head .mk-tray-n{font-size:13px;font-weight:600;color:var(--sub)}
.mk-tray-head .mk-tray-hint{display:none}                          /* S30-2: 안내는 사용 안내 하나(#mkHint) */
.mk-trayrow{
  display:flex;gap:8px;align-items:flex-start;align-content:flex-start;flex-wrap:wrap;
  overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;
  max-height:min(34vh,240px);padding-bottom:4px;scrollbar-width:thin;min-height:52px;
}
.mk-trayrow::-webkit-scrollbar{width:6px}
.mk-trayrow::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}
.mk-trayrow .tchip{flex:none}
.mk-modal-sub{font-size:var(--fs-14);color:var(--ink);margin-top:6px;line-height:1.6}   /* S49-1: 14·본문색 */
.mk-warn{font-size:var(--fs-14);color:var(--st-alert-fg);background:var(--st-alert-bg);border-radius:var(--r-8);padding:9px 11px;margin-top:12px;line-height:1.5}
.mk-alt{background:var(--card);color:var(--ink);border:1px solid var(--line)}
.mk-alt:hover{background:var(--soft)}
.mk-startdesc{display:block;font-size:12px;font-weight:500;margin-top:2px;opacity:1;color:inherit}   /* S49-1: 12 · 흰 100%(#1b64da 위 5.41) */
.mk-pngf{margin-top:14px}
.mk-pngf label{display:block;font-size:var(--fs-14);font-weight:600;color:var(--ink);margin-bottom:6px}
.mk-pngf input{width:100%;height:44px;border:1px solid var(--line);border-radius:10px;padding:0 12px;font:inherit;font-size:14px;background:var(--card);color:var(--ink)}
.mk-pngf input:focus{outline:none;border-color:var(--blue)}
.m-actions.row{flex-direction:row;gap:8px}
.m-actions.row .mok{flex:1}
/* 2택 가로(COMPONENT_SPEC §11): 닫기·취소 = 왼쪽 고스트(.mk-alt/.fm-alt), 주 행동 = 오른쪽 프라이머리. 한줄평·보정·초기화·이미지 저장 공통 */
.modal .m-actions.row .mk-alt,.modal .m-actions.row .fm-alt{background:var(--card);color:var(--ink);border:1px solid var(--line)}
.mk-imgwrap{margin-top:12px;max-height:56vh;overflow:auto;border:1px solid var(--line);border-radius:12px;background:var(--soft)}
.mk-imgwrap img{display:block;width:100%;height:auto}
.mk-imgname{font-size:var(--fs-14);color:var(--ink);margin-top:8px;word-break:break-all;text-align:center}
@media (max-width:900px){
  .skel-split{grid-template-columns:minmax(0,1fr)}
  .skel-stage{width:auto;max-width:520px;margin-right:0}
  .skel-panel{padding-left:0;border-left:0;border-top:1px solid var(--line);padding-top:18px;margin-top:20px}
}
@media (max-width:860px){
  .view--deck,.view--maker{padding:20px 20px 48px}
  .view--deck #fmStage{padding:0 0 16px}
  /* 5차 실측 P2-6(#91): v2 상단이 원본보다 98 높아 390 에서 판이 트레이 위로 182 만 보이던 것(원본 280) → 트레이를 낮춰 판 가시 영역 260 이상(SS 행까지 드롭 가능).
     트레이 목록 최대 높이 min(34vh,240) → min(24vh,160), 패딩 12/14 → 8/10 */
  .view--maker .mk-tray{padding:8px 20px calc(10px + env(safe-area-inset-bottom))}
  .view--maker .mk-trayrow{max-height:min(20vh,120px)}                 /* 2026-09-13: 칩 44·2열 격자 — 펼쳐도 SS 줄이 판 위에 남게(트레이 ≈ 190) */
  .view--maker .trow{gap:14px}
  .skel-stage{gap:9px;padding:12px}
  .skel-rows i{height:56px}
}






/* ── 11-0. 문서 — PC 짧은 문서 전환 시 7.5px 흔들림 제거(S36-2·S-09) ── */
html{scrollbar-gutter:stable}

/* ── 11-1. 본문 14: p·li 와 그 안의 글자(inherit). 표·카드 설명문도 14 ── */
p,li{font-size:max(var(--fs-14),1em)}
:is(p,li) :is(b,i,em,span,small,strong,a,u,s,mark,time,code):not(#_){font-size:inherit}
.ft p,.ft-legal,.ft-contact,.ft-meta,.ft-note,.ft-contact a,.j-detail-head p,.fm-ihead p,.fm-note,.rs-note,.rs-detail-h span,.rs-meta i,.rs-meta em,.rs-pool-row span{font-size:var(--fs-14)}
.ft p,.j-detail-head p,.fm-ihead p,.fm-note,.rs-detail-h span,.rs-meta i,.rs-meta em,.rs-pool-row span,.dg-dtop p,.rs-pool p{color:var(--ink)}
.dg-dtop p,.rs-pool p,.rs-pool>p{font-size:var(--fs-14)}
.ft-meta,.ft-note,.ft-legal,.ft-contact{color:var(--ink)}
.stl li,.stl .g,.stl .chg,.stl .tag-now{font-size:var(--fs-14)}
.pet-title,.pet-copy,.grade-count,.p-note,.p-sub,.uc-sub,.uc-asc,.uc-lead,.ps-tag,.ga-note,.ga-empty,.ga-lad-sub,.sm-note,.j-formula,.j-candidate-note,.rs-note,
.m-note,.m-cur,.m-or,.m-f label,.tm-sec p,.tip-block-cap,.board-foot,.tip-article-meta,.tips-summary-line,.pn-note,.pn-meta,.mk-modal-sub,.fm-msub,.cap-roster p,.cap-up,
.tier-disc,.sk-stagechg,.emptybox,.j-empty,.sch-empty,.bp-empty,.tier-empty p,.board-pill,.tip-step-desc,.tip-step-no,.fm-side,.fm-lvhint,.dg-eff .est,.tl-note,.set-note,.setrow .lb,
.sch-fg-lb .c,.cap-pair-note,.cap-col-head span,.j-picker-head span,.j-slot-summary span,.dg-eff .k,.tt-eff .k,.tt-per,.dg-row .k,.uc-head .uc-lead,.fm-legend,.fm-legend span,.tu-cnt,
.mk-tray-head .mk-tray-n,.jm-body p,.sm-blk h4,.j-filter-label,.t-head>span,.t-odds .lb,.cap-pair-label,.cap-lv .tt,.rs-head-t span,.rs-detail-h em,.g-inline-note,.g-static-banner p,
.w-notes li,.w-summary p,.w-head span,.g-help-list li,.j-pool>p,.j-auto-head p,.j-raw-total,.yuk-foot,.tl-lg,.tl-lg-cap,.tl-head>span,.hd-date,.tl-mcount,.av-none,.tempty{font-size:var(--fs-14)}
.j-formula,.j-candidate-note,.rs-note,.m-note,.ga-note,.ga-lad-sub,.sm-note,.tm-sec p,.tip-block-cap,.board-foot,.p-note,.j-empty,.sch-empty,.bp-empty,.emptybox,.ga-empty{color:var(--ink);line-height:var(--lh-loose);max-width:64ch}   /* 설명문 공통(S11-2·S12-2·S15-3): 본문색·한 줄 64자 이내 */
.tip-article{max-width:none}                                       /* 260914 사용자: 글 칸은 본문 폭을 다 쓴다(62ch 상한 폐지 — §12 줄바꿈 규칙) */
.board-item-body{font-size:var(--fs-15)}
.tip-step-desc{font-size:var(--fs-14);color:var(--ink)}
.tip-article-sub{font-size:var(--fs-15);color:var(--ink)}
.view-h2 .beta,.hd-nav .beta{font-size:12px}
.badge,.badge.sm,.no,.sch-cat,.sch-tag,.tshift,.mk-grade,.tchip-g,.tbadge,.tmark,.ut,.bp-uts .ut,.av-cnt,.g-bn,.g-il,.g-bcnt,.g-tb,.per,.dg-plate .per,.j-grade,.pr-tag,.fm-st,.fm-lv,.fm-poface em,.cap-step .lv,.rs-tier,.rs-val,.rs-lv,.rs-edge,.rs-chips button em,.shop-ic em,.shop-ic i,.shop-kind,.shop-cond,.shop-hrs,.jewel-row-meta small,.jewel-row-copy small,.t-cell small,.tt-cell .st,.sk-refs .rk,.aoe-meta .rk,.sk-type,.dg-chip .k,.dg-chip .n,.dg-cell .val,.dg-plate .val,.ga-p,.ga-step .n,.ga-cum .num,.ev em,.ev b,.fm-nm,.fm-lb,.fm-lb u,.fm-lb s,.fm-tsub,.fm-opt s,.fm-ponm,.tlab.u,.cap-tile .nm,.cap-jump button,.j-gacha-head small,.j-gacha-row small,.w-level-summary span,.w-tier-row>small,.w-option-row>span small,.g-cost-line span,.w-cost-line span,.g-party-item small,.statue-step small,.g-tier-ribbon small,.g-option-cell small,.uc-ax,.uc-scale,.tick,.tnow,.vmonth,.vnow,.g-dates,.g-stat,.mband,.bar,.tl-gl.rerun::after,.tl-gl.event::after,.sk-up .sk-up-item::before,.hd-nav .beta,.pn-tier.u,.rs-nm,.rs-note,.j-weight-head,.j-stat-row small,.j-range-ends,.g-rule-head,.g-cap-head,.w-option-head,.cap-fold>summary span,.cap-fold>summary::after,.rs-pool-g summary::after,.g-fold summary span,.g-fold summary::before,.w-zero summary,.j-group-seg button small,.cap-step .ev em,.cap-roster .h span,.dg-cell.dim .val.none,.tt-grow .v .l,.j-auto-grades button,.j-gacha-slot button,.ga-lv button,.fm-pk3 .fm-pk,.fm-gear i,.g-tcap,.badge.s-end{font-size:12px}   /* 보조 12 하한(생성물과 겹치는 것도 명시) */
.rs-nm,.shop-cond,.jewel-row-copy small,.jewel-row-meta small,.sm-blk h4,.sk-refs .rk,.ga-p,.cap-col-head span,.t-head>span,.dg-eff .k,.tt-eff .k,.tt-cell .st{font-size:var(--fs-13)}   /* 2026-09-13 코덱스 P1-4·P1-5: .ga-lad-sub·.aoe-dir·.sk-ref span 은 문장형 → §11-5 본문 14 */
.shop-gv{display:inline;font-size:var(--fs-13);color:var(--ink)}   /* S08-1: 패스 단계 조건은 모바일에도 */
@media (max-width:640px){.shop-gv{display:inline}}

/* ── 11-2. 대비 4.5 예외 없음 — 보조색 --sub 는 토큰에서 올렸다(라이트 #5C6570 · 다크 #A0A8B3). 남은 하드코딩·선택 면·투명도만 손질 ── */
.hd-logo .logo-decks,.logo-decks{color:var(--blue7)}                  /* 로고 '덱' 3.71 → 5.41 */
.sk-type.t-active,.stl li.now .g,.stl .tag-now,.tl-today{color:var(--blue7)}
.bp-low{color:#1F6F56}
[data-theme="dark"] .bp-low{color:#4CC79A}
.j-filter-chips button.g-pd,.schip.paid{color:var(--paid-fg)}
.j-filter-chips button.g-un{color:var(--sub)}
.tlab.sss,.pn-tier.sss{background:#C92A2A;color:#fff}                 /* S21-1: 5.46 */
.tlab.ss,.pn-tier.ss{background:#C2410C;color:#fff}                   /* 5.21 */
.tlab{color:var(--ink)}
.pr-tag{color:var(--ink);font-size:12px}
.pr-tag.on,.pr-chip.on .pr-tag{background:var(--blue8);color:#fff}   /* S48-2: #fff/#1957C2 6.6 */
[data-theme="dark"] .pr-tag.on,[data-theme="dark"] .pr-chip.on .pr-tag{background:#17171C;color:#fff}
.pr-amt,.pr-sub{font-size:12px;color:var(--ink)}
.pr-chip.on .pr-amt,.pr-chip.on .pr-sub{color:var(--pick-fg)}
.cc-chip.move{color:var(--tone-deb-fg)}
.cc-chip.hard{color:var(--tone-cc-fg)}
.cap-step .ev b.sp{color:var(--st-near-fg)}
.ga-run button.on small,.ga-run button small{opacity:1;color:inherit;font-size:12px}   /* S06-2 */
.fm-sec h5 s{color:var(--sub);opacity:1;font-size:12px}
.dg-chip .n{color:var(--ink);font-size:12px}                          /* S18-1·S19-1: 1.36 → 14.9 */
.dg-chip .k,.dg-chip .v{color:var(--ink)}
.dg-plate.dim .dg-pl:not(.dg-pl-none){opacity:.6}                     /* S20-2 */
.dg-plate.dim .dg-pl.dg-pl-none{opacity:1}
.dg-pl-none b{color:var(--ink)}
.dg-eff.none .v,.dg-cell .val.none,.dg-plate .val.none{color:var(--ink)}   /* S19-2 */
.av-cnt{color:var(--pick-fg);font-size:12px;height:20px;min-width:22px}   /* S02-3 */
.fm-chip.on{color:var(--card)}                                       /* S60-3: 다크 --ink 면 위 1.19 → 12.6 */
.fm-poface em{font-size:12px;background:var(--card);color:var(--ink);border:1.5px solid var(--el);line-height:1.3;padding:0 4px}   /* S60-3: 원색 면 위 흰 글자 1.79 → 카드 위 본문색 */
.fm-po.off{opacity:1}
.fm-po.off .fm-poface{opacity:1}
.fm-po.off .fm-poface img{opacity:.45}                               /* 2026-09-13 코덱스 P1-3: 얼굴 그림만 흐리고 등급 배지는 불투명(2.82 → 본문 대비) */
.fm-po.off .fm-ponm{color:var(--ink);text-decoration:line-through}   /* 배치된 펫: 이름은 읽히고 줄을 그어 상태를 글자로 */
.fm-ponm{color:var(--ink);font-size:12px}
.fm-lv{background:rgba(16,24,40,.82);text-shadow:none}               /* 그라데이션 위 흰 글자 → 짙은 면 위(합성 11:1) */
.ga-name{background:rgba(255,255,255,.94)}                           /* 뽑기 무대 이름 칸: 투명→불투명 그라데이션 대신 한 면(다크 글자 12:1) */
[data-theme="dark"] .ga-name{background:rgba(32,32,39,.94)}
.fm-face-x{color:var(--sub)}
.sch-chip.cc.on,.sch-chip.deb.on,.sch-chip.buff.on,.sch-chip.surv.on,.sch-chip.sp.on,.sch-chip.imm.on,.sch-chip.res.on{color:var(--pick-fg)}   /* 다크는 밝은 면이라 어두운 글자 */
.board-pill.is-alert{color:var(--st-alert-fg)}
.s-live,.b-live{border:1px solid var(--st-live-line)}                 /* 진행 중 배지: 토큰 D-02 대안(면 없이 글자+선) — 카드 위에서 테두리로 구분 */
.board-pill.is-mute{color:var(--ink)}
.up-kind{color:var(--ink)}                                           /* S47-2 */
.g-il,.g-bn,.g-av.ended .g-bn,.g-av.rerun .g-bn{color:var(--ink)}    /* S51-2: --sep 2.01 → 본문색 */
.g-stat.up{color:var(--ink);opacity:1}
.g-bcnt,.g-tb.pkg{color:#fff;background:color-mix(in srgb,var(--bc) 78%,#000)}   /* 흰 글자 면을 어둡게(무기 6.2 · 탑승펫 5.0) */
.g-chip.ended .g-nm,.g-dates,.tl-lg,.tl-lg-cap{color:var(--ink)}
.mtxt{color:var(--ink);font-size:var(--fs-14);height:var(--touch-min)}
.jewel-row.on small,.jewel-row.on .jewel-row-meta small,.jewel-row.on .jewel-row-copy small{color:var(--ink)}   /* S10-2 */
.bp-row[aria-expanded="true"] .bp-src,.bp-row[aria-expanded="true"] .bp-typ,.bp-row[aria-expanded="true"] .bp-min{color:var(--ink)}   /* S27-2 */
.tt-cell[aria-pressed="true"] .st,.cap-tile.hi .nm,.dg-cell[aria-pressed="true"] .val.none{color:var(--ink)}
.sk-ref span,.aoe-dir,.sk-refs .rk,.aoe-meta .rk{color:var(--ink)}   /* S01-2·S02-2 */
.shop-ic em,.shop-ic i,.shop-kind,.shop-cond,.shop-hrs,.shop-won.free{color:var(--ink)}   /* S07-2·S08-2 */
.t-head>span,.t-cell small,.t-odds .lb,.od small{color:var(--ink)}   /* S12-1 */
.tt-cell .st,.tt-eff .k,.tt-per{color:var(--ink)}                     /* S14-3 */
.cap-col-head span,.cap-step .lv,.cap-jump button,.cap-tile .nm,.cap-pair-label,.cap-pair-note,.ev em,.ev b.off,.cap-lv .tt{color:var(--ink)}   /* S15-2 */
.rs-chips button em,.rs-lv,.rs-edge,.rs-tier,.rs-val,.rs-nm{color:var(--ink)}   /* S16-2·S17-1 */
.rs-chips button.on em{color:inherit}
.dg-eff .k,.dg-row .k,.per,.dg-plate .per{color:var(--ink)}          /* S20-1 */
.ga-p,.ga-row .ga-p,.ga-step .n,.ga-cum .num,.ga-note b,summary em,.ga-fold>summary em{color:var(--ink)}   /* S45-1·S04-2 */
.sm-blk h4,.sm-note,.ga-lad-sub,.ga-note{color:var(--ink)}           /* S09-2·S46-1 */
.sch-cat,.sch-tag.rest,.sch-fg-more,.sch-typ,.sch-src{color:var(--ink)}   /* S40-3 */
.bp-head,.bp-uts .ut,.bp-src,.bp-typ,.bp-min,.bp-detail th,.bp-d-c{color:var(--ink)}   /* S26-3 */
.bp-head{font-size:12px}
.jewel-row-meta small,.jewel-row-copy small,.j-filter-label,.j-picker-head span,.j-slot-summary span{color:var(--ink)}
.fm-legend span,.fm-sec h5,.fm-tsub,.fm-opt s,.fm-lvhint,.fm-side,.fm-mark span,.fm-del,.fm-ride,.fm-chip,.fm-nm,.fm-lb,.fm-gear i,.fm-av b{color:var(--ink)}
/* .tempty 는 §11-5(첫 빈 행 하나에만 한 줄 안내 — 코덱스 S30-2 재판정) */
.m-in span,.m-f label,.m-note,.m-cur,.m-or,.tm-sec p,.pn-meta,.tip-block-cap,.tip-article-meta,.tips-summary-line,.section-meta,.p-sub,.p-note,.pet-title,.pet-copy,.grade-count,.ps-tag,.uc-sub,.uc-lead,.uc-ax,.uc-scale,.vmonth,.vnow,.av-nm,.av-item.ended .av-nm,.av-dt,.schip,.set-note,.setrow .lb,.stl .chg,.eff-lb,.cc-lb,.own-row .lb,.stat .k,.no,.badge.ev,.tl-head>span,.near,.hd-date,.tl-mcount,.tl-yy,.j-empty,.sch-empty,.bp-empty,.emptybox,.tier-empty p,.ga-empty,.mk-tray-n,.fm-legend{color:var(--ink)}
.av-past>summary,.ps-past>summary,.rs-pool-g summary b,.cap-fold>summary span,.g-fold summary span,.w-zero summary{color:var(--ink)}
input::placeholder,textarea::placeholder{color:var(--sub);opacity:1}
.dex-search::placeholder,.tu-q::placeholder,#jewelSearch::placeholder{color:var(--sub)}
.hd-nav button,.hd-nav a{color:var(--sub)}
.theme-tg{color:var(--ink)}
.tl-arrow:disabled,.tl-today:disabled,.schip:disabled{opacity:1;color:var(--sub);border-color:var(--line)}   /* 흐리기 대신 색으로 — 글자는 4.5 이상 */
.tchip.end,.tchip.end .em{color:var(--ink);opacity:1}
.tchip.end .em{filter:grayscale(1);opacity:.6}
.av-item.ended .av-nm,.av.ended{color:var(--ink)}
.g-chip.ended,.g-chip.ended *{opacity:1}
.tip-card .tip-card-num{display:none}                                /* S32-2: 큰 날짜 삭제(제목이 날짜) */
.dg-tnm{display:block;font-size:var(--fs-14);font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}   /* 칭호 이름은 글자로(띠 그림은 장식) */

/* ── 11-3. 누르는 것 44 예외 없음(실제 입력 사각형) ── */
.theme-tg{width:var(--touch-min);height:var(--touch-min)}
.hd-logo{min-height:var(--touch-min);display:inline-flex;align-items:center}
.hd .hd-in{align-items:center}
.sch-chip,.j-filter-chips button,.j-filter-chips .on,.cap-jump button,.dg-chip,.schip,.fm-chip,.fm-chip.sm,.fm-ride,.tchip,.tip-category-filter button,.toolbar .chip,.chip,.ga-lv button,.rs-chips button,.j-gacha-slot button,.j-auto-grades button,
.w-stat-grid button,.g-stat-grid button,.j-group-seg button,.j-slot-grid button,.w-level-grid button,.fm-pk2 .fm-pk,.fm-pk3 .fm-pk,.fm-opt,.fm-del,.fm-topt,.fm-po,.ga-odds,.ga-run button,.sch-fg-more,.up-more,.board-links a,
#statusFilter button,.tips-board-items .tip-card,.g-av,.pr-chip,.vrow,.uprow,.stl li,.dg-cell,.dg-plate,.tt-cell,.cap-step,.bp-row,.jewel-row,.sch-row,.shop-card,.rs-node,.evacc>summary,.tu-tools .tu-seg>button{min-height:var(--touch-min)}
.sch-chip,.j-filter-chips button,.cap-jump button,.dg-chip,.schip,.fm-chip,.fm-ride,.tip-category-filter button,.ga-lv button,.rs-chips button,.j-gacha-slot button,.j-auto-grades button,.fm-pk2 .fm-pk,.fm-pk3 .fm-pk,.sch-fg-more,#statusFilter button,.av-item{min-width:var(--touch-min)}
.sch-chip,.j-filter-chips button,.cap-jump button,.schip,.fm-chip,.tip-category-filter button,.ga-lv button,.sch-fg-more{display:inline-flex;align-items:center;justify-content:center}
.dg-chip{min-height:var(--touch-min)}
.rs-chips button{min-width:var(--touch-min);min-height:var(--touch-min)}   /* S16-1 */
.cap-jump button{min-height:var(--touch-min)}                        /* S15-1 */
.cap-pick input[type=range]{height:var(--touch-min);min-width:180px}
.ga-goal input[type=range]{height:var(--touch-min)}
.cap-pick input[type=range]::-webkit-slider-thumb{width:28px;height:28px}
.ga-goal input[type=range]::-webkit-slider-thumb{width:28px;height:28px;margin-top:-11px}
.ga-goal input[type=range]::-moz-range-thumb{width:28px;height:28px}
.ga-run button{min-height:var(--touch-min);padding:10px 0}          /* S05-2 */
.ga-run button.on{background:var(--card);border-color:var(--line);color:var(--ink)}   /* S04-1: 실행 버튼은 선택 상태 없음 */
.ga-run .ga-reset{width:auto;min-width:var(--touch-min);padding:8px 12px;font-size:12px}   /* S52-2: '기록 지우기' 글자 */
.ga-odds{min-height:var(--touch-min);font-size:var(--fs-13)}
.ga-pick select,.ga-pick .ga-sel,select{min-height:var(--touch-min);font-size:var(--fs-14)}
.ga-lv{display:grid;grid-template-columns:repeat(var(--cols,7),minmax(0,1fr));gap:0;height:auto;padding:var(--seg-pad);border-radius:var(--r-12);background:var(--tint)}   /* S45-2: 레벨 선택은 세그 부품 */
.ga-lv button{border:0;border-radius:var(--r-8);background:transparent;color:var(--seg-off);font-size:var(--fs-13);font-weight:700;padding:0 4px;min-height:var(--touch-min)}
.ga-lv button.on{background:var(--pick-bg);border-color:var(--pick-bg);color:var(--pick-fg);box-shadow:var(--sh-1)}
@media (max-width:560px){.ga-lv{grid-template-columns:repeat(4,minmax(0,1fr))}}
.notice>summary,.ga-fold>summary,.rs-pool-g summary,.av-past>summary,.ps-past>summary,.g-fold summary,.w-zero summary,.evacc>summary,.cap-fold>summary,.board-held>summary,.bp-help>summary,details>summary{min-height:var(--touch-min);display:flex;align-items:center;box-sizing:border-box}
.ga-fold>summary{align-items:center}
.av-past>summary,.ps-past>summary{padding:0 2px;font-size:var(--fs-14)}
.fm-lvin{height:var(--touch-min)}
.m-in{height:auto;min-height:calc(var(--touch-min) + 2px)}
.m-in input{height:var(--touch-min);font-size:var(--fs-14)}
.m-in span{font-size:var(--fs-14)}
.m-f label{font-size:var(--fs-14);color:var(--ink)}
.m-f select,.m-f input[type=date]{min-height:var(--touch-min);font-size:var(--fs-14)}
.tu-q{height:var(--touch-min);font-size:var(--fs-14)}
.dex-search,.j-search-wrap input,#schName,#bpSearch{height:var(--ctl-h);font-size:var(--fs-14)}
.hd-nav button,.hd-nav a{min-height:var(--touch-min)}
.tips-board-items .tip-card,.board .tip-card{min-height:var(--touch-min)}
/* 문장 안 링크(푸터 문의·꿀팁 본문): 보이는 면은 글줄 그대로, 입력 사각형만 44 (가상 요소) */
.ft a,.tip-p a,.board-item-body a,.tips-board-detail a:not(.ghost),.notice a{position:relative}
.ft a::before,.tip-p a::before,.board-item-body a::before,.tips-board-detail a:not(.ghost)::before,.notice a::before{content:'';position:absolute;left:-4px;right:-4px;top:50%;height:var(--touch-min);transform:translateY(-50%)}
/* 편성판 빈 자리(S28-1·S53-1·S60-1·L-08 C-5): 560↓ 높이 44 고정 폐지 — 내용(점선 칸 2줄 + 이름줄) 기준, 채운 칸과 같은 높이 함수 */
@media (max-width:560px){
  .fm-mark{height:auto;font-size:12px}
  .fm-lb,.fm-nm{font-size:12px;height:auto}
  .fm-lb s{display:inline}
  .fm-gear i{font-size:12px;padding:1px 0}
  .fm-st{font-size:12px;padding:0 4px}
  .fm-legend{font-size:12px}
}
.fm-mark i{margin-bottom:21px}
/* 티어 항목(.tchip) 44·이름 14 */
.tchip{min-height:var(--touch-min);font-size:var(--fs-14)}
.tchips{min-height:var(--touch-min)}
/* 표 머리 작은 세그(콘텐츠·전투력·과금) 칸 44 — 860↓ 표 머리는 라벨 줄 + 세그 줄(넘치면 줄바꿈) */
.tier-head .seg--sm>button{min-height:var(--touch-min)}
#tierGradeSeg>button,#modeSeg>button,#tierContentSeg>button{min-height:var(--touch-min)}
/* 상점 조건 칩·보석 칩·꾸미기 칩 44 → 거르개 판 높이 상쇄: 상점의 '열리는 조건' 묶음은 상품 갈래별로만(_viewer-v2.js) */
.sch-fg-chips{gap:8px}
.j-filter-chips{gap:8px}
/* 소원 석상 단계·토템 스타일 칩(S13-1): 라이브처럼 본문 첫 줄(거르개 판)로 되돌림 — 도구줄 350 에 577 이 들어가 1~4레벨이 화면 밖이던 것. 칩 44, 줄바꿈 */
/* 연구 페이지 칩은 가로 스크롤 유지(S16-1) */
#growthFilters>.rs-chips{flex-wrap:nowrap}

/* ── 11-4. 빈 결과·오류 상태 — 문장 + 동사 버튼 1개(S54-1·S41-1·S55-2·S-10·D-10). 불러오는 중은 글자로(S56-2·C-9): 표가 차면 숨는다 ── */
[data-loading]{margin:var(--sp-4) 0;font-size:var(--fs-14);color:var(--ink)}
#tierBody:not(:empty) ~ [data-loading],#bpBody:not(:empty) ~ [data-loading]{display:none}
.empty,.j-empty,.sch-empty,.bp-empty,#dataEmpty{font-size:var(--fs-14);color:var(--ink);line-height:var(--lh-loose)}
.empty-act{display:inline-flex;align-items:center;justify-content:center;min-height:var(--touch-min);margin-top:var(--sp-3);padding:0 16px;border:1px solid var(--line);border-radius:var(--r-8);background:var(--card);color:var(--ink);font-size:var(--fs-14);font-weight:700;cursor:pointer}
.empty-act:hover{background:var(--soft)}
#dataEmpty{max-width:var(--page-w);margin:var(--sp-6) auto;padding:var(--sp-6) var(--sp-7);border:1px solid var(--line);border-radius:var(--r-16);background:var(--card);text-align:center}
#dataEmpty .empty-act{display:inline-flex}
.j-empty small{display:block;font-size:var(--fs-14)}
/* 보석 목록(S10-3): 860↓ 중첩 스크롤 없음 */
@media (max-width:860px){.jewel-list,#jewelList{max-height:none;overflow:visible}}
/* 토템(S14-1): 860↓ 상세를 격자 위로 */
@media (max-width:860px){.tt-detail{order:-1}}
/* 꾸미기(S18-2): 860↓ 요약·합계는 아이템 뒤로 */
@media (max-width:860px){
  #dogamBody{display:flex;flex-direction:column}
  #dogamBody>.j-filters{order:1}
  #dogamBody>.dg-layout{order:2}
  #dogamBody>.j-slot-summary,#dogamBody>.j-picker-head,#dogamBody>.dg-sum{order:3}
  #dogamBody>.j-formula,#dogamBody>.j-candidate-note{order:4}
}
/* 재능·소원 표(S12-1): 첫 열 고정, 390 에서 5등급이 들어가게 셀 패딩 축소 */
.t-wrap .t-head>span:first-child,.t-wrap .t-row>span:first-child,.t-wrap .t-cell:first-child{position:sticky;left:0;background:var(--card);z-index:1}
@media (max-width:560px){.t-cell,.t-head>span{padding:6px 4px}}
/* 보석 행(S10-1): 수치 말줄임 없이 두 줄 허용 */
.jewel-row-copy small{white-space:normal;overflow:visible;text-overflow:clip}
/* 상점(S07-2): 조건 문자열 잘림 없이 줄바꿈 */
.shop-cond{white-space:normal;overflow:visible;text-overflow:clip}
/* 성급 효율 390(S26-1·S26-2·S27-1·D-08): 값마다 이름 반복, 행 2줄 요약, 상세 표 3열 + 전폭 변화 줄 */
@media (max-width:1040px){
  .bp-row{grid-template-columns:1fr auto;gap:6px 10px;padding:12px 6px}
  .bp-strip::before{content:'0성 → 최대 ';font-size:12px;font-weight:600;color:var(--ink)}
  .bp-rec::before{content:'권장 ';font-size:12px;font-weight:600}
  .bp-low::before{content:'저과금 ';color:var(--ink)}
  .bp-min::before{content:'최소 추천 ';color:var(--ink)}
  .bp-src,.bp-typ,.bp-low,.bp-min,.bp-uts{display:none}
  .bp-row[aria-expanded="true"] .bp-src,.bp-row[aria-expanded="true"] .bp-typ,.bp-row[aria-expanded="true"] .bp-low,.bp-row[aria-expanded="true"] .bp-min,.bp-row[aria-expanded="true"] .bp-uts{display:block}
  .bp-row[aria-expanded="true"] .bp-uts{display:flex}
}
@media (max-width:560px){
  .bp-dtw{overflow:visible}
  .bp-detail table{min-width:0;display:block}
  .bp-detail tr{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:2px 10px;border-bottom:1px solid var(--tint);padding:6px 0}
  .bp-detail tr:first-child{display:none}
  .bp-detail td{border:0;padding:2px 0}
  .bp-detail td:nth-child(1)::before{content:'성급 ';font-size:12px;font-weight:600}
  .bp-detail td:nth-child(2)::before{content:'초당 계수 ';font-size:12px;font-weight:600}
  .bp-detail td:nth-child(3)::before{content:'증감 ';font-size:12px;font-weight:600}
  .bp-detail td:nth-child(4){grid-column:1/-1}
}
/* 포획 표(S-11): 끊기는 등급·새로 열리는 등급을 글자로(th 옆), 12px 본문색 */
.cap-cmp tr.gone th::after{content:'이 레벨부터 안 나옴';margin-left:6px;padding:1px 6px;border-radius:var(--r-pill);background:var(--tint);color:var(--ink);font-size:12px;font-weight:700;text-decoration:none;white-space:nowrap}
.cap-cmp tr.fresh th::after{content:'새로 나옴';margin-left:6px;padding:1px 6px;border-radius:var(--r-pill);background:var(--j-soft);color:var(--ink);font-size:12px;font-weight:700;white-space:nowrap}
.cap-cmp tr.gone th{text-decoration:line-through}
.cap-cmp tr.gone td,.cap-cmp .down,.cap-cmp tr.gone td.add{color:var(--ink)}
/* 검색 거르개 판 접기(S39-2): summary 에 상태 글자(펼치기/접기) + 화살 */
.sch-more>summary{cursor:pointer;list-style:none;font-size:var(--fs-14);font-weight:700;color:var(--ink);gap:6px}
.sch-more>summary::-webkit-details-marker{display:none}
.sch-more>summary::before{content:'▸';color:var(--ink)}
.sch-more[open]>summary::before{content:'▾'}
.sch-more>summary::after{content:'펼치기';font-weight:600;color:var(--ink);margin-left:auto}
.sch-more[open]>summary::after{content:'접기'}
.sch-more>summary b{font-weight:700}
.sch-more .sch-fbar{margin-top:var(--sp-2)}
@media (min-width:861px){.sch-more>summary{display:none}}   /* 861↑ 은 늘 펼친 판(접기 없음) */
/* 티어 배지(S25-2): '신규·평가 중' 12 */
.tbadge.tb-new{font-size:12px}
/* 상점 상세(S46-2): 가로 흔들림 제거 */
#smBody{overflow-x:hidden}
.ga-picks{margin:0;padding:0}
/* 모달 2택 가로 공통(D-09·S42-2·S43-2) */
.m-actions.row{flex-direction:row;gap:8px}
.m-actions.row>*{flex:1}
/* 포획(S15-2): 표 제목에 모수 */
.cap-col-head span{font-size:var(--fs-13)}
/* 티어메이커 트레이(S30-1·S57-1): 칩 고정 폭 격자 — 390 2열 · 1440 8열 */
.mk-trayrow{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
.mk-trayrow .tchip{min-width:0;width:100%;justify-content:flex-start}
@media (max-width:860px){.mk-trayrow{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 티어메이커 390(S30-1·S58-1): 빈 행 72, 트레이 접기 바 */
@media (max-width:860px){
  #mkBoard .trow{min-height:72px;padding:10px 0}
  .mk-tray.is-folded .mk-trayrow{display:none}
}
.mk-tray-fold{margin-left:auto;min-height:var(--touch-min);padding:0 12px;border:1px solid var(--line);border-radius:var(--r-8);background:var(--card);color:var(--ink);font-size:var(--fs-14);font-weight:600;cursor:pointer}
.mk-tray-head{align-items:center}
.mk-tray-head .mk-tray-t,.mk-tray-head .mk-tray-n{font-size:var(--fs-14)}
/* 성급 고르기 겹창(S59-1) */
.mk-grades{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:14px}
.mk-grades button{min-height:var(--touch-min);border:1px solid var(--line);border-radius:var(--r-8);background:var(--card);color:var(--ink);font-size:var(--fs-14);font-weight:700}
.mk-grades button.on{background:var(--pick-bg);border-color:var(--pick-bg);color:var(--pick-fg)}
/* 원시왕·일정 태그 크기 */
.pr-chip{font-size:var(--fs-14)}
.pr-chip b{font-size:var(--fs-14)}
/* 검색 결과 종류 배지(S40-3) */
.sch-cat{font-size:12px}
/* 뽑기 연출 토글(S05-2): 글자 버튼 */
#gaFxTog{font-size:var(--fs-13)}
/* 티어표 표 머리 세그 라벨(S24-1) */
.tier-head .tools-lb{font-size:var(--fs-14);color:var(--ink)}

/* ── 11-5. 2026-09-13 코덱스 재검증(66상태 × 4조건, P1 8·P2 12) 채택분 — 겹창 안·편성 채운 상태·p/li 밖 문장형·기호 라벨까지 3기준 예외 없음 ── */
/* 본문 14: 겹창 설명문(P1-4) + p/li 밖의 문장형 설명(P1-5: 효과 참고·카드 요약문·무기 방향 안내·칭호 조건·성급 효율 변화 내용·시작 버튼 설명·빈 행 안내) */
.ga-lad-sub,.bm-desc,.bm-period,.sk-ref,.sk-ref span,.aoe-dir,.tip-card-line,.dg-row .v,.bp-detail td,.bp-detail table,.mk-startdesc,.tempty{font-size:var(--fs-14)}
.bm-desc,.bm-period,.mk-startdesc,.tempty{color:var(--ink)}
.mk-startdesc{color:inherit;line-height:1.45}                          /* 시작 버튼 안(프라이머리 면 위 흰 글자 5.41 · 고스트 면 위 본문색) */
.bp-detail td:nth-child(4){line-height:1.5}
.dg-eff .v small{font-size:var(--fs-14);color:var(--ink)}                /* 꾸미기 '외형만 바뀝니다' — 문장형 */
.ga-fxtog.off{color:var(--ink);opacity:1}                              /* 연출 끔 상태: 흐리기 대신 글자(3.45 → 본문 대비) */
/* 금액 기준 겹창(P1-1·P2-9): 전체 켜기/끄기 44 · 상품 켜기/끄기는 button[aria-pressed] + 켬/끔 글자(흐리기 대신 글자와 색으로) */
.ga-pgrp{margin:var(--sp-3) 0 var(--sp-1);padding:0 4px}
.ga-pgrp h4{font-size:var(--fs-14);color:var(--ink)}
.ga-pgrp button{min-height:var(--touch-min);padding:0 14px;font-size:var(--fs-14);font-weight:700;color:var(--ink);border-radius:var(--r-8)}
/* 2026-09-16(#174): 이름 칸에 폭을 돌려준다 — 금액은 max-content 라 잘릴 일이 없고,
   남는 폭은 전부 이름이 쓴다. 14px 로 키운 뒤 긴 상품명이 Ⅰ·Ⅱ·Ⅲ 를 잘라먹고 있었다 */
.ga-pk{width:100%;text-align:left;font:inherit;border:0;background:transparent;color:inherit;min-height:var(--touch-min);grid-template-columns:auto minmax(0,1fr) max-content;gap:2px 6px;padding:7px 4px;transition:background var(--dur-1)}
.ga-pk:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
/* '켬/끔' 은 **글자 칸**이다. 탭 대상은 줄 전체(.ga-pk min-height:--touch-min, 실측 55px)라
   여기를 좁혀도 44px 규칙에 걸리지 않는다 */
.ga-pk .sw{grid-row:span 2;display:inline-flex;align-items:center;gap:6px;min-width:34px;font-size:12px;font-weight:700;color:var(--ink);font-style:normal}
.ga-pk .box{grid-row:auto}
.ga-pk .nm,.ga-pk .won{font-size:var(--fs-14)}
/* 상품 이름은 자르지 않는다(숨은 정보 0). viewer.css 의 nowrap+ellipsis 를 푼다 —
   verify_gacha_render '상품 이름이 안 잘린다' 가 지킨다 */
.ga-pk .nm{white-space:normal;overflow:visible;text-overflow:clip}
.ga-pk .meta,.ga-pk .per{font-size:12px;color:var(--ink)}
.ga-pk:not(.on){opacity:1}
.ga-pk:not(.on) .nm,.ga-pk:not(.on) .won,.ga-pk:not(.on) .meta,.ga-pk:not(.on) .per{color:var(--sub)}
/* 덱 편성 펫 선택 판(P1-2·P1-3·P2-5·P2-7): 이름 검색 44/14 · 파티 이동 칸 머리글자는 본문색 + 속성색 테두리 · 빈 칸 ＋ 는 보조색 4.5 이상 · 중첩 스크롤 없음(문서 스크롤, 보석 목록 S10-3 과 같은 규칙) · 이름 두 줄 허용 */
.fm-pf input{height:var(--ctl-h);font-size:var(--fs-14)}
.fm-pk2 .fm-pk.tam{color:var(--ink);border-color:var(--el);border-width:2px}
.fm-pk2 .fm-pk.tam:hover{color:var(--blue7)}
.fm-pk3 .fm-pk.free{opacity:1;color:var(--sub)}
.fm-pgrid{max-height:none;overflow:visible;padding:2px}
.fm-ponm{white-space:normal;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.25;overflow-wrap:anywhere;text-overflow:clip}
.fm-po.off .fm-ponm{color:var(--ink)}
/* 편성판 빈 자리 = 채운 자리와 같은 높이(P2-11): 빈 칸 두 줄의 세로 간격은 채운 quad 의 gap(7 · 560↓ 3), 이름 자리 여백은 .fm-c 이름줄(14/1.45 ≈ 18 + gap 4) */
.fm-mark{gap:7px}
.fm-mark i{margin-bottom:22px}
@media (max-width:560px){.fm-mark{gap:3px}}
/* 상점 거르개(S07-1 재지적): 861↑ 은 접힘 요약이 없으므로 갈래 판과 접힘 판이 한 판으로 보이게 이어 붙인다(사이 여백·선 없음). 860↓ 는 갈래 판 → 요약 44 → (열면) 판 */
@media (min-width:861px){
  #viewShop #shopFbar{margin-bottom:0;padding-bottom:0;border-bottom:0;border-radius:var(--r-16) var(--r-16) 0 0}
  #viewShop #shopMore:not([hidden]) .sch-fbar{margin-top:0;padding-top:0;border-top:0;border-radius:0 0 var(--r-16) var(--r-16)}
}
/* 티어메이커 빈 행(P2-6): 첫 빈 행 하나에만 14 본문색 한 줄, 카드를 골랐을 때는 '여기에 놓기'. 트레이의 '모든 항목을 배치했습니다' 는 그대로 */
.tempty{display:inline;line-height:1.4}
#mkBoard .trow:has(.tempty) ~ .trow .tempty{display:none}
#mkBoard .tempty .t-arm{display:none}
#mkBoard.has-sel .tempty .t-idle{display:none}
#mkBoard.has-sel .tempty .t-arm{display:inline;color:var(--blue7);font-weight:700}
/* 기호가 라벨인 곳(P2-7): 장식 별은 aria-hidden(뷰어 사본)이고 색은 4.5 이상 */
.bp-star{color:#C92A2A}
[data-theme="dark"] .bp-star{color:#FF7B7B}
.g-star{color:#8A5A00;text-shadow:none}
[data-theme="dark"] .g-star{color:#F5A524}
.g-av.ended .g-star{color:var(--sub)}
/* 공략 표 머리(P2-1 도구줄 높이 통일): 덱 편성 메타·티어메이커 분류 세그는 티어표 .tier-head 와 같은 부품. 메타만 있는 머리는 한 줄 */
.fm-head{min-height:0;margin:0 0 var(--sp-2)}
.mk-head{justify-content:flex-end}                                       /* 메타 없이 분류 세그만(390 한 줄 — 판 가시 영역 200 이상) */
/* 연구 페이지 띠(P2-10 부분 채택): 페이지 머리에 [이전 페이지] 'N / 25페이지' [다음 페이지] 44 — 도구줄 띠는 보조 선택기(가로 스크롤 유지) */
.rs-pager{display:flex;align-items:center;gap:var(--sp-2);margin-bottom:var(--sp-2)}
.rs-pager .num{font-size:var(--fs-14);font-weight:700;color:var(--ink);white-space:nowrap;flex:1 1 auto;text-align:center}
.rs-pager .ghost{padding:0 12px;min-height:var(--touch-min)}
.rs-pager .ghost:disabled{opacity:1;color:var(--sub);border-color:var(--line);cursor:default}


/* ═ v3 결 통일 BEGIN ═ */
/* v3: viewer.css의 화면별 강조·폭·행·상세 규칙을 공통 문법으로 덮습니다.
   범위는 .v3-scope의 본문과 .v3-modal입니다. .view-top·헤더의 위치와 크기는 유지합니다.
   등급 토큰의 공유 효과는 도감·뽑기에도 적용됩니다. 근거: GRAMMAR.md. */
.v3-scope{font-size:var(--fs-14);color:var(--ink)}
.v3-scope :is(.section-head,.j-picker-head,.cap-col-head,.cap-pair-top,.fm-head,.mk-tray-head){display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--sp-3);min-height:var(--touch-min);margin:0 0 var(--sp-2);padding:0;border:0}
.v3-scope :is(.section-head,.j-picker-head,.cap-col-head,.cap-pair-top,.fm-head,.mk-tray-head) :is(h3,.section-title,.cap-pair-label,.mk-tray-t){font-size:var(--fs-18);font-weight:var(--fw-700);line-height:var(--lh-tight);letter-spacing:var(--ls-title);color:var(--ink);white-space:normal;overflow:visible;text-overflow:clip;margin:0}
.v3-scope :is(.j-picker-head,.cap-col-head,.cap-pair-top)>span:not(.cap-pair-label){font-size:var(--fs-12);font-weight:var(--fw-600);color:var(--sub);line-height:var(--lh-normal)}
.v3-scope .j-picker-head[style]{padding-top:0!important;border-top:0!important}
/* v3: 필터는 접지 않고 같은 44px 칩과 8px 간격으로 노출합니다. */
.v3-scope .j-filters{display:block;border:0;border-bottom:1px solid var(--line);padding:0 0 var(--sp-4);margin:0 0 var(--sp-4)}
.v3-scope .j-filter-row{display:flex;align-items:flex-start;gap:var(--sp-3);padding:0;margin:0 0 var(--sp-2)}
.v3-scope .j-filter-row:last-child{margin-bottom:0}
.v3-scope .j-filter-label{flex:0 0 var(--touch-min);width:var(--touch-min);padding-top:var(--sp-3);font-size:var(--fs-12);font-weight:var(--fw-700);color:var(--ink)}
.v3-scope .j-filter-chips{display:flex;flex-wrap:wrap;gap:var(--sp-2);min-width:0}
.v3-scope :is(.j-filter-chips button,.cap-jump button,.chip){min-width:var(--touch-min);min-height:var(--touch-min);padding:0 var(--sp-3);border:1px solid var(--line);border-radius:var(--r-pill);background:var(--card);color:var(--ink);font-size:var(--fs-14);font-weight:var(--fw-700);line-height:var(--lh-normal);display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-1)}
.v3-scope :is(.j-filter-chips button,.cap-jump button,.chip):hover{background:var(--soft)}
.v3-scope :is(.j-filter-chips button,.cap-jump button,.chip).on{color:var(--pick-fg);border-color:var(--pick-bg);background:var(--pick-bg)}
.v3-scope .j-filter-chips button.g-pd:not(.on),.v3-scope .j-filter-chips button.g-un:not(.on){color:var(--ink)}
.v3-scope .dg-sep{width:100%;border-color:var(--line);margin:0;height:0}
/* v3: P1·P2의 본문 폭과 상세 폭. 높이는 내용만큼만 잡아 세로선을 늘리지 않습니다. */
.v3-scope :is(.body-split,.j-dex-layout,.tt-layout,.dg-layout,.rs-wrap,.fm-split){display:grid;grid-template-columns:minmax(0,1fr) var(--body-detail-w);gap:var(--sp-6);align-items:start;justify-content:stretch;margin:0}
.v3-scope :is(.j-surface,.jewel-list){border:0;background:var(--card)}
.v3-scope :is(.jewel-list,.jewel-detail,.tt-grid,.tt-detail,.dg-grid,.dg-plates,.dg-detail,.rs-main,.rs-side,.fm-left,.fm-right){min-width:0;padding:0;margin:0}
.v3-scope :is(.detail-panel,.jewel-detail,.tt-detail,.dg-detail,.rs-side,.fm-right){border:1px solid var(--line);border-radius:var(--r-16);padding:var(--sp-4);background:var(--card);height:auto;align-self:start;position:static;flex-basis:auto}
.v3-scope .detail-panel:empty{display:none}
.v3-scope :is(.detail-head,.j-detail-head,.dg-dtop,.rs-detail-h){display:flex;align-items:center;gap:var(--sp-4);padding:0 0 var(--sp-4);margin:0 0 var(--sp-4);border-bottom:1px solid var(--line)}
.v3-scope :is(.detail-head,.j-detail-head,.dg-dtop,.dg-dplate,.rs-head-t) :is(h3,b),.v3-scope .rs-detail-h b{font-size:var(--fs-18);font-weight:var(--fw-700);color:var(--ink);line-height:var(--lh-tight);margin:0}
.v3-scope :is(.detail-head,.j-detail-head,.dg-dtop) p{margin:var(--sp-1) 0 0;font-size:var(--fs-14);line-height:var(--lh-normal);color:var(--sub)}
.v3-scope :is(.j-icon.large,.dg-dtop .ic){width:var(--sp-10);height:var(--sp-10);flex:none;border-radius:var(--r-12)}
/* v3: 읽는 숫자는 본문색입니다. 화면 전용 인디고와 연구 분류색은 사용하지 않습니다. */
:is(.v3-scope,.v3-modal) :is(.num,.kv,.j-slot-summary,.t-cell,.t-odds,.cap-cmp,.tt-grow,.dg-eff,.rs-val,.rs-kpi,.rs-meta,.bp-strip,.bp-rec,.bp-low){font-variant-numeric:tabular-nums}
:is(.v3-scope,.v3-modal) :is(.kv,.j-stat-row,.tt-row,.dg-row){display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);min-height:var(--body-kv-h);padding:var(--sp-3) 0;border-bottom:1px solid var(--line);font-size:var(--fs-14);line-height:var(--lh-normal)}
:is(.v3-scope,.v3-modal) :is(.kv,.j-stat-row,.tt-row,.dg-row) :is(.k,.j-stat-name){font-size:var(--fs-14);color:var(--sub);font-weight:var(--fw-600)}
:is(.v3-scope,.v3-modal) :is(.kv,.j-stat-row,.tt-row,.dg-row) :is(.v,strong){font-size:var(--fs-14);font-weight:var(--fw-700);color:var(--metric-fg);text-align:right}
:is(.v3-scope,.v3-modal) .j-stat-list{display:block;margin-top:0!important}
.v3-scope .j-slot-summary{margin:0 0 var(--sp-4);border:1px solid var(--line);border-radius:var(--r-16);overflow:hidden;grid-template-columns:repeat(4,minmax(0,1fr))}
.v3-scope .j-slot-summary>div{padding:var(--sp-3) var(--sp-4);min-height:var(--body-kv-h);gap:var(--sp-3);border-color:var(--line)}
.v3-scope .j-slot-summary :is(span,b){font-size:var(--fs-14);line-height:var(--lh-normal)}
.v3-scope .j-slot-summary span{color:var(--sub)}
.v3-scope .j-slot-summary b{color:var(--metric-fg);font-weight:var(--fw-700)}
/* v3: .row 한 종. 긴 이름은 높이를 늘려 보존하고 선택 상태를 글자로 함께 표시합니다. */
.v3-scope :is(.jewel-row,.bp-row,.trow,.t-row){min-height:var(--body-row-h);padding:var(--sp-3) var(--sp-4);border:0;border-bottom:1px solid var(--line);border-radius:0;background:var(--card);font-size:var(--fs-14);line-height:var(--lh-normal);box-sizing:border-box}
.v3-scope :is(.jewel-row,.bp-row,.t-row):hover{background:var(--soft)}
.v3-scope :is(.jewel-row.sel,.bp-row[aria-expanded="true"]){background:var(--selection-bg);box-shadow:inset 2px 0 var(--selection-line)}
.v3-scope .jewel-row{width:100%;grid-template-columns:var(--sp-9) minmax(0,1fr) auto;gap:var(--sp-3);border-right:0;text-align:left}
.v3-scope :is(.jewel-row-copy b,.bp-pet){font-size:var(--fs-14);font-weight:var(--fw-700);color:var(--ink)}
.v3-scope .jewel-row-copy small{font-size:var(--fs-12);line-height:var(--lh-normal);color:var(--sub);white-space:normal}
.v3-scope .jewel-row-copy .jv{font-size:var(--fs-12);color:var(--metric-fg)}
.v3-scope .jewel-row-meta{gap:var(--sp-1);align-items:flex-end}
.v3-scope .jewel-row-meta small{font-size:var(--fs-12);color:var(--sub)}
.v3-scope .jewel-row.sel .jewel-row-meta::after{content:'선택됨';font-size:var(--fs-12);font-weight:var(--fw-700);color:var(--blue7)}
/* v3: 등급은 읽는 배지 한 벌입니다. 티어표의 빨강·주황·파랑 번호와 성급 파랑도 접습니다. */
:is(.v3-scope,.v3-modal) :is(.badge--grade,.j-grade,.gc,.tlab,.tmark,.tchip-g,.mk-grade,.rs-tier,.pn-tier){display:inline-flex;align-items:center;justify-content:center;min-width:var(--sp-7);height:var(--body-grade-h);padding:0 var(--sp-2);border:0;border-radius:var(--r-8);font-size:var(--fs-12);font-weight:var(--fw-700);line-height:var(--lh-normal);color:var(--grade-fg);background:var(--grade-bg);font-style:normal;box-sizing:border-box;opacity:1;white-space:nowrap}
.v3-scope .tlab{width:var(--touch-min);flex:none}
.v3-scope .tbadge{font-size:var(--fs-12);line-height:var(--lh-normal)}
.v3-scope :is(.tt-cell,.dg-cell,.dg-plate){position:relative;border:1px solid var(--line);border-radius:var(--r-16);background:var(--card);padding:var(--sp-3);gap:var(--sp-2);min-height:var(--touch-min);box-shadow:none;align-self:stretch}
.v3-scope :is(.tt-grid,.dg-grid){display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--body-grid-min),1fr));gap:var(--sp-2);padding:0}
.v3-scope :is(.tt-cell,.dg-cell,.dg-plate):hover{background:var(--soft)}
.v3-scope :is(.tt-cell,.dg-cell,.dg-plate)[aria-pressed="true"]{border-color:var(--selection-line);background:var(--selection-bg);box-shadow:inset 0 0 0 1px var(--selection-line)}
.v3-scope :is(.tt-cell,.dg-cell)[aria-pressed="true"]::after{content:'선택됨';font-size:var(--fs-12);color:var(--blue7);font-weight:var(--fw-700);display:block}
.v3-scope :is(.tt-cell,.dg-cell) :is(.nm,.val),.v3-scope .dg-tnm{font-size:var(--fs-14);font-weight:var(--fw-700);line-height:var(--lh-normal);color:var(--ink);white-space:normal;overflow:visible;text-overflow:clip}
.v3-scope .tt-cell .st{font-size:var(--fs-12);color:var(--sub);line-height:var(--lh-normal)}
.v3-scope .dg-chip{border:1px solid var(--line);background:var(--soft);padding:var(--sp-2) var(--sp-3);gap:var(--sp-2);border-radius:var(--r-8);min-height:var(--touch-min)}
.v3-scope .dg-chip :is(.k,.v,.n){font-size:var(--fs-12);color:var(--ink)}
.v3-scope .dg-chip.on{background:var(--pick-bg);border-color:var(--pick-bg)}
.v3-scope .dg-chip.on :is(.k,.v,.n){color:var(--pick-fg)}
.v3-scope .dg-sum{gap:var(--sp-2);padding:0;margin:0 0 var(--sp-4)}
.v3-scope .dg-eff{padding:var(--sp-3) 0;border-bottom:1px solid var(--line)}
.v3-scope .dg-eff .k{font-size:var(--fs-12);color:var(--sub);margin-bottom:var(--sp-2)}
.v3-scope .dg-eff .v,.v3-scope .tt-grow .v.max .n{font-size:var(--fs-24);font-weight:var(--fw-700);color:var(--metric-fg)}
.v3-scope .tt-grow .ar{background:var(--line)}
.v3-scope .tt-grow .ar::after{border-left-color:var(--line)}
.v3-scope .tt-grow .v .l{display:block;font-size:var(--fs-12);color:var(--sub)}
.v3-scope .tt-grow .v .n,.v3-scope .tt-per{font-size:var(--fs-14);color:var(--metric-fg)}
/* v3: 표의 값·머리·선은 같은 규격입니다. 데스크톱 열 비교와 모바일 라벨 반복을 함께 제공합니다. */
.v3-scope .t-wrap{overflow:visible;border:1px solid var(--line);border-radius:var(--r-16);background:var(--card)}
.v3-scope :is(.t-head,.t-row,.t-odds){min-width:0;padding:var(--sp-3) var(--sp-4);gap:var(--sp-2);border-color:var(--line)}
.v3-scope .t-head{min-height:var(--body-kv-h);background:var(--soft);border-radius:var(--r-16) var(--r-16) 0 0}
.v3-scope .t-name{gap:var(--sp-3)}
.v3-scope .t-name b{font-size:var(--fs-14);font-weight:var(--fw-700)}
.v3-scope :is(.t-cell strong,.t-cell.top strong,.t-odds .od b){font-size:var(--fs-14);color:var(--metric-fg);font-weight:var(--fw-700)}
.v3-scope :is(.t-cell small,.t-odds small){font-size:var(--fs-12);color:var(--sub);line-height:var(--lh-normal);overflow-wrap:anywhere}
.v3-scope .t-cell{padding:0;gap:var(--sp-1)}
.v3-scope .stat-ico{background:var(--sub);border-radius:var(--r-8);box-shadow:none}
.v3-scope :is(.t-head .g.out,.t-cell.out,.t-odds .od.out){opacity:1;color:var(--sub)}
.v3-scope .t-cell.out strong{color:var(--sub)}
.v3-scope :is(.cap-cmp,.bp-detail table,.rs-lvt){width:100%;border-collapse:collapse;font-size:var(--fs-14)}
.v3-scope :is(.cap-cmp,.bp-detail table,.rs-lvt) :is(th,td){border-color:var(--line);padding:var(--sp-3) var(--sp-2);font-size:var(--fs-14);line-height:var(--lh-normal)}
.v3-scope :is(.cap-cmp,.bp-detail table,.rs-lvt) th{font-size:var(--fs-12);color:var(--sub);font-weight:var(--fw-700)}
.v3-scope :is(.cap-cmp .up,.cap-cmp .add,.cap-cmp .down,.bp-low,.bp-star,.bp-detail .pos){color:var(--metric-fg)}
/* v3: 접기 상태를 글자로 표시합니다. summary 44px 전체가 실제 입력 영역입니다. */
:is(.v3-scope,.v3-modal) details>summary{position:relative;display:flex;align-items:center;flex-wrap:wrap;gap:var(--sp-2);min-height:var(--touch-min);margin:0;padding:var(--sp-2) 0;border:0;font-size:var(--fs-14);font-weight:var(--fw-700);line-height:var(--lh-normal);color:var(--ink);cursor:pointer;list-style:none;box-sizing:border-box}
:is(.v3-scope,.v3-modal) details>summary::-webkit-details-marker{display:none}
:is(.v3-scope,.v3-modal) details>summary::before{content:none}
:is(.v3-scope,.v3-modal) details>summary::after{content:'펼치기';margin-left:auto;color:var(--sub);font-size:var(--fs-12);font-weight:var(--fw-600)}
:is(.v3-scope,.v3-modal) details[open]>summary::after{content:'접기'}
.v3-scope :is(.cap-fold,.rs-pool-g,.bp-help){border-color:var(--line)}
.v3-scope .cap-fold>summary span{font-size:var(--fs-12);color:var(--sub)}
.v3-scope .rs-pool-g summary em{margin-left:auto;color:var(--ink);font-size:var(--fs-12)}
/* v3: 포획은 무대 조작 다음에 같은 카드·이름–값·표가 이어집니다. */
.v3-scope .cap-pick{padding:0;gap:var(--sp-4);margin:0}
.v3-scope .cap-lv .n{font-size:var(--fs-24);color:var(--metric-fg);font-weight:var(--fw-700)}
.v3-scope .cap-tiles{gap:var(--sp-2);margin:var(--sp-4) 0}
.v3-scope .cap-tile{border:1px solid var(--line);border-radius:var(--r-16);padding:var(--sp-4);background:var(--card)}
.v3-scope .cap-tile.on{border-color:var(--selection-line);background:var(--selection-bg)}
.v3-scope .cap-tile :is(.n,b){color:var(--metric-fg);font-size:var(--fs-18)}
.v3-scope .cap-pair{gap:var(--sp-6)}
.v3-scope .cap-col{padding:var(--sp-4);border:1px solid var(--line);border-radius:var(--r-16);min-width:0}
.v3-scope .cap-col-head{align-items:flex-start}
.v3-scope .cap-col-head h3{font-size:var(--fs-18)}
.v3-scope .cap-cmp tr.fresh th::after,.v3-scope .cap-cmp tr.gone th::after{background:var(--tint);color:var(--ink);white-space:normal}
/* v3: 연구의 좌표·연결선은 렌더러를 유지합니다. 노드 면과 상세는 공통 선택 문법입니다. */
.v3-scope .rs-node{background:var(--card);border-color:var(--line);border-radius:var(--r-16);box-shadow:none;color:var(--ink)}
.v3-scope .rs-node.on{background:var(--selection-bg);border-color:var(--selection-line);box-shadow:inset 0 0 0 1px var(--selection-line)}
.v3-scope .rs-node:hover{background:var(--soft)}
.v3-scope .rs-val{color:var(--metric-fg);font-size:var(--fs-12)}
.v3-scope .rs-nm{font-size:var(--fs-14);color:var(--ink);font-weight:var(--fw-700)}
.v3-scope .rs-lv{background:var(--tint);color:var(--ink);border-color:var(--line);font-size:var(--fs-12);border-radius:var(--r-8)}
.v3-scope .rs-meta{gap:var(--sp-2);margin:var(--sp-4) 0}
.v3-scope .rs-meta>span{background:var(--soft);border:1px solid var(--line);border-radius:var(--r-12);padding:var(--sp-3);font-size:var(--fs-14)}
.v3-scope .rs-meta :is(i,em){font-size:var(--fs-12);color:var(--sub)}
.v3-scope .rs-detail{padding:0;margin:0;border:0}
.v3-scope .rs-pool-row{min-height:var(--touch-min);gap:var(--sp-2);padding:var(--sp-2) 0;border-bottom:1px solid var(--line)}
.v3-scope .rs-pool-row b{white-space:normal;overflow:visible;font-size:var(--fs-14);line-height:var(--lh-normal)}
.v3-scope .rs-pool-row :is(span,em){font-size:var(--fs-12);color:var(--metric-fg)}
/* v3: 공략 표와 편집기의 항목은 같은 이름·값·칩 크기입니다. */
.v3-scope .tchip{min-height:var(--touch-min);border:1px solid var(--line);border-radius:var(--r-pill);padding:var(--sp-1) var(--sp-2) var(--sp-1) var(--sp-1);font-size:var(--fs-14);font-weight:var(--fw-700);gap:var(--sp-1);background:var(--card)}
.v3-scope .tchip:hover{background:var(--soft)}
.v3-scope .tchips{gap:var(--sp-2)}
.v3-scope .trow{gap:var(--sp-4);align-items:flex-start}
.v3-scope .tlab{margin-top:var(--sp-2)}
.v3-scope .tu-tools{gap:var(--sp-2);flex-wrap:wrap}
.v3-scope .seg--sm>button{min-width:calc(var(--touch-min) + 2px)}
.v3-scope .tier-head{margin-top:var(--sp-2);margin-bottom:var(--sp-2)}
.v3-scope .bp-head{padding:var(--sp-3) var(--sp-4);font-size:var(--fs-12);color:var(--sub);background:var(--soft);border-radius:var(--r-16) var(--r-16) 0 0}
.v3-scope .bp-list{border:1px solid var(--line);border-radius:var(--r-16)}
.v3-scope .bp-row{gap:var(--sp-3);cursor:pointer}
.v3-scope .bp-detail{padding:var(--sp-4);background:var(--soft);border-color:var(--line)}
.v3-scope .bp-tick.s1,.v3-scope .bp-tick.s2,.v3-scope .bp-tick.s3{background:var(--sub)}
.v3-scope .bp-uts .ut{font-size:var(--fs-12);background:var(--tint);color:var(--ink);padding:var(--sp-1);border-radius:var(--r-8)}
.v3-scope .fm-stage{border-radius:var(--r-16)}
.v3-scope .fm-panel-title,.v3-scope .fm-phead{font-size:var(--fs-18);font-weight:var(--fw-700);color:var(--ink)}
.v3-scope .fm-topt,.v3-scope .fm-po{border-color:var(--line);border-radius:var(--r-12);font-size:var(--fs-14)}
.v3-scope .fm-right .fm-pf{gap:var(--sp-2);margin-bottom:var(--sp-4)}
.v3-scope .mk-start{border:1px solid var(--line);border-radius:var(--r-16);padding:var(--sp-6);background:var(--card)}
.v3-scope .mk-start-t{font-size:var(--fs-18);font-weight:var(--fw-700)}
/* v3: 기존 하단 고정·내부 스크롤을 유지해야 트레이에서 판으로 실제 드래그할 수 있습니다. */
.v3-scope .mk-tray{position:sticky;bottom:0;z-index:var(--z-sticky);border-top:1px solid var(--line);padding:var(--sp-2) var(--sp-4) calc(var(--sp-2) + env(safe-area-inset-bottom));background:var(--card);margin-top:var(--sp-4)}
.v3-scope .mk-trayrow{overflow-y:auto;overflow-x:hidden;gap:var(--sp-2);grid-template-columns:repeat(6,minmax(0,1fr))}
/* v3: 설명·빈 결과·겹창의 읽기 규격은 한 벌입니다. */
:is(.v3-scope,.v3-modal) :is(.j-formula,.j-candidate-note,.rs-note,.bp-rules,.empty,.j-empty,.bp-empty,.mk-modal-sub,p){font-size:var(--fs-14);line-height:var(--lh-loose)}
:is(.v3-scope,.v3-modal) :is(.j-formula,.j-candidate-note,.rs-note){color:var(--ink);margin-top:var(--sp-4)}
:is(.v3-scope,.v3-modal) :is(.empty,.j-empty,.bp-empty){padding:var(--sp-7) var(--sp-4);color:var(--ink);text-align:center}
.v3-modal{border:1px solid var(--line);border-radius:var(--r-20);color:var(--ink);background:var(--card)}
.v3-modal h3{font-size:var(--fs-18);font-weight:var(--fw-700)}
.v3-modal :is(.j-detail-head,.dg-dtop){padding-bottom:var(--sp-4);border-color:var(--line)}
.v3-modal .j-detail-head h3{font-size:var(--fs-18);margin:var(--sp-1) 0}
.v3-modal :is(button,input,select){min-height:var(--touch-min);font-size:var(--fs-14)}
.v3-modal .pn-tier{color:var(--grade-fg);background:var(--grade-bg)}
.v3-scope :is(button,a,input,summary,[role="button"]):focus-visible{outline:2px solid var(--selection-line);outline-offset:2px}
/* v3: 모바일은 본문 자체의 가로 스크롤·감춘 열 없이 한 방향으로 읽습니다. */
@media(max-width:860px){
 .v3-scope :is(.body-split,.j-dex-layout,.tt-layout,.dg-layout,.rs-wrap,.fm-split){display:flex;flex-direction:column;gap:var(--sp-4)}
 .v3-scope :is(.body-split,.j-dex-layout,.tt-layout,.dg-layout,.rs-wrap,.fm-split)>*{width:100%;min-width:0}
 .v3-scope :is(.detail-panel,.jewel-detail,.tt-detail,.dg-detail,.rs-side,.fm-right){order:-1;padding:var(--sp-4);border:1px solid var(--line);border-radius:var(--r-16)}
 .v3-scope .jewel-list{max-height:none;overflow:visible}
 .v3-scope :is(.tt-grid,.dg-grid){grid-template-columns:repeat(3,minmax(0,1fr))}
 .v3-scope .dg-plates{grid-template-columns:minmax(0,1fr)}
 .v3-scope .j-slot-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
 .v3-scope .j-slot-summary>div{flex-wrap:wrap;border-bottom:1px solid var(--line);border-right:1px solid var(--line)}
 .v3-scope .j-slot-summary>div:nth-child(2n){border-right:0}
 .v3-scope .j-slot-summary>div:nth-last-child(-n+2){border-bottom:0}
 .v3-scope .t-wrap{width:100%;overflow:visible}
 .v3-scope .t-head{display:flex;flex-wrap:wrap;gap:var(--sp-2);min-width:0;width:100%;padding:var(--sp-3)}
 .v3-scope .t-head>span:first-child{width:100%;background:transparent}
 .v3-scope :is(.t-row,.t-odds){display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important;min-width:0;width:100%;gap:var(--sp-3);padding:var(--sp-3);background:var(--card)}
 .v3-scope :is(.t-name,.t-odds .lb){grid-column:1/-1;position:static!important;min-height:var(--touch-min);width:100%;border-bottom:1px solid var(--line);padding-bottom:var(--sp-2)}
 .v3-scope :is(.t-cell,.t-odds .od){position:relative;align-items:flex-start;display:flex;flex-direction:column;gap:var(--sp-1);text-align:left;min-width:0;padding:var(--sp-2);background:var(--soft);border-radius:var(--r-8)}
 .v3-scope :is(.t-cell,.t-odds .od)::before{content:attr(data-grade);font-size:var(--fs-12);font-weight:var(--fw-700);color:var(--grade-fg);line-height:var(--lh-normal)}
 .v3-scope .t-name b{font-size:var(--fs-14)}
 .v3-scope .jewel-row{padding:var(--sp-3) var(--sp-2);gap:var(--sp-2);grid-template-columns:var(--sp-8) minmax(0,1fr) auto}
 .v3-scope .jewel-row .j-icon{width:var(--sp-8);height:var(--sp-8)}
 .v3-scope .cap-pair{grid-template-columns:minmax(0,1fr);gap:var(--sp-4)}
 .v3-scope .cap-col{padding:var(--sp-3)}
 .v3-scope .cap-pick{flex-wrap:wrap}
 .v3-scope .cap-jump{display:flex;flex-wrap:wrap;gap:var(--sp-2)}
 .v3-scope .cap-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
 .v3-scope .rs-meta{flex-wrap:wrap}
 .v3-scope .rs-meta>span{min-width:0;flex:1 1 0}
 .v3-scope .rs-pool-row{flex-wrap:wrap}
 .v3-scope .rs-pool-row b{flex-basis:calc(100% - var(--sp-8))}
 .v3-scope .rs-pool-row span{margin-left:var(--sp-7)}
 .v3-scope .trow{padding:var(--sp-3) 0;gap:var(--sp-2)}
 .v3-scope .tchip{max-width:100%;flex-wrap:wrap}
 .v3-scope .bp-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-2);padding:var(--sp-3)}
 .v3-scope .bp-row :is(.bp-src,.bp-typ,.bp-low,.bp-min,.bp-uts){display:block;font-size:var(--fs-12);white-space:normal;overflow:visible}
 .v3-scope .bp-row .bp-uts{display:flex;grid-column:1/-1}
 .v3-scope .bp-row .bp-strip{grid-column:1/-1;flex-wrap:wrap}
 .v3-scope .bp-row .bp-typ::before{content:'유형 ';font-weight:var(--fw-700)}
 .v3-scope .bp-row .bp-src::before{content:'획득처 ';font-weight:var(--fw-700)}
 .v3-scope .bp-head{display:flex;flex-wrap:wrap;gap:var(--sp-2);padding:var(--sp-3)}
 .v3-scope .bp-detail tr{grid-template-columns:minmax(0,1fr);padding:var(--sp-3) 0;gap:var(--sp-2)}
 .v3-scope .bp-detail td{font-size:var(--fs-14);padding:0;overflow-wrap:anywhere}
 .v3-scope .mk-trayrow{grid-template-columns:repeat(2,minmax(0,1fr))}
 .v3-scope .mk-trayrow .tchip{border-radius:var(--r-12)}
 .v3-scope .mk-start{padding:var(--sp-4)}
}
/* v3: 스캔에서 44px 경계의 반 픽셀 적중이 흔들린 칩은 48px 공통 입력 높이로 보증합니다. */
.v3-scope :is(.j-filter-chips button,.cap-jump button,.chip){min-height:var(--body-chip-h)}
/* v3: 항목을 바꿔도 행 높이가 흔들리지 않게 선택 글자 자리를 예약합니다. */
.v3-scope .jewel-row-meta::after{content:'';display:block;min-height:calc(var(--fs-12) * 1.5);font-size:var(--fs-12);line-height:var(--lh-normal)}
.v3-scope :is(.tt-cell,.dg-cell,.dg-plate)::after{content:'';display:block;min-height:calc(var(--fs-12) * 1.5);font-size:var(--fs-12);line-height:var(--lh-normal)}
.v3-scope :is(.tt-cell,.dg-cell,.dg-plate)[aria-pressed="true"]::after{content:'선택됨';color:var(--blue7);font-weight:var(--fw-700)}
.v3-scope .rs-node.on::after{content:'선택됨';position:absolute;top:calc(0px - var(--sp-3));right:var(--sp-2);background:var(--selection-bg);color:var(--blue7);border:1px solid var(--selection-line);border-radius:var(--r-8);padding:0 var(--sp-1);font-size:var(--fs-12);line-height:var(--lh-normal)}
/* v3: 편성의 이동 버튼도 44px 실제 입력 영역을 서로 겹치지 않게 보증합니다. */
.v3-scope .fm-pk2 .fm-pk{min-width:calc(var(--touch-min) + 2px)}
/* v3: 공유 등급 체계의 기존 별칭입니다. 대상 밖에서는 색만 바꾸고 배치는 유지합니다. */
.fx-modal .card.ss .band{background:var(--grade-ss-bg);color:var(--grade-ss-fg)}
/* v3: 38px 이동 격자가 44px 버튼을 겹치게 하던 원인을 열 폭에서 해결합니다. */
.v3-scope .fm-pk2{grid-template-columns:repeat(2,var(--body-chip-h));gap:var(--sp-2)}
.v3-scope .fm-pk3{grid-template-columns:repeat(3,var(--body-chip-h));gap:var(--sp-2)}
.v3-scope :is(.fm-pk2,.fm-pk3) .fm-pk{min-width:var(--body-chip-h);min-height:var(--body-chip-h);height:var(--body-chip-h)}
/* v3: 이미 편성된 조련사도 이름과 파티를 읽어야 하므로 글자에 opacity를 쓰지 않습니다. */
.v3-scope .fm-topt.off{opacity:1;background:var(--soft)}
.v3-scope .fm-topt .fm-tnm{font-size:var(--fs-14)}
.v3-scope .fm-topt.off :is(.fm-tnm,.fm-tsub,.fm-tst){color:var(--sub)}
.v3-scope .fm-topt.off .fm-tface{opacity:.5}
.v3-scope .dg-plate :is(.nm,.val){font-size:var(--fs-14);white-space:normal;overflow:visible;text-overflow:clip}
/* v3(이식 260913): viewer.css 의 다크 등급 규칙([data-theme="dark"] .j-grade.jg-sss 등, 특이도 0,3,0)이 위 공통 배지 규칙(0,2,0)을 이겨
   다크에서 SSS 가 보라(#9C80EF)·SS 가 주황으로 남던 것(내 재현 관문 darkprobe). 다크에서도 등급 배지 한 벌. */
:root[data-theme="dark"] :is(.v3-scope,.v3-modal) :is(.badge--grade,.j-grade,.gc,[class^="gc-"],[class*=" gc-"],.tlab,.tmark,.tchip-g,.mk-grade,.rs-tier,.pn-tier){color:var(--grade-fg);background:var(--grade-bg)}
/* v3-2(2026-09-13 사용자 "왼쪽의 세로띠가 너무 싫어"): 고른 행·현재 행의 왼쪽 안쪽 선(inset box-shadow)을 전부 없앤다 — 고름은 옅은 파랑 면 + "선택됨" 글자, 현재 일정은 "진행 중" 배지가 말한다. 라이브 규칙(.jewel-row.sel 3px · .vrow.sel/.rail.sel 2px · .w-tier-row.on 3px)까지 덮는다 */
.v3-scope :is(.jewel-row.sel,.bp-row[aria-expanded="true"]),.jewel-row.sel,.w-tier-row.on,.vrow.sel,.rail.sel{box-shadow:none}
/* ═ v3 결 통일 END ═ */


/* ═ v4 컴팩트 BEGIN ═ */
/* 2026-09-13 사용자 피드백(DECISIONS #112~#114): 시각 크기는 라이브(세그 칸 32·칩 32·버튼·입력 40·작은 세그 칸 26), 입력 사각형은 44 —
   보이지 않는 ::after 가 위아래를 늘린다(가로는 그대로). 목록 행·summary·카드·티어 칩은 시각 44 이상이라 그대로. 값은 전부 토큰. */
.seg>button,.seg>a,.chip,.toolbar .chip,.j-filter-chips button,.cap-jump button,.dg-chip,.sch-chip,.schip,.fm-chip,.fm-ride,.tip-category-filter button,.ga-lv button,.j-gacha-slot button,.j-auto-grades button,#statusFilter button,
.ghost,.hd .ghost,.tl-today,.tl-arrow,.sch-reset,.theme-tg,#btnSearch,.empty-act,.mk-tray-fold,.rs-pager .ghost,.ga-pgrp button,.ga-run button,.ga-odds,.mk-grades button,.mtxt,.mok,.fm-pk2 .fm-pk,.fm-pk3 .fm-pk{position:relative}
.seg>button::after,.seg>a::after,.chip::after,.toolbar .chip::after,.j-filter-chips button::after,.cap-jump button::after,.dg-chip::after,.sch-chip::after,.schip::after,.fm-chip::after,.fm-ride::after,.tip-category-filter button::after,.ga-lv button::after,.j-gacha-slot button::after,.j-auto-grades button::after,#statusFilter button::after,
.ghost::after,.hd .ghost::after,.tl-today::after,.tl-arrow::after,.sch-reset::after,.theme-tg::after,#btnSearch::after,.empty-act::after,.mk-tray-fold::after,.rs-pager .ghost::after,.ga-pgrp button::after,.ga-run button::after,.ga-odds::after,.mk-grades button::after,.mtxt::after,.mok::after,.fm-pk2 .fm-pk::after,.fm-pk3 .fm-pk::after{content:'';position:absolute;left:0;right:0;top:calc((var(--touch-min) - 100%) / -2);bottom:calc((var(--touch-min) - 100%) / -2)}
/* 세그: 트랙 40·칸 32(라이브). 줄바꿈 세그는 줄 사이 12(확장 ±6 비겹침) */
.seg.av-tier>button,.seg.tu-seg>button{min-height:calc(var(--seg-h) - 2*var(--seg-pad))}
.grade-row .seg>button{height:calc(var(--seg-h) - 2*var(--seg-pad))}
.seg.av-tier,.seg.tu-seg,.grade-row .seg{row-gap:calc(var(--touch-min) - (var(--seg-h) - 2*var(--seg-pad)) + 2px)}   /* 14: 확장 ±6 이 아랫줄과 경계에서 겹치지 않게 */
.ga-lv{padding:var(--seg-pad)}
.ga-lv button{min-height:calc(var(--seg-h) - 2*var(--seg-pad))}
.tu-tools .tu-seg>button{min-height:calc(var(--seg-h) - 2*var(--seg-pad))}
/* 작은 세그(표 머리 콘텐츠·과금): 트랙 32·칸 26·12px/700 */
.seg.seg--sm{height:var(--ctl-h-sm);padding:var(--seg-pad-sm)}
.seg.seg--sm>button,.seg.seg--sm>a,.tier-head .seg--sm>button,#tierGradeSeg>button,#modeSeg>button,#tierContentSeg>button{min-height:0;height:calc(var(--ctl-h-sm) - 2*var(--seg-pad-sm))}
.v3-scope .seg--sm>button{min-width:var(--touch-min)}
.tier-head{min-height:var(--ctl-h)}
/* 칩: 시각 32·줄 사이 12 */
.toolbar .chip,.sch-chip,.j-filter-chips button,.cap-jump button,.dg-chip,.schip,.fm-chip,.fm-ride,.tip-category-filter button,.j-gacha-slot button,.j-auto-grades button,#statusFilter button,.toolbar .tip-category-filter button{min-height:var(--chip-h);height:var(--chip-h)}
.v3-scope :is(.j-filter-chips button,.cap-jump button,.chip){min-height:var(--chip-h);height:var(--chip-h)}
.v3-scope .dg-chip{min-height:var(--chip-h);height:auto}
.v3-scope .j-filter-chips,.j-filter-chips,.filter-panel,.filter-group,.dg-sum,.cap-jump,.sch-fg,.tu-tools{row-gap:var(--sp-3)}
.v3-scope .j-filter-label{padding-top:calc((var(--chip-h) - var(--fs-12) * 1.5) / 2)}
/* 버튼·입력: 시각 40 */
.hd .ghost,.theme-tg,#btnSearch{height:var(--ctl-h)}
.theme-tg,#btnSearch{width:var(--ctl-h)}
.mtxt,.empty-act,.mk-tray-fold,.rs-pager .ghost,.ga-pgrp button,.ga-run button,.ga-odds,.mk-grades button{min-height:var(--ctl-h)}
.ga-run button{padding:0}
.v3-modal :is(button,select){min-height:var(--ctl-h)}
.v3-modal input:not([type=range]){min-height:var(--ctl-h)}
.tu-q,.m-in input,.fm-lvin{height:var(--ctl-h)}
.m-in{min-height:calc(var(--ctl-h) + 2px)}
.m-f select,.m-f input[type=date],.ga-pick select,.ga-pick .ga-sel,select{min-height:var(--ctl-h)}
.v3-scope .fm-pk2{grid-template-columns:repeat(2,var(--ctl-h))}
.v3-scope .fm-pk3{grid-template-columns:repeat(3,var(--ctl-h))}
.v3-scope :is(.fm-pk2,.fm-pk3) .fm-pk{min-width:var(--ctl-h);min-height:var(--ctl-h);height:var(--ctl-h)}
.v3-scope .fm-pk2 .fm-pk{min-width:var(--ctl-h)}
.section-head,.v3-scope :is(.section-head,.j-picker-head,.cap-col-head,.cap-pair-top,.fm-head,.mk-tray-head){min-height:var(--ctl-h)}
/* 펫 머리(#113·#114): 배지 줄 한 높이(칩 32) · 860↓ 는 [그림 | 이름·별명·한 줄] 뒤에 배지 줄이 전폭 한 줄 가로 스크롤(줄바꿈 없음), 넘치면 오른쪽 페이드 단서(.is-more) */
.pet-badges{gap:var(--sp-2)}
.pet-badges :is(.badge,.badge.sm,.chip,.no){height:var(--chip-h);display:inline-flex;align-items:center;padding:0 var(--sp-3);font-size:var(--fs-13);font-weight:600;border-radius:var(--r-pill);white-space:nowrap;flex:none;letter-spacing:0}
.pet-badges .no{color:var(--sub);padding-left:0}
@media (max-width:860px){
  .pet-head{grid-template-areas:"badges badges" "vis name" "vis title" "vis copy" "src src";align-items:start}   /* 860↓ 무대 묶음: 배지 줄(전폭, 맨 위 — 260914 사용자 "칩이 위로 와야지") → [그림 | 이름·별명·한 줄] → 획득처 */
  .pet-name{margin-top:0}
  .pet-title,.pet-copy{margin-top:var(--sp-1)}
  .pet-badges{grid-area:badges;margin:0 0 var(--sp-3);flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px 0}
  .pet-badges>*{box-sizing:border-box}   /* 260914 "칩의 상단이 잘린다": .badge.ev 의 padding 3px 가 content-box 로 38px 가 돼 32px 줄에서 위가 잘렸다 */
  .pet-badges::-webkit-scrollbar{display:none}
  .pet-badges.is-more{mask-image:linear-gradient(90deg,black calc(100% - var(--sp-7)),transparent)}
  .pet-badges.is-past{mask-image:linear-gradient(90deg,transparent,black var(--sp-7))}
  .pet-badges.is-more.is-past{mask-image:linear-gradient(90deg,transparent,black var(--sp-7),black calc(100% - var(--sp-7)),transparent)}
}
/* 확장(::after)이 잘리지 않게: 세그 칸의 overflow:hidden(글자 자르기는 안 쓴다)·도구줄 거르개 영역의 overflow 는 순서 띠(연구 25칸·포획 점프)에만 */
.seg>button,.seg>a,.grade-row .seg button{overflow:visible;text-overflow:clip}
.toolbar-filters{overflow:visible}
.toolbar-filters:has(>.rs-chips),.toolbar-filters:has(>.cap-jump){overflow-x:auto;overflow-y:hidden}
/* 칩 줄 사이 = 44 − 32 + 2 = 14(확장 ±6 이 위아래 줄과 1px 도 안 겹치게). 거르개 묶음 사이도 같게 */
.v3-scope .j-filter-chips,.j-filter-chips,.filter-panel,.filter-group,.dg-sum,.cap-jump,.sch-fg,.tu-tools{row-gap:calc(var(--touch-min) - var(--chip-h) + 2px)}
.v3-scope .j-filter-row{margin:0 0 calc(var(--touch-min) - var(--chip-h) + 2px)}
.v3-scope .j-filter-row:last-child{margin-bottom:0}
.pet-badges :is(.badge,.badge.sm,.chip,.no){min-height:var(--chip-h)}
/* 칩이 줄바꿈하는 다른 자리(장비 세트 .setrow · 편성 패널 · 검색 거르개 · 상태 거르개 등)도 줄 사이 14 — :has() 로 칩 컨테이너를 잡는다 */
.setrow,.fm-pf,.tu-tools,#statusFilter,:is(div,nav,span,p):has(> .schip),:is(div,nav,span,p):has(> .fm-chip),:is(div,nav,span,p):has(> .fm-ride),:is(div,nav,span,p):has(> .sch-chip),:is(div,nav,span,p):has(> .dg-chip),:is(div,nav,span,p):has(> .chip:not(.el)){row-gap:calc(var(--touch-min) - var(--chip-h) + 2px)}
/* 정사각 아이콘 버튼(검색·테마·월 이동 40×40)은 가로도 늘려 44×44 */
.theme-tg::after,#btnSearch::after,.tl-arrow::after{left:calc((var(--touch-min) - 100%) / -2);right:calc((var(--touch-min) - 100%) / -2)}
/* 꾸미기 합계 알약(.dg-sum .dg-chip)·포획 점프 칩(.cap-jump) 컨테이너의 v3 gap 8 을 이긴다(같은 특이도, 뒤) — 줄 사이 14, 알약 시각 32 */
.v3-scope .dg-sum,.v3-scope .cap-jump,.v3-scope .j-filter-chips{row-gap:calc(var(--touch-min) - var(--chip-h) + 2px)}
.v3-scope .dg-chip{min-height:var(--chip-h);height:var(--chip-h);padding:0 var(--sp-3)}
/* 2겹 세그 칸 최소 폭 46: 폭이 정확히 44 면 중앙 ±21.5 지점이 옆 칸 경계(반픽셀)에 걸린다(검사 20(d) 11011). 라벨 + 좌우 패딩은 그대로 */
.toolbar-filters>.seg>button,.toolbar-filters>.seg>a,.tier-head .seg>button,.seg.seg--sm>button,.seg.seg--sm>a,.v3-scope .seg--sm>button{min-width:calc(var(--touch-min) + 2px)}
/* 줄바꿈하는 칩·세그 컨테이너의 줄 간격 = 입력 사각형(44)이 겹치지 않는 값: 칩 32 → 14, 작은 세그 칸 26 → 20. 검색 칩 줄(.sch-fg-chips)·표 머리 도구(860↓ 두 줄) */
.sch-fg-chips{row-gap:calc(var(--touch-min) - var(--chip-h) + 2px)}
.sch-fg-chips.clip{max-height:calc(var(--chip-h) * 2 + var(--touch-min) - var(--chip-h) + 2px)}
@media (max-width:860px){
  .sch-fg-chips.clip{max-height:var(--chip-h)}
  .tier-head .section-tools{row-gap:calc(var(--touch-min) - (var(--ctl-h-sm) - 2*var(--seg-pad-sm)) + 2px)}
  .tier-head{row-gap:calc(var(--touch-min) - (var(--ctl-h-sm) - 2*var(--seg-pad-sm)) + 2px)}
}
/* 뿌리 규칙: 칩(32) 버튼을 직접 자식으로 가진 줄바꿈 컨테이너는 전부 줄 사이 14 — 컨테이너를 하나씩 열거하지 않는다(게시판 분류 칩·검색 칩 줄 등). clip 상태의 검색 칩 줄은 아래 줄이 잘려 있어도 확장이 겹치지 않게 같은 값 */
:is(div,nav,span,p,section):has(> button.sch-chip),:is(div,nav,span,p,section):has(> button.tip-filter),.toolbar-chips,.tip-category-filter,.sch-fg-chips,.dg-sum,.setrow,.j-filter-chips{row-gap:calc(var(--touch-min) - var(--chip-h) + 2px)!important}
.sch-fg-chips.clip{max-height:calc(var(--chip-h) * 2 + (var(--touch-min) - var(--chip-h) + 2px))}
/* 확장(::after)이 이웃 형제·부모 경계 밖에서도 먼저 잡히게: 컨트롤 자체를 z-index 1 로 올린다(같은 층의 형제보다 앞). 검색 칩 줄(clip)은 overflow 를 가로만 잘라 세로 확장이 살게 하고 위아래 여백으로 시각 높이를 보전 */
.seg>button,.seg>a,.chip,.toolbar .chip,.j-filter-chips button,.cap-jump button,.dg-chip,.sch-chip,.schip,.fm-chip,.fm-ride,.tip-category-filter button,.ga-lv button,.j-gacha-slot button,.j-auto-grades button,#statusFilter button,.ghost,.hd .ghost,.tl-today,.tl-arrow,.sch-reset,.theme-tg,#btnSearch,.empty-act,.mk-tray-fold,.rs-pager .ghost,.ga-pgrp button,.ga-run button,.ga-odds,.mk-grades button,.mtxt,.mok,.fm-pk2 .fm-pk,.fm-pk3 .fm-pk{z-index:1}
/* 고른 칸을 더 위로 올리지 않는다 — 줄바꿈 세그에서 아랫줄 고른 칸의 확장이 윗줄 칸의 확장을 덮는다(검사 11110 by button.on) */
.sch-fg-chips.clip{overflow:clip;overflow-clip-margin:0;padding:6px 0;margin:-6px 0;max-height:calc(var(--chip-h) * 2 + (var(--touch-min) - var(--chip-h) + 2px) + 12px)}
@media (max-width:860px){ .sch-fg-chips.clip{max-height:calc(var(--chip-h) + 12px)} }
/* 줄바꿈하는 세그(뽑기 레벨 7칸 등)도 줄 사이 14 */
.ga-lv{row-gap:calc(var(--touch-min) - (var(--seg-h) - 2*var(--seg-pad)) + 2px)}
/* 겹창 안 버튼(전체 끄기 등)의 확장이 겹창 본문에 가려지지 않게 · 편성 이동 칸(정사각 40)은 좌우도 확장 */
.v3-modal .ga-pgrp button,.modal .ga-pgrp button{position:relative;z-index:1}
.fm-pk2 .fm-pk::after,.fm-pk3 .fm-pk::after{left:calc((var(--touch-min) - 100%) / -2);right:calc((var(--touch-min) - 100%) / -2)}
.fm-pk2,.fm-pk3{gap:calc(var(--touch-min) - var(--ctl-h) + 2px)}
/* 스크롤 컨테이너 안의 칩·버튼: 확장(::after)이 컨테이너 밖으로 못 나가므로 컨테이너에 위아래 안쪽 여백 = 확장분(칩 6 · 버튼 2)을 주고 바깥 여백으로 상쇄해 시각 높이 불변(게시판 분류 칩 줄 overflow:auto · 금액 기준 겹창 상품 목록 .ga-picks) */
.toolbar .tip-category-filter,.toolbar-chips{padding-top:calc((var(--touch-min) - var(--chip-h)) / 2);padding-bottom:calc((var(--touch-min) - var(--chip-h)) / 2);margin-top:calc((var(--touch-min) - var(--chip-h)) / -2);margin-bottom:calc((var(--touch-min) - var(--chip-h)) / -2)}
.ga-picks{padding-top:calc((var(--touch-min) - var(--ctl-h)) / 2);padding-bottom:calc((var(--touch-min) - var(--ctl-h)) / 2)}
/* 검색 결과 줄 효과 태그(#117): 읽는 배지 한 벌 — 등급 배지와 같은 회색 면·본문색·24·8 라운드·12/700. 종류별 5색(빨·주·초·청·보) 폐기, "외 N개" 잘림 폐기(전부 표시). 묶음 라벨 12/600 --sub */
.sch-tags{display:flex;flex-direction:column;gap:var(--sp-1);align-items:flex-start}
.sch-tg{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-1)}
.sch-tg-lb{font-size:var(--fs-12);font-weight:600;color:var(--sub);margin-right:var(--sp-1);white-space:nowrap;min-width:52px}
.sch-tag,.sch-tag.cc,.sch-tag.deb,.sch-tag.buff,.sch-tag.surv,.sch-tag.sp,.sch-tag.imm,.sch-tag.res,.sch-tag.rest{display:inline-flex;align-items:center;height:var(--body-grade-h);padding:0 var(--sp-2);border-radius:var(--r-8);font-size:var(--fs-12);font-weight:700;line-height:1;color:var(--grade-fg);background:var(--grade-bg);white-space:nowrap}
/* 2026-09-14 사용자 "같은 계열로 색들이 있어줘야": 모양은 한 벌, 색은 효과 톤 토큰 쌍(대비 4.5 통과) — 행동 방해 빨강 · 적 약화 주황 · 아군 강화 초록 · 생존 청록. 특수·면역·저항은 중립(6차에서 톤 폐지) */
.sch-tag.cc{background:var(--tone-cc-bg);color:var(--tone-cc-fg)}
.sch-tag.deb{background:var(--tone-deb-bg);color:var(--tone-deb-fg)}
.sch-tag.buff{background:var(--tone-buff-bg);color:var(--tone-buff-fg)}
.sch-tag.surv{background:var(--tone-surv-bg);color:var(--tone-surv-fg)}
.sch-row{align-items:start}
.sch-rp{align-self:center}
@media (max-width:860px){ .sch-tg-lb{min-width:0} }
/* 검색 거르개 "N개 모두" 텍스트 버튼도 입력 사각형 44(::after 확장) */
.sch-fg-more{position:relative;z-index:1;margin-top:calc((var(--touch-min) - var(--chip-h)) / 2 + 2px);min-height:var(--ctl-h);display:inline-flex;align-items:center}   /* 윗줄 칩의 아래 확장(6)과 겹치지 않게 띄우고, 버튼 시각 40 */
.sch-fg-more::after{content:'';position:absolute;left:calc((var(--touch-min) - 100%) / -2);right:calc((var(--touch-min) - 100%) / -2);top:calc((var(--touch-min) - 100%) / -2);bottom:calc((var(--touch-min) - 100%) / -2)}   /* 시각 40 + 위아래 2 = 44(margin-top 이 윗줄 칩 확장과 띄운다) */
/* ═ v4 컴팩트 END ═ */

/* ═ 12. 260914 사용자 피드백(배포 직후 게시판 검토) — 줄바꿈·폭·표·형광펜·초점 규칙 ═
   ① "4글자 살리려고 줄바꿈하지 말 것": 문단은 칸 폭을 다 쓰고, 마지막 줄이 짧게 남지 않게 text-wrap:pretty. 낱말 안에서 끊지 않는다(keep-all).
      문단 측정폭은 80ch(한글 약 44자) — 62ch 는 넓은 화면에서 좁고 고아 줄을 만들었다.
   ② 글 칸(.tips-board-detail) 880 → 1040: 1440 화면에서 오른쪽이 비지 않게, 1080 화면에서는 페이지 폭에 맞춰 꽉 찬다.
   ③ "표가 의미 없이 넓어질 필요 없다": 표 폭은 내용대로(width:auto), 넘치면 100% 까지. 셀 가로 여백은 조금 넓혀 붙어 보이지 않게.
   ④ "하이라이팅은 글자 전체": 형광펜은 글자 상자 전체를 칠한다(아래 절반만 칠하던 규칙 폐지).
   ⑤ "네모박스가 딱 달라붙어": 항목 초점 상자는 내용에서 10px 띄우고 모서리를 둥글게. */
.tip-p,.board-item-body,.tips-lead,.board-sec-lead,.tip-note-body{max-width:none;text-wrap:pretty;word-break:keep-all;overflow-wrap:anywhere}
/* ⑥ 사용자가 보인 이상형(개발자 노트): 문장마다 한 줄, 덩어리 사이는 빈 줄. 긴 문장만 칸 폭에서 접힌다. */
.sn{display:block}
.board-sec-lead .sn,.board-item-body .sn{display:block}
.board .tips-board-detail{max-width:1040px}
.tips-table{width:auto;max-width:100%}
.tip-reader-body .tip-table-shell{width:fit-content;max-width:100%}   /* 표 껍데기(위·아래 선)도 표 폭에 맞춘다 */
.tips-table th,.tips-table td{padding-left:var(--sp-5);padding-right:var(--sp-5)}
.tips-table th:first-child,.tips-table td:first-child{padding-left:var(--sp-4)}
.tip-hl{background:var(--hl);padding:0 3px;border-radius:3px}
.board-item{scroll-margin-top:calc(var(--hd-h, 96px) + var(--sp-5))}
.board-item:focus{outline:2px solid var(--blue);outline-offset:10px;border-radius:10px}   /* 둥근 모서리는 초점일 때만(위 구분선이 휘어 보이지 않게) */
.board-item:focus:not(:focus-visible){outline:2px solid var(--blue);outline-offset:10px;border-radius:10px}
@media (max-width:860px){
  .board-item:focus,.board-item:focus:not(:focus-visible){outline-offset:6px}
}


/* ── 13. 후원 계좌 (2026-09-15, DECISIONS #146) — 헤더 [후원] → 후원 계좌 모달. 시안 public/mockups/donate-g2.html · donate-mobile.html ── */
.hd .hd-give{padding:0 12px}                                              /* 861↑ 고스트: svg 16 · gap 8 · 글자 "후원" */
@media (max-width:860px){
  /* 윗줄(로고·검색·다크·보정)에 하나 더 넣으면 로고가 잘린다(실측 390: 21px · 360: 51px). 그리드 칸을 새로 내면 그 열이 윗줄 폭까지 먹으므로
     탭 줄(nav 영역) 오른쪽 끝에 겹쳐 놓고, 탭 목록에는 아이콘 폭만큼 오른쪽 여백을 준다. 탭 5칸 280(#9) + 40 = 320 → 360 에서 딱 맞고, 320 은 원래대로 가로 스크롤 */
  #btnGive{grid-area:nav;justify-self:end;align-self:center;z-index:1}
  .hd-nav{padding-right:40px}
  .hd .hd-give span{display:none}
  .hd .hd-give{width:var(--ctl-h);height:var(--ctl-h);padding:0;display:inline-flex;align-items:center;justify-content:center}
  .hd .hd-give svg{width:18px;height:18px;display:block}
  .hd .hd-give::after{left:calc((var(--touch-min) - 100%) / -2);right:calc((var(--touch-min) - 100%) / -2)}   /* 아이콘 40 → 입력 사각형 44×44(§11-3 의 .theme-tg 와 같은 규칙. a11y 390 실측에서 40×40 으로 걸려 추가) */
}
.dn-how{margin-top:6px;font-size:var(--fs-14);color:var(--sub);line-height:1.6}
.dn-rows{margin:var(--sp-4) 0 0;border:1px solid var(--line);border-radius:var(--r-12);overflow:hidden}
.dn-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);min-height:48px;padding:10px 16px;margin:0}
.dn-row+.dn-row{border-top:1px solid var(--line)}
.dn-row dt{font-size:var(--fs-14);font-weight:var(--fw-600);color:var(--sub);flex:none}
.dn-row dd{margin:0;font-size:var(--fs-15);font-weight:var(--fw-700);color:var(--ink);text-align:right;word-break:keep-all}
.dn-row.dn-acct dd{font-size:var(--fs-20);letter-spacing:.02em}           /* 계좌번호는 크게 — 보고 옮겨 적는 숫자 */
.m-actions .dn-alt{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;background:var(--card);color:var(--ink);border:1px solid var(--line)}   /* 보조 버튼 = .mk-alt 와 같은 모양(a 요소라 별도 선언) */
.m-actions .dn-alt:hover{background:var(--soft)}
.m-actions .dn-app{display:none}                                          /* 카카오페이·토스 앱 버튼은 손 기기에서만. PC 는 카카오페이 링크 404·토스 링크 무반응이라 복사만 */
@media (pointer:coarse){.m-actions .dn-app{display:inline-flex}}
