/* 프로즈 정본 — 마크다운 산출물(SupportMarkdown::html)을 싣는 공지 지면·가이드 랜딩·ops 미리보기와 손으로 쓴 정책 문서(policy-doc)가 이 한 벌을 함께 쓴다.
   여기 규모는 공지 지면(카드 안 본문) 기준이고, 가이드 랜딩(gl-prose)과 ops 미리보기(md-preview)는 규모만 덮어쓴다.
   토큰은 공개 레이아웃과 ops 레이아웃이 모두 tokens.css를 싣기에 그대로 쓴다. */

.sc-md { font-size: 14.5px; line-height: 1.8; color: var(--text-muted); }
.sc-md > :first-child { margin-top: 0; }
.sc-md > :last-child { margin-bottom: 0; }
.sc-md h1, .sc-md h2, .sc-md h3 { margin: 20px 0 8px; color: var(--text-main); font-weight: 800; line-height: 1.35; }
.sc-md h1 { font-size: 20px; }
.sc-md h2 { font-size: 18px; }
.sc-md h3 { font-size: 16px; }
.sc-md p { margin: 0 0 12px; }
.sc-md ul, .sc-md ol { margin: 0 0 12px 18px; }
.sc-md ul li { list-style: disc; }
.sc-md ol li { list-style: decimal; }
.sc-md a { color: var(--primary); text-decoration: underline; }
.sc-md strong { color: var(--text-main); }
.sc-md del { color: var(--text-desc); }
.sc-md hr { margin: 20px 0; border: 0; height: 1px; background: var(--gray-200); }

/* 백틱 = 화면의 버튼·메뉴 이름 (키캡) */
.sc-md :not(pre) > code { display: inline-block; padding: 0 6px; border-radius: 5px; background: rgba(var(--primary-rgb), .08); font: inherit; font-size: 13px; font-weight: 700; line-height: 1.6; color: var(--primary); }
.sc-md pre { margin: 0 0 12px; padding: 10px 12px; border-radius: var(--radius-md); background: var(--gray-100); overflow: auto; }

/* 인용 = 상자. 첫 굵은 글자(팁·주의·참고)가 상자의 성격이고 그 줄이 제목이 된다 */
.sc-md .callout { position: relative; margin: 0 0 16px; padding: 12px 14px 12px 44px; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); background: var(--gray-50); color: var(--text-main); --callout: var(--text-sub); }
.sc-md .callout::before { content: "\f10d"; position: absolute; left: 15px; top: 14px; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 14px; color: var(--callout); }
.sc-md .callout p { margin: 0 0 6px; }
.sc-md .callout p:last-child { margin: 0; }
.sc-md .callout p:first-child > strong:first-child { display: block; margin-bottom: 2px; font-size: 12px; font-weight: 800; letter-spacing: .04em; color: var(--callout); }
.sc-md .callout--tip { --callout: var(--accent-blue); border-color: rgba(37,99,235,.25); background: rgba(37,99,235,.06); }
.sc-md .callout--tip::before { content: "\f0eb"; }
.sc-md .callout--warn { --callout: var(--gauge-mid); border-color: rgba(245,158,11,.35); background: rgba(245,158,11,.08); }
.sc-md .callout--warn::before { content: "\f071"; }
.sc-md .callout--note { --callout: var(--primary); border-color: rgba(var(--primary-rgb), .25); background: rgba(var(--primary-rgb), .05); }
.sc-md .callout--note::before { content: "\f05a"; }

/* 그림 = 화면 프레임. 캡션 있는 그림은 렌더러가 figure로 감싼다 */
.sc-md img, .sc-md figure { display: block; max-width: 100%; margin: 12px 0 20px; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); background: #fff; overflow: hidden; }
.sc-md figure::before { content: ""; display: block; height: 26px; border-bottom: 1px solid var(--gray-200); background: radial-gradient(circle at 14px 13px, var(--gray-300) 4px, transparent 5px), radial-gradient(circle at 30px 13px, var(--gray-300) 4px, transparent 5px), radial-gradient(circle at 46px 13px, var(--gray-300) 4px, transparent 5px), var(--gray-100); }
.sc-md figure img { width: 100%; margin: 0; border: 0; border-radius: 0; box-shadow: none; }
.sc-md figcaption { padding: 8px 14px; border-top: 1px solid var(--gray-200); font-size: 13px; color: var(--text-desc); text-align: center; }

/* 체크 목록(- [ ]) = 상황 순서·당일 점검. 체크된 항목은 지난 일처럼 흐려진다 */
.sc-md ul:has(> li > input[type="checkbox"]) { margin-left: 0; }
.sc-md li:has(> input[type="checkbox"]) { display: flex; align-items: flex-start; gap: 8px; list-style: none; }
.sc-md li > input[type="checkbox"] { flex: none; width: 18px; height: 18px; margin: 4px 0 0; appearance: none; border: 1.5px solid var(--gray-300); border-radius: 5px; background: #fff; }
.sc-md li > input[type="checkbox"]:checked { border-color: var(--primary); background: var(--primary); }
.sc-md li > input[type="checkbox"]:checked::after { content: "\f00c"; display: block; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 10px; line-height: 15px; text-align: center; color: #fff; }
.sc-md li:has(> input[type="checkbox"]:checked) { color: var(--text-desc); }

/* 표 */
.sc-md table { width: 100%; margin: 0 0 16px; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); border-collapse: separate; border-spacing: 0; font-size: 13.5px; line-height: 1.6; overflow: hidden; }
.sc-md th, .sc-md td { padding: 8px 12px; border-bottom: 1px solid var(--gray-200); text-align: left; vertical-align: top; }
.sc-md th { background: var(--gray-50); font-weight: 800; color: var(--text-main); }
.sc-md tr:last-child td { border-bottom: 0; }