/* 우리 내용의 서식.
   **전부 `#dp-app` 안으로 범위를 좁힌다.** 테마 안에 얹혀 들어가므로
   body·main·h1 같은 것을 맨몸으로 건드리면 테마의 머리말·사이드바까지 망가진다.
   글꼴·바탕은 테마 것을 그대로 쓴다. **색은 목록 링크만 예외다** — 아래에 적었다. */
#dp-app{--dim:#767676;--line:#e2e2e2}
#dp-app *{box-sizing:border-box}
#dp-app h1{font-size:23px;line-height:1.4;margin:0 0 6px}
#dp-app h2{font-size:17px;margin:28px 0 10px;padding-bottom:6px;
     border-bottom:1px solid var(--line)}
#dp-app .sub{color:var(--dim);margin:0 0 18px;font-size:15px}
#dp-app .meta{margin:0 0 20px;padding:0;list-style:none;font-size:15px}
#dp-app .meta li{padding:5px 0;border-bottom:1px solid #f2f2f2;display:flex;gap:12px}
#dp-app .meta b{flex:0 0 96px;color:var(--dim);font-weight:600}
#dp-app .kw{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
#dp-app .kw li{background:#f4f6f8;border-radius:3px;padding:2px 9px;font-size:14px}
#dp-app .warn{background:#fff8e6;border:1px solid #f0dfae;border-radius:4px;
      padding:12px 14px;margin:0 0 20px;font-size:14.5px}
#dp-app .warn b{color:#8a6100}
#dp-app .list{margin:0;padding:0;list-style:none}
#dp-app .list li{padding:11px 0;border-bottom:1px solid var(--line)}
#dp-app .list .t{font-size:14px}
#dp-app .list .m{color:var(--dim);font-size:13px;margin-top:3px}
/* 목록의 제목·저자 링크는 **전체글목록 쪽과 같은 붉은색**을 쓴다.
   테마 링크색 #de7b85 는 연분홍이라 목록이 길게 이어지면 흐릿하다.
   `https://doingphilosophy.kr/list/all/` 의 `.linkstyle a` 와 같은 값이다 —
   #990000 · 밑줄 없음 · 가리키면 밑줄. 사용자가 그 쪽을 기준으로 삼았다. */
#dp-app .list .t a,#dp-app .list .m a{color:#990000;text-decoration:none}
#dp-app .list .t a:hover,#dp-app .list .m a:hover{text-decoration:underline}
#dp-app .dp-foot{border-top:1px solid var(--line);margin-top:36px;padding:18px 0 6px;
      color:var(--dim);font-size:13.5px}
#dp-app .dp-foot p{margin:4px 0}
#dp-app .year{font-weight:700;margin:22px 0 4px;color:var(--dim);font-size:14px}
#dp-app .oa{color:var(--dim);font-size:14px}
/* 「무료 제공 페이지」는 **다른 링크와 같은 색**을 쓴다 — 색은 테마가 정한다.
   혼자 다른 색이면 그것만 튀어서, 정작 중요한 제목·저자보다 먼저 눈에 든다.
   굵기로만 도드라지게 한다. */
#dp-app .oa-yes{font-weight:700}
#dp-app .oa-no{color:var(--dim);font-size:14px}
@media(max-width:600px){#dp-app .meta li{flex-direction:column;gap:2px}
  #dp-app .meta b{flex:none}}