/* 칸 제목 · 장 제목은 유나체(--lt-hand, 사장님 11/13 「제목에 쓰는 게 마음에 든다」), 본문은 Pretendard.
   11/13 3차 · 섞은 흐름(reports/2026-11-13-신규캐릭터/2차/콜라보-뼈대.md ★ 최종 기준).
   결제 전 본문을 비연(용용 진행) 흐름으로: 장 표시 → 웹툰 컷 + 용용 말풍선 → 부품 → 결제 후 공개.
   모양 · 크기 · 위치 값은 wt-nc-yy line_yy(line-yy.css · nc-yy.css)의 웹툰 컷 · 말풍선 · 장 표시 · POINT · 담긴 것에서 가져왔다(그쪽 파일은 그대로).
   글꼴은 Pretendard(본문) · 유나체(손글씨 칸)만, 색은 상품 강조색 토큰(--lt-accent · --lt-accent-ink), 단색만(그라데이션은 그림 경계 녹임에만). */
.lt-prepay{--yy-strong:#fff4f1;--yy-text:rgba(255,242,240,.9);--yy-sub:rgba(255,242,240,.62);--yy-rule:rgba(255,242,240,.16);--yy-panel:#1d1718}

/* ── 웹툰 컷(용용 bridge · first_cut): 화면 폭, 아래 · 위 끝을 바탕색으로 녹임 ── */
.lt-prepay .lt-yc{position:relative;margin:0 var(--lt-bleed);padding:0}
.lt-yc-art{position:relative;overflow:hidden}
.lt-yc-art .lt-media,.lt-yc-art .lt-slot{display:block;width:100%;height:100%;object-fit:cover;border:0;border-radius:0}
.lt-yc-art::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:30%;pointer-events:none;background:linear-gradient(transparent,var(--lt-page,#141414))}
.lt-yc-art::before{content:'';position:absolute;z-index:1;left:0;right:0;top:-1px;height:10%;pointer-events:none;background:linear-gradient(var(--lt-page,#141414),transparent)}
.lt-yc-art.is-missing{display:none}
html.lt-tags .lt-yc-art.is-missing{display:block}
.lt-yc-says{position:absolute;inset:0;z-index:2;pointer-events:none}
/* 말풍선(용용 D4): 흰 α.9 타원 · 지름 116~150 · 꼬리 없음 · 검은 15/500 · 가운데 자리 % (양 끝 81px · 위아래 84px 안으로) */
.lt-yb{position:absolute;left:clamp(81px,calc(var(--x) * 1%),calc(100% - 81px));top:clamp(84px,calc(var(--y) * 1%),calc(100% - 84px));transform:translate(-50%,-50%);
  margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:max-content;max-width:150px;min-width:116px;min-height:116px;
  padding:16px 18px;border-radius:50%;background:rgba(255,255,255,.9);color:#161214;text-align:center;text-wrap:balance;word-break:keep-all;
  font:500 15px/1.5 var(--lt-sans);letter-spacing:-.02em;box-shadow:0 10px 28px rgba(0,0,0,.35)}
.lt-yb span{display:block}
.lt-yb.is-ask{max-width:164px;font:400 18px/1.4 var(--lt-hand)}
/* 그림 없는 컷: 컷을 접고 말풍선만 한 줄(좌우로), 큰 빈 상자 없음 */
.lt-yc.is-folded{padding:28px 16px 8px}
.lt-yc.is-empty{display:none}
html.lt-tags .lt-yc.is-empty{display:block}
.lt-yc.is-folded .lt-yc-says{position:static;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:12px 8px}
.lt-yc.is-folded .lt-yb{position:static;transform:none}
.lt-yc.is-folded .lt-yb+.lt-yb{margin-top:40px}
.lt-yasks.is-folded .lt-yc-says{flex-direction:column}
.lt-yasks.is-folded .lt-yb:nth-child(even){align-self:flex-end}
.lt-yasks.is-folded .lt-yb+.lt-yb{margin-top:-18px}
/* 첫 컷 위 큰 글씨(용용 D2: 28/800 lh 1.3, 마지막 줄 강조색) */
.lt-yc-over{position:relative;z-index:2;margin:0;padding:84px 22px 0;text-align:center;font:800 min(28px,7.2vw)/1.3 var(--lt-sans);letter-spacing:-.03em;color:var(--yy-strong);text-shadow:0 2px 14px rgba(0,0,0,.6)}
.lt-yc-over span{display:block}
.lt-yc-over .is-em{color:var(--lt-accent-ink)}
.lt-yc.is-folded .lt-yc-over{padding:84px 22px 8px}
/* 첫 컷: 큰 글씨를 그림 위 칸에 두고 그림은 그 아래로 살짝 겹쳐(얼굴을 글씨가 덮지 않게) */
.lt-yc.has-over{display:flex;flex-direction:column}
.lt-yc.has-over .lt-yc-over{order:-1}
.lt-yc.has-over .lt-yc-art{margin-top:-28px}
@keyframes lt-yb-in{from{opacity:0;transform:translate(-50%,calc(-50% + 14px))}to{opacity:1;transform:translate(-50%,-50%)}}
.lt-yc:not(.is-folded) .lt-yb{animation:lt-yb-in .42s ease both}
.lt-yc:not(.is-folded) .lt-yb+.lt-yb{animation-delay:.38s}
.lt-yc:not(.is-folded) .lt-yb+.lt-yb+.lt-yb{animation-delay:.76s}
@media (prefers-reduced-motion:reduce){.lt-yc .lt-yb{animation:none!important}}
.lt-yanswer{margin:18px 22px 0;text-align:center;font:700 20px/1.5 var(--lt-sans);letter-spacing:-.02em;color:var(--yy-strong)}

/* ── 장 표시(용용 D5 · D6): 가로줄 + 마름모 + 번호 22 + 장 이름 14/600, 제목 24/800 둘째 줄 강조색 ── */
.lt-ych{padding:64px 0 24px;text-align:center}
.lt-ych-mark{display:flex;align-items:center;gap:10px;margin:0 0 22px}
.lt-ych-rule{position:relative;flex:1;height:1px;background:var(--yy-rule)}
.lt-ych-rule::after{content:'';position:absolute;top:-2px;right:-2px;width:5px;height:5px;border-radius:50%;background:var(--lt-accent-ink)}
.lt-ych-seal+.lt-ych-rule::after{right:auto;left:-2px}
.lt-ych-seal{display:flex;flex-direction:column;align-items:center;min-width:64px;color:var(--lt-accent-ink)}
.lt-ych-seal .lt-ico{width:14px;height:14px;margin-bottom:6px}
.lt-ych-seal b{font:800 22px/1.1 var(--lt-sans);letter-spacing:.02em}
.lt-ych-seal span{margin-top:4px;font:600 14px/1.3 var(--lt-sans);letter-spacing:.12em}
.lt-ych h2{margin:0;padding:0 12px;font:400 min(28px,7.2vw)/1.35 var(--lt-hand);letter-spacing:-.03em;color:var(--yy-strong);word-break:keep-all}
.lt-ych h2 span{display:block}
.lt-ych h2 .is-em{color:var(--lt-accent-ink)}

/* 결제 후 공개 알약(용용 D7) */
.lt-ylock{display:flex;align-items:center;justify-content:center;gap:6px;width:max-content;margin:22px auto 8px;padding:9px 16px;border-radius:999px;background:#2a2224;border:1px solid var(--yy-rule);
  font:700 14px/1.2 var(--lt-sans);color:var(--yy-text)}
.lt-ylock .lt-ico{width:15px;height:15px;color:var(--lt-accent-ink)}

/* 설명 한 줄(용용 D9: 15/1.75) */
.lt-ytext{margin:14px 16px 0}
.lt-ytext p{margin:0;font:400 15px/1.75 var(--lt-sans);color:var(--yy-text);word-break:keep-all}

/* 끊는 말(용용 D19: 22/800, 둘째 줄 강조색) */
.lt-ybig{margin:72px 0 0;text-align:center}
.lt-ybig p{margin:0;font:800 22px/1.5 var(--lt-sans);letter-spacing:-.02em;color:var(--yy-strong)}
.lt-ybig span{display:block}
.lt-ybig .is-em{color:var(--lt-accent-ink)}

/* ── 16 전체 풀이에 담긴 것(용용 nc_contents · 청월당 번호 규칙) ── */
.lt-ycon{margin:56px 0 0;padding:20px 18px 8px;border:1px solid var(--yy-rule);border-radius:14px;background:var(--yy-panel)}
.lt-ycon h2{margin:0 0 10px;text-align:center;font:400 25px/1.35 var(--lt-hand);color:var(--yy-strong)}
.lt-ycon ol{margin:0;padding:0;list-style:none}
.lt-ycon li{display:grid;grid-template-columns:30px 1fr;gap:8px;align-items:baseline;padding:12px 0;border-top:1px solid rgba(255,255,255,.08)}
.lt-ycon li:first-child{border-top:0}
.lt-ycon li b{font:800 16px/1.4 var(--lt-sans);color:var(--lt-accent-ink)}
.lt-ycon li span{font:600 15px/1.5 var(--lt-sans);color:var(--yy-text);word-break:keep-all}
.lt-ycon li.is-hid{align-items:center}
.lt-ycon-bar{display:block;height:12px;width:78%;border-radius:6px;background:rgba(220,140,148,.32);filter:blur(4px)}
.lt-ycon li.is-hid:nth-child(even) .lt-ycon-bar{width:62%}
.lt-ycon-more{margin:0;padding:12px 0 10px;border-top:1px solid rgba(255,255,255,.08);text-align:center;font:600 14px/1.4 var(--lt-sans);color:var(--yy-sub)}

/* ── 비연 상세 목차 카드(장 그림 위쪽 + CHAPTER 0N + 장 제목 + 풀이 줄) ── */
.lt-ytoc{display:grid;gap:16px;margin:40px 0 0}
.lt-ytoc-card{overflow:hidden;border:1px solid var(--yy-rule);border-radius:14px;background:var(--yy-panel)}
.lt-ytoc-art{position:relative;aspect-ratio:346/300;overflow:hidden}
.lt-ytoc-art .lt-media{width:100%;height:100%;object-fit:cover;object-position:50% 18%;border:0;border-radius:0}
.lt-ytoc-art::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:40%;background:linear-gradient(transparent,var(--yy-panel))}
.lt-ytoc-body{padding:14px 18px 16px}
.lt-ytoc-no{display:flex;justify-content:space-between;align-items:center;margin:0 0 4px;font:700 14px/1.3 var(--lt-sans);letter-spacing:.12em;color:var(--lt-accent-ink)}
.lt-ytoc-no .lt-ico{width:14px;height:14px}
.lt-ytoc h2{margin:0 0 8px;font:400 24px/1.3 var(--lt-hand);color:var(--yy-strong)}
.lt-ytoc ol{margin:0;padding:0;list-style:none}
.lt-ytoc li{display:flex;gap:10px;align-items:baseline;padding:10px 0;border-top:1px solid rgba(255,255,255,.08);font:500 15px/1.5 var(--lt-sans);color:var(--yy-text)}
.lt-ytoc li b{flex:none;font:700 14px/1.5 var(--lt-sans);color:var(--lt-accent-ink)}
.lt-ytoc li.is-hid{align-items:center}
.lt-ytoc li .lt-bar{flex:1;display:block;height:12px;border-radius:6px;background:rgba(220,140,148,.3);filter:blur(4px)}

/* ── 15 POINT(용용 nc_points: POINT 0N 14/800 강조색 · 제목 24/800 · 설명 15 · 카드 r14 · 「예시 화면」) ── */
.lt-points.is-yy{margin:40px 0 0}
.lt-pt{margin:56px 0 0;text-align:center}
.lt-pt-no{margin:0 0 8px;font:800 14px/1.4 var(--lt-sans);letter-spacing:.14em;color:var(--lt-accent-ink)}
.lt-pt-title{margin:0;font:400 min(28px,7.2vw)/1.35 var(--lt-hand);letter-spacing:-.02em;color:var(--yy-strong);word-break:keep-all}
.lt-pt-title span{display:block}
.lt-pt-sub{margin:10px 0 18px;font:400 15px/1.6 var(--lt-sans);color:var(--yy-sub);word-break:keep-all}
.lt-pt-art{overflow:hidden;border-radius:14px}
.lt-pt-art .lt-media{display:block;width:100%;border:0}
/* 그림이 오기 전: 아이보리 카드 + 아이콘 하나 + 항목 이름 + 회색 막대(용용 POINT 그림 속 카드와 같은 짜임, HTML) */
.lt-pt-card{display:flex;flex-direction:column;align-items:center;gap:14px;padding:22px 18px 16px;border-radius:14px;background:var(--lt-paper,#f2ece2);color:var(--lt-paper-ink,#3a3330)}
.lt-pt-ico{width:44px;height:44px;color:var(--lt-accent)}
.lt-pt-card ul{align-self:stretch;margin:0;padding:0;list-style:none}
.lt-pt-card li{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;padding:11px 2px;border-top:1px solid rgba(58,51,48,.12);text-align:left}
.lt-pt-card li:first-child{border-top:0}
.lt-pt-card li span{font:700 15px/1.4 var(--lt-sans)}
.lt-pt-bar{display:block;height:12px;border-radius:6px;background:#d9d1c6}
.lt-pt-note{margin:8px 0 0;font:400 14px/1.4 var(--lt-sans);color:var(--yy-sub)}
.i-chat{--i:url("../line_tight/icons/ph-chat-circle-dots-fill.c82940aecf16.svg")}
.i-swap{--i:url("../line_tight/icons/ph-arrows-left-right-bold.e1255159beb1.svg")}
.i-user{--i:url("../line_tight/icons/ph-user-fill.9a0354bd95a4.svg")}
.i-cal{--i:url("../line_tight/icons/ph-calendar-heart-fill.38c1cd71db91.svg")}
.i-warn{--i:url("../line_tight/icons/ph-warning-circle-duotone.5080c3553adf.svg")}
.i-diamond{--i:url("../line_tight/icons/ph-diamond-fill.d5fb12c34023.svg")}
.i-lock{--i:url("../line_tight/icons/ph-lock-key-fill.912d8a1756aa.svg")}

/* 장 안 부품 사이 간격: 컷 다음 부품이 컷 녹임 위로 살짝 올라오게(비연 리듬) */
.lt-prepay .lt-yc+.lt-blk:not(.lt-ych):not(.lt-yc){margin-top:4px}

/* 결제 전 본문 공통 p 행간(result-reading 1.85)이 말풍선 · 큰 글씨까지 벌려 놓지 않게 */
.lt-prepay p.lt-yb{line-height:1.45}
.lt-prepay p.lt-yb.is-ask{line-height:1.3}
.lt-prepay p.lt-yc-over{line-height:1.3}
.lt-prepay .lt-ybig p{line-height:1.5}
.lt-prepay p.lt-pt-sub{line-height:1.6}
.lt-prepay p.lt-yanswer{line-height:1.5}
.lt-prepay p.lt-ylock{line-height:1.2}

/* 본문 안쪽 칸 좌우 여백(결제 전 본문 여백이 좁아 화면 끝에 붙던 것) */
.lt-prepay .lt-ycon,.lt-prepay .lt-ytoc{margin-left:16px;margin-right:16px}
.lt-prepay .lt-pt{padding:0 16px}
.lt-prepay .lt-fit{margin-left:16px;margin-right:16px}
/* 목차 카드 그림: 카드 틀을 꽉 채운다(위쪽 빈 띠 X) */
.lt-ytoc-art .lt-media{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto!important}
/* POINT 묶음 첫 칸 위 여백(장 카드 바로 다음 빈 공간 줄임) */
.lt-points.is-yy{margin-top:0}
.lt-points.is-yy .lt-pt:first-child{margin-top:48px}

/* 11/14 재회 타사 항목(studio/reunion_tt.py) ─ 결제 전: 목차 장 머리 · 끌림/부딪힘 개수 · 마음 다섯 칸 */
.lt-ycon-ch{display:flex;align-items:baseline;gap:8px;margin:18px 0 2px;padding:12px 0 0;border-top:1px solid var(--yy-rule);font:700 17px/1.4 var(--lt-sans);letter-spacing:-.02em;color:var(--yy-strong);word-break:keep-all}
.lt-ycon h2+.lt-ycon-ch{margin-top:6px;padding-top:0;border-top:0}
.lt-ycon-ch b{flex:none;font:800 15px/1.4 var(--lt-sans);color:var(--lt-accent-ink)}
.lt-ttpair{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 22px 0}
.lt-ttpair div{display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 8px;border:1px solid var(--yy-rule);border-radius:12px;background:var(--yy-panel)}
.lt-ttpair span{font:600 14px/1.3 var(--lt-sans);color:var(--yy-sub)}
.lt-ttpair b{font:800 24px/1.2 var(--lt-sans);color:var(--yy-strong)}
.lt-ttleft{margin:26px 22px 0;padding:18px 14px;border:1px solid var(--yy-rule);border-radius:14px;background:var(--yy-panel)}
.lt-ttleft h3{margin:0 0 14px;text-align:center;font:700 17px/1.4 var(--lt-sans);color:var(--yy-strong);word-break:keep-all}
.lt-ttleft ol,.rg-scale{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin:0;padding:0;list-style:none}
.lt-ttleft li,.rg-scale li{display:flex;align-items:center;justify-content:center;min-height:44px;padding:4px 2px;border-radius:8px;background:rgba(255,255,255,.06);text-align:center;font:600 14px/1.25 var(--lt-sans);color:var(--yy-sub);word-break:keep-all}
.lt-ttleft li.is-on{background:var(--lt-accent);color:#fff;font-weight:800}

/* 결과: 장 머리 · 칸 */
.rg-tt-ch{margin:56px 0 8px;padding:24px 0 0;border-top:1px solid var(--rg-cell-line, rgba(255,255,255,.14));text-align:center}
.rg-tt-ch p{margin:0 0 4px;font:800 15px/1.3 var(--lt-sans);color:var(--lt-accent-ink)}
.rg-tt-ch h2{margin:0;font:400 min(28px,7.4vw)/1.35 var(--lt-hand);letter-spacing:-.02em;color:var(--rg-ink);word-break:keep-all}
.rg-tt-ch--img{padding-top:0;border-top:0}
.rg-tt-ch-img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;margin:0 0 18px;border-radius:4px}
.rg-tt-badge{display:inline-block;margin:2px 0 10px;padding:6px 12px;border-radius:8px;background:var(--rg-chip);font:700 15px/1.3 var(--lt-sans);color:var(--rg-ink)}
.rg-scale{margin:8px 0 14px}
.rg-scale li{background:var(--rg-chip);color:var(--rg-sub)}
.rg-scale li.is-on{background:var(--lt-accent);color:#fff;font-weight:800}
.rg-tt-quote{margin:10px 0 12px;padding:14px 16px;border-radius:12px;background:var(--rg-chip);font:600 16px/1.6 var(--lt-sans);color:var(--rg-ink);word-break:keep-all}
.rg-tt-rows div.is-on{outline:2px solid var(--lt-accent-ink);outline-offset:-2px}
.rg-tt-rows div.is-on dd{font-weight:800}
.rg-tt-block.is-on{border:2px solid var(--lt-accent-ink);border-radius:12px;padding:12px 14px}
.rg-tt-rows+p,.rg-tt-block+p{margin-top:14px}
/* 11/14 리포트 미리보기(blocks/strips.html): 용용 띠 콜라주처럼 그림은 화면 폭, 말풍선은 .lt-yb 그대로, 숫자만 강조색 */
.lt-prepay .lt-strips{margin:72px 0 0;text-align:center}
.lt-strips-label{margin:0 0 6px;font:700 14px/1.4 var(--lt-sans);letter-spacing:.12em;color:var(--lt-accent-ink)}
.lt-strips h2{margin:0 0 18px;font:400 25px/1.35 var(--lt-hand);color:var(--yy-strong)}
.lt-prepay .lt-strips-fig{position:relative;margin:0 var(--lt-bleed)}
.lt-strips-fig img{display:block;width:100%;height:auto}
.lt-strips .lt-yb b{font-weight:700;color:var(--lt-accent)}
.lt-strips h2 b{font-weight:inherit;color:var(--lt-accent-ink)}   /* 11/15 제목 상품 부분 강조(신규 셋 · 개편 띠와 같게) */
.lt-strips-note{margin:14px 0 0;font:400 14px/1.5 var(--lt-sans);color:var(--yy-sub)}
