:root{
    --bg: #F8F6F1; --bg-soft: #F3F0E9; --panel: #EFEBE2;
    --line: rgba(23,22,20,0.10); --line-strong: rgba(23,22,20,0.18);
    --ink: #171614; --ink-dim: #716D67; --ink-faint: rgba(113,109,103,0.75);
    --cinema: #7D2635; --cinema-bg: #F3E7E7; --accent: #7D2635; --gold: #7D2635;
    --coupang: #1E88E5; --iherb: #2E9E6C;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  body{ background:var(--bg); color:var(--ink); font-family:'Pretendard',sans-serif; -webkit-font-smoothing:antialiased; }
  .serif{ font-family:'Pretendard',sans-serif; }
  a{ color:inherit; }

  .wrap{ max-width:1480px; margin:0 auto; padding:0 5vw; }
  .breadcrumb{ padding:20px 0 0; font-size:12.5px; color:var(--ink-faint); }
  .breadcrumb a{ text-decoration:none; color:var(--ink-faint); }

  /* HEADER META */
  .post-head{ padding:28px 0 0; max-width:1100px; }
  .post-cat-chip{ display:inline-block; font-size:11.5px; font-weight:700; background:var(--cinema-bg); color:var(--cinema); padding:6px 14px; border-radius:999px; margin-bottom:18px; }
  .post-title{ font-family:'Pretendard',sans-serif; font-size:clamp(28px,4vw,42px); font-weight:700; line-height:1.28; }
  .post-meta-row{ display:flex; gap:16px; margin-top:22px; padding-bottom:24px; border-bottom:1px solid var(--line); font-size:13px; color:var(--ink-faint); align-items:center; flex-wrap:wrap; }
  .author-badge{ display:flex; align-items:center; gap:8px; }
  .author-badge .av{ width:26px; height:26px; border-radius:50%; background:var(--ink); color:#fff; display:flex; align-items:center; justify-content:center; font-size:11px; font-family:'Pretendard',sans-serif; }

  /* HERO IMAGE */
  .hero-img{ width:100%; aspect-ratio:16/8; overflow:hidden; margin:32px 0; border-radius:2px; background:linear-gradient(135deg,#f2ede6,#e8e1d6); }
  .hero-img img{ width:100%; height:100%; object-fit:cover; }

  /* LAYOUT: content + toc sidebar — 본문에 공간을 최대한 몰아줌 */
  .content-layout{ display:grid; grid-template-columns: minmax(0,1fr) 240px; gap:56px; align-items:start; max-width:1480px; margin:0 auto; min-width:0; }

  .toc{
    position:sticky; top:90px; background:var(--bg-soft); border:1px solid var(--line); border-radius:16px; padding:20px 18px;
  }
  .toc-title{ font-size:12px; font-weight:700; letter-spacing:0.08em; color:var(--ink-faint); text-transform:uppercase; margin-bottom:14px; }
  .toc a{ display:block; font-size:13px; color:var(--ink-dim); text-decoration:none; padding:7px 0; border-left:2px solid var(--line); padding-left:12px; transition:.2s; }
  .toc a:hover, .toc a.active{ color:var(--cinema); border-left-color:var(--cinema); }

  .article{ max-width:none; width:100%; min-width:0; padding-bottom:20px; }
  .ad-inline{ margin:36px 0; padding:16px; text-align:center; background:var(--bg-soft); border:1px dashed var(--line-strong); border-radius:12px; font-size:11px; color:var(--ink-faint); letter-spacing:0.06em; }

  .article h2{ font-family:'Pretendard',sans-serif; font-size:26px; font-weight:600; margin:44px 0 18px; scroll-margin-top:100px; }
  .article h3{ font-family:'Pretendard',sans-serif; font-size:20px; font-weight:600; margin:32px 0 14px; scroll-margin-top:100px; }
  .article p{ font-size:17px; line-height:1.95; color:var(--ink); margin-bottom:22px; font-weight:400; }
  .article p.lead{ font-size:19px; color:var(--ink-dim); font-weight:300; }
  .article ul, .article ol{ margin:0 0 20px 22px; font-size:16px; line-height:1.9; color:var(--ink); }
  .article blockquote{
    border-left:3px solid var(--gold); padding:4px 0 4px 22px; margin:28px 0; font-style:italic; color:var(--ink-dim); font-family:'Pretendard',sans-serif; font-size:18px;
  }

  /* 본문 안의 모든 이미지에 대한 안전장치 — 래퍼(.inline-img) 유무와 무관하게
     절대 본문 폭을 넘치지 않도록 강제. 에디터에서 삽입한 순수 <img> 태그도 포함 */
  .article img{
    max-width:100%; height:auto; display:block;
    border-radius:14px; margin:28px auto;
  }
  .inline-img{ width:100%; border-radius:14px; margin:28px 0; overflow:hidden; }
  .inline-img img{ width:100%; margin:0; border-radius:0; }

  /* 에디터에서 크기를 조절해 저장한 이미지 — 지정된 width(%) 그대로 표시 */
  .img-resizable{ display:block; margin:28px auto; max-width:100%; }
  .img-resizable img{ width:100%; height:auto; display:block; border-radius:14px; margin:0; }

  .caption{ font-size:12px; color:var(--ink-faint); text-align:center; margin-top:-18px; margin-bottom:24px; }

  /* 에디터에서 지원하는 폰트크기/정렬 옵션이 본문에도 그대로 반영되도록 */
  .article [style*="font-size"]{ line-height:1.8; }
  .article [style*="text-align: center"], .article [style*="text-align:center"]{ text-align:center; }
  .article [style*="text-align: right"], .article [style*="text-align:right"]{ text-align:right; }

  /* PRODUCT CARD — 쿠팡 */
  .product-card{
    display:flex; gap:20px; border:1px solid var(--line); border-radius:16px; padding:20px; margin:32px 0; align-items:center;
  }
  .product-card .p-img{ width:110px; height:110px; border-radius:12px; overflow:hidden; flex-shrink:0; background:var(--bg-soft); }
  .product-card .p-img img{ width:100%; height:100%; object-fit:cover; }
  .product-card .p-body{ flex:1; }
  .product-source{ display:inline-flex; align-items:center; gap:6px; font-size:10.5px; font-weight:700; padding:4px 10px; border-radius:999px; margin-bottom:8px; color:#fff; }
  .src-coupang{ background:var(--coupang); }
  .src-iherb{ background:var(--iherb); }
  .p-name{ font-size:15.5px; font-weight:600; margin-bottom:6px; }
  .p-desc{ font-size:12.5px; color:var(--ink-faint); line-height:1.6; margin-bottom:10px; }
  .p-price{ font-size:15px; font-weight:700; color:var(--ink); margin-bottom:12px; }
  .p-btn{ display:inline-block; font-size:12.5px; font-weight:600; padding:9px 20px; border-radius:999px; text-decoration:none; }
  .btn-coupang{ background:var(--coupang); color:#fff; }
  .btn-iherb{ background:var(--iherb); color:#fff; }
  .partner-disclosure{ font-size:10.5px; color:var(--ink-faint); margin-top:10px; }
  .iherb-notice{ font-size:11px; color:var(--ink-faint); background:var(--bg-soft); padding:10px 14px; border-radius:10px; margin-top:12px; line-height:1.6; }

  /* SNS SHARE */
  .share-row{ display:flex; gap:10px; margin:44px 0; padding:20px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
  .share-btn{ font-size:12.5px; padding:9px 18px; border-radius:999px; border:1px solid var(--line-strong); text-decoration:none; color:var(--ink-dim); font-weight:500; }

  /* SOURCE / DISCLAIMER */
  .source-box, .post-footer-meta{ font-size:12px; color:var(--ink-faint); line-height:1.8; margin-bottom:40px; }
  .source-box b, .post-footer-meta b{ color:var(--ink-dim); }

  /* RELATED */
  .related-title{ font-family:'Pretendard',sans-serif; font-size:22px; font-weight:600; margin:0 0 24px; }
  .related-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:50px; }
  .related-card{ text-decoration:none; color:inherit; }
  .related-img{ width:100%; aspect-ratio:4/2.6; border-radius:2px; overflow:hidden; margin-bottom:10px; background:var(--bg-soft); }
  .related-img img{ width:100%; height:100%; object-fit:cover; }
  .related-t{ font-size:14px; font-weight:500; line-height:1.5; }

  /* PREV/NEXT */
  .prevnext{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:60px; }
  .pn-item{ border:1px solid var(--line); border-radius:14px; padding:18px 20px; text-decoration:none; color:inherit; }
  .pn-label{ font-size:11px; color:var(--ink-faint); margin-bottom:6px; letter-spacing:0.06em; }
  .pn-title{ font-size:14px; font-weight:600; }

  /* footer 스타일은 main.css 공통 정의(차콜 배경 4열)를 그대로 사용 */

  @media (max-width:980px){
    .content-layout{ grid-template-columns:1fr; gap:0; }
    .toc{
      position:static; margin-bottom:20px; border-radius:12px;
    }
    .toc-title{ cursor:pointer; display:flex; justify-content:space-between; align-items:center; }
    .toc-title::after{ content:'▾'; font-size:11px; transition:transform .2s; }
    .toc.collapsed .toc-title::after{ transform:rotate(-90deg); }
    .toc.collapsed a{ display:none; }
    .related-grid{ grid-template-columns:1fr; }
    .prevnext{ grid-template-columns:1fr; }
  }