/* ==========================================================================
   토픽 T-14 fat(지방은 옮기기도, 줄이기도 합니다) 전용 모양 — 한 겹 둘(.um-* · 단면 · 몸 도식) + 몸 도식 이름표 한 줄 + 글 전체의 표     topics/fat.css   W-107
   - 8_시안/D_합본형/지방.html 의 <style> 가운데 한 겹 모양(.um-* · topics/breast.css · lower-lid.css 와 같은 글자)과 W-107 이 더한 두 가지를 옮긴 것.
     ① 몸 도식 이름표(엔진의 오른쪽 여백 글자)가 카드가 작을 때 두 줄로 꺾이지 않게 ② 글 전체(페이지 글 · 원장님 글)의 표가 좁은 화면에서 페이지를 옆으로 넘치게 하지 않게.
   - 이 토픽이 쓰인 페이지에서만 inc/assets.php 가 부름(breast.css 와 같은 까닭 — sect.css 는 사본이라 못 고치고 player.css 에 넣으면 모든 토픽이 바뀜).
   ========================================================================== */
/* ---- W-44 단면 한 겹(.um-sect) — 얼굴 그림 위에 덮는 한 겹. 색 · 글자 크기는 03 토큰만(남색 · 구릿빛 · 종이색 · 1.0625rem / 1.125rem) ---- */
.um-sect { position: absolute; inset: 0; background: #f4f0ea; opacity: 0; visibility: hidden; transition: opacity .45s ease, visibility 0s linear .45s; pointer-events: none; }
.um-sect.is-on { opacity: 1; visibility: visible; transition: opacity .45s ease, visibility 0s; }
.um-sect.is-quick, .um-sect.is-quick.is-on { transition: none; }
.um-box { position: absolute; overflow: hidden; border-radius: 16px; background: #fbf9f4; box-shadow: 0 6px 22px rgba(22,41,74,.14); }
.um-inner { position: absolute; }
.um-over { position: absolute; display: block; overflow: visible; }
.um-lab { position: absolute; left: 0; top: 0; transform: translateY(-50%); padding: 2px 8px; border-radius: 8px; white-space: nowrap; font-size: 1.0625rem; line-height: 1.3; font-weight: 800; color: #16294a; background: rgba(255,255,255,.92); opacity: 0; visibility: hidden; }
.um-lab.is-on { visibility: visible; }
@media (min-width: 1024px) { .um-lab { font-size: 1.125rem; } }
@media (prefers-reduced-motion: reduce) { .um-sect, .um-sect.is-on { transition: none; } }
/* ---- W-107 몸 도식 이름표 — 「재배치·이식」이 두 줄로 꺾이지 않게(글자 크기는 엔진 그대로) ---- */
.um-sect .sx-label { white-space: nowrap; }
/* ---- W-107 글 전체의 표 — 표만 안에서 밀림(페이지는 옆으로 넘치지 않음) · 선은 --line 토큰 ---- */
.dx-all .dx-tbl, .dx-all .wp-block-table { margin: 10px 0 12px; overflow-x: auto; }
.dx-all .dx-tbl table, .dx-all .wp-block-table table { width: 100%; border-collapse: collapse; font-size: 1rem; line-height: 1.5; }
.dx-all .dx-tbl th, .dx-all .dx-tbl td, .dx-all .wp-block-table th, .dx-all .wp-block-table td { border: 1px solid var(--line, #ddd6c9); padding: 6px 8px; text-align: left; vertical-align: top; }
.dx-all .dx-tbl th, .dx-all .wp-block-table th { background: var(--warm, #f6f3ed); color: var(--navy, #16294a); }
/* ---- W-107 글 전체의 작은 머리글(원장님 글의 5.1 · Q1~Q3) — 글 전체에는 h5 모양이 없어 16px 아래로 작아지지 않게(h4 보다 한 단계 작게) ---- */
.dx-all h5 { margin: 12px 0 4px; font-size: 1.0625rem; color: var(--navy, #16294a); }
/* W-107 완료 */
