/* GMC B2C 사이트 실측 토큰 (assets.joongang.co.kr/css/gmc/b2c/*.min.css, 2026-10-02) */
:root{
  --bg:#FFFFFF; --card:#F6F5FA; --line:#E2E2E2; --line2:#DFDFDF;
  --ink:#000000; --ink2:#333333; --sub:#999999; --mut:#BCBCBC;
  --lime:#D3FF30; --lime-ink:#9CC600; --dark:#111111; --foot:#272727;
  --r:8px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:#E9E9EE;font-family:'Pretendard',sans-serif;letter-spacing:-0.02em;color:var(--ink)}
.phone{width:390px;background:var(--bg);position:relative;overflow:hidden}
/* 사이트 헤더 그대로 */
.hd{height:56px;display:flex;align-items:center;gap:14px;padding:0 16px}
.hd .burger{width:20px;height:14px;border-top:2px solid #000;border-bottom:2px solid #000;position:relative}
.hd .burger:after{content:"";position:absolute;left:0;right:0;top:4px;border-top:2px solid #000}
.hd img{height:17px}
.hd .sp{margin-left:auto}
.hd svg{width:22px;height:22px;stroke:#000;fill:none;stroke-width:2}
.pagehd{padding:10px 16px 0}
.pagehd h1{font-size:24px;font-weight:700;letter-spacing:-0.03em}
.pagehd p{font-size:13px;color:var(--sub);margin-top:4px}
.chips{display:flex;gap:6px;padding:16px 16px 12px;overflow:hidden}
.chip{font-size:13px;padding:7px 13px;border-radius:100px;background:var(--card);color:var(--ink2);white-space:nowrap}
.chip.on{background:var(--ink);color:#fff;font-weight:600}
.feed{padding:0 16px 24px;display:flex;flex-direction:column;gap:8px}
/* 불판 — 화면 유일한 다크·라임 강조 */
.bulpan{background:var(--dark);color:#fff;border-radius:var(--r);padding:14px 14px 13px 16px}
.bp-row{display:flex;align-items:center;gap:8px}
.live{width:7px;height:7px;border-radius:50%;background:var(--lime);flex:none}
.bp-title{font-size:16px;font-weight:700}
.bp-cnt{font-size:11px;color:#999}
.cta{margin-left:auto;background:var(--lime);color:#000;font-weight:700;font-size:12px;padding:6px 12px;border-radius:100px;white-space:nowrap}
.bp-host{font-size:13px;line-height:1.45;margin-top:8px;color:#ddd}
.bp-host b{color:var(--lime);font-weight:600;margin-right:4px}
/* 글 카드 (= 브리핑 목록 카드 문법) */
.post{background:var(--card);border-radius:var(--r);padding:14px 14px 12px 16px}
.who{display:flex;align-items:center;gap:7px;font-size:13px}
.av{width:28px;height:28px;border-radius:50%;background:#fff;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--ink2);flex:none}
.writer .av{background:#000;color:var(--lime);border-color:#000}
.name{font-weight:700}
.badge{font-size:10px;font-weight:700;letter-spacing:0;color:#fff;background:#000;padding:2px 7px;border-radius:100px}
.lv{font-size:11px;color:var(--sub);display:inline-flex;align-items:center;gap:3px}
.li{width:15px;height:15px;flex:none}
.time{color:var(--sub);font-size:12px;margin-left:auto;white-space:nowrap}
.body{font-size:15px;line-height:1.55;margin-top:9px;color:var(--ink);letter-spacing:-0.025em}
.src{display:flex;align-items:center;gap:6px;margin-top:10px;background:#fff;border-radius:6px;padding:8px 10px;font-size:12px;color:var(--ink2)}
.src .k{font-size:10px;font-weight:700;color:var(--lime-ink);white-space:nowrap}
.src .tt{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.src .go{font-size:11px;font-weight:700;color:#000;white-space:nowrap}
.tk .lgi{width:18px;height:18px;border-radius:50%;object-fit:cover;background:#fff}
.tk .lg{background:#E2E2E2;color:#666}
.photo{margin-top:10px;border-radius:6px;overflow:hidden;aspect-ratio:16/9;background:#ddd}
.photo img{width:100%;height:100%;object-fit:cover;display:block}
.split{display:flex;gap:12px;align-items:flex-start}
.split .body{flex:1}
.thumb{width:72px;height:72px;border-radius:6px;object-fit:cover;flex:none;margin-top:12px}
.poll{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.opt{position:relative;background:#fff;border-radius:6px;padding:8px 10px;font-size:13px;display:flex;justify-content:space-between;overflow:hidden}
.opt i{position:absolute;left:0;top:0;bottom:0;background:#EEF9C4;z-index:0}
.opt span{position:relative;z-index:1}
.opt.top{font-weight:700}
.poll-meta{font-size:11px;color:var(--sub);margin-top:2px}
.ticks{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.tk{font-size:12px;color:var(--ink2);background:#fff;border:1px solid var(--line);border-radius:100px;padding:4px 10px 4px 4px;display:inline-flex;align-items:center;gap:5px}
.tk .lg{width:18px;height:18px;border-radius:50%;background:#000;color:#fff;font-size:8px;font-weight:800;display:flex;align-items:center;justify-content:center}
.tk b{font-weight:700;color:#000}
.acts{display:flex;gap:18px;margin-top:10px;font-size:12px;color:var(--sub)}
.a{display:inline-flex;align-items:center;gap:4px}
.a svg{width:17px;height:17px;fill:none;stroke:var(--sub);stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.a.on{color:#000}.a.on svg{fill:#000;stroke:#000}
.a.sh{margin-left:auto}
.replies{margin-top:10px;border-top:1px solid var(--line);padding-top:10px;display:flex;flex-direction:column;gap:6px}
.re{font-size:13px;line-height:1.45;color:var(--ink2)}
.re b{color:#000;font-weight:700;margin-right:4px}
.re .lv{margin-right:4px}
.fab{position:absolute;right:16px;bottom:22px;background:#000;color:#fff;font-weight:700;font-size:14px;padding:13px 18px;border-radius:100px;box-shadow:0 4px 14px rgba(0,0,0,.18)}
.note{font-size:11px;color:var(--sub);padding:4px 16px 90px}
.tk .lg{background:#E2E2E2;color:#666}
.eav{flex:none;display:block}
.re .eav{display:inline-block;vertical-align:-3px;margin-right:4px}
.mini{font-size:9px;font-weight:700;letter-spacing:0;color:#fff;background:#000;padding:1px 5px;border-radius:100px;margin-right:5px;vertical-align:1px}
/* 귓속말(GMC팀만 보는 글) */
.secret{background:#fff;border:1px dashed #C9C9C9}
.lock{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:var(--ink2);background:var(--card);padding:3px 8px;border-radius:100px}
.lockhint{font-size:11px;color:var(--sub);margin-left:6px}
.lock svg{width:12px;height:12px;fill:none;stroke:var(--ink2);stroke-width:2.2}
.ans{margin-top:10px;background:var(--card);border-radius:6px;padding:9px 10px}
.ans .ok{font-size:11px;font-weight:700;color:var(--lime-ink)}
.ans p{font-size:13px;line-height:1.45;margin-top:4px;color:var(--ink2)}
.ans b{color:#000;margin-right:5px}
/* 프사 두 벌 — 기본은 기호·이니셜, body.pf-char면 캐릭터 */
.pf{display:inline-flex;flex:none;position:relative}
.pim,.pbadge{display:none}
.pf-img .pim{display:block;border-radius:50%;object-fit:cover}
.pf-img .pf>.av,.pf-img .pf>.eav{display:none}
.pf-img .pbadge{display:block;position:absolute;right:-3px;bottom:-3px;width:46%;height:46%}
.re .pbadge{display:none!important}
.re .pf{display:inline-flex;vertical-align:-3px;margin-right:4px}
.re .pf .av{font-size:8px;border-width:1px}
/* 생동감 레이어 — 기본은 숨김 */
.rxs,.typing{display:none}
.re:not(.e) .pf{display:none}
.st-b .re:not(.e) .pf,.st-c .re:not(.e) .pf{display:inline-flex}
.re .pf .av{background:#fff;color:var(--ink2);border-color:var(--line)}
