/*
 * 주보 — 한 호의 네 쪽(화면)과 인쇄 두 면(PDF). **이 파일이 주보 모양의 정본이다.**
 *
 * 2026-10-26 다시 그림. 승인 v19 판(워크스페이스 artifacts/weekly-bulletin/current-v19/)에서 출발해
 * 소유자 지적(「여백이 안 맞고 글자가 커 보인다, 인쇄하면 부담스럽다, 섹션마다 여유를」)에 따라
 * 코덱스 안의 여백·정렬과 Claude 안의 내용을 합쳤다.
 *
 * - **크기와 간격은 토큰 하나씩**(`--fs` 본문, `--sm` 작은 글, `--gut` 쪽 바깥 여백, `--sec` 섹션 사이).
 *   폰·데스크톱·인쇄는 토큰 값만 바꾼다 — 칸마다 em 을 곱하던 v19 의 들쭉날쭉한 왼쪽 선이 없어진다.
 * - 인쇄 A5 한 쪽: 본문 9pt, 표지 제목 24pt, 각 면 제목 17pt, 바깥 여백 12mm, 섹션 사이 7mm.
 * - 각 면 머리의 색 띠와 표지의 장식 십자선은 걷었다. 위쪽 청록 선과 표지 바탕은 남는다.
 */
.wcb{--ink:#173f40;--teal:#307a76;--tint:#edf2f2;--rule:#a4b4af;--hair:#e1e8e6;--soft:#55706e;
--serif:"AppleMyungjo","Noto Serif KR","Batang",serif;--scripture:"Song Myung","AppleMyungjo",serif;--sans:"Apple SD Gothic Neo","Pretendard Variable",Pretendard,"Malgun Gothic",sans-serif;
--fs:15px;--sm:13px;--lb:12.5px;--h1:32px;--h2:23px;--gut:20px;--sec:32px;--in:12px;--lh:1.7;
color:var(--ink);background:#dce3e0;font-family:var(--sans);word-break:keep-all;overflow-wrap:break-word;-webkit-text-size-adjust:100%;color-scheme:light}
.wcb *{box-sizing:border-box}
.wcb p,.wcb h1,.wcb h2,.wcb h3,.wcb dl,.wcb dd,.wcb ol,.wcb ul,.wcb blockquote{margin:0}
.wcb a{color:inherit;text-decoration:none}
.wcb a:focus-visible,.wcb summary:focus-visible{outline:3px solid #a56c13;outline-offset:3px}
.wcb .pages{display:grid;gap:12px}
.wcb .sheets{display:none}
.wcb .pg{background:#fff;padding:var(--gut);font-size:var(--fs);line-height:var(--lh);display:flex;flex-direction:column;position:relative;min-width:0}
.wcb .pg>*+*{margin-top:var(--sec)}
.wcb .label{font-size:var(--lb);font-weight:600;color:var(--teal);letter-spacing:.03em;line-height:1.4;margin-bottom:var(--in)}
.wcb .need{color:#a56c13;font-weight:600}
/* 표지 — 코덱스 D안(2026-10-27, 소유자 고름). 박스·색띠·세로줄 인용을 걷고, 그림은 설교 제목 뒤에 옅게
 * 깐다(「그림은 설교 제목 뒤 배경으로」). 위 왼쪽에 로고, 맨 아래에는 예배 시간만. 매주 그림·제목 길이가
 * 바뀌어도 글자가 읽히게 그림은 38% 로 옅게, 제목 덩어리 오른쪽 아래에 붙인다. */
.wcb .top{display:flex;justify-content:space-between;align-items:center;gap:1em;font-size:var(--sm)}
.wcb .top .brand{display:block;width:9.5em;max-width:55%;height:auto}
.wcb .top>a{display:block;width:9.5em;max-width:55%}
.wcb .top>a .brand{max-width:100%}
.wcb .top time{white-space:nowrap}
.wcb .field{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:center;min-height:19em;padding:var(--in) 0}
.wcb .field .art{position:absolute;inset:1.5em -.4em 0 1.6em;z-index:-1;overflow:hidden;pointer-events:none}
.wcb .field .art img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:right bottom;opacity:.38}
.wcb .field .series,.wcb .field .passage{font-size:var(--sm)}
.wcb .pages .cover{--h1:clamp(34px,10vw,44px)}
.wcb .field h1{font:400 var(--h1)/1.3 var(--serif);letter-spacing:-.045em;margin:.55em 0 .5em;word-break:keep-all;overflow-wrap:anywhere}
.wcb .key .label{color:var(--ink)}
/* 성경 구절은 송명으로 — 다른 글과 갈라 보이게(소유자, 2026-10-27). 인쇄 PDF 는 scripts/bulletin-fonts.sh 가 넣은 같은 글꼴. */
.wcb .key blockquote{font:400 calc(var(--fs)*1.22)/1.8 var(--scripture);word-break:keep-all}
.wcb .key cite{display:block;font-style:normal;font-size:var(--sm);margin-top:.5em}
.wcb .invite{font-size:var(--fs);line-height:1.85}
.wcb .foot{margin-top:auto!important;padding-top:var(--sec);display:flex;justify-content:flex-end}
.wcb .foot p{font-size:var(--sm);white-space:nowrap}

.wcb .service .online{margin-top:auto!important;text-align:center;font-size:var(--sm);line-height:1.6;border-top:1px solid var(--rule);padding-top:var(--in)}
/* QR 은 실시간 예배 안내 바로 밑에 붙는다 — 둘이 한 덩어리로 2면 맨 아래에 선다. */
.wcb .service .qr{margin-top:var(--in)!important;border-top:0;padding-top:0}
/* 각 면의 머리 — 위쪽 청록 선 하나 */
.wcb .mast{border-top:3px solid var(--teal);padding-top:var(--in);display:flex;justify-content:space-between;align-items:baseline;gap:1em}
.wcb .mast h2{font:400 var(--h2)/1.3 var(--serif);letter-spacing:-.02em}
.wcb .mast span{font-size:var(--sm);color:var(--soft);white-space:nowrap}
.wcb .ref{display:flex;gap:.8em;font-size:var(--sm);border-bottom:1px solid var(--rule);padding-bottom:var(--in);margin-top:var(--in)!important}
.wcb .ref{justify-content:space-between;color:var(--soft)}
/* 예배 순서 */
.wcb .order{list-style:none;padding:0;counter-reset:n}
.wcb .order li{counter-increment:n;display:grid;grid-template-columns:2em 1fr auto;column-gap:.4em;padding:.42em 0;border-bottom:1px dotted #cfd9d6}
.wcb .order li:last-child{border-bottom:0}
.wcb .order li:before{content:counter(n,decimal-leading-zero);font-size:calc(var(--sm)*.85);color:var(--teal);padding-top:.2em;font-variant-numeric:tabular-nums}
.wcb .order .w{font-weight:600}
.wcb .order .p{text-align:right}
.wcb .order .note{grid-column:2/4;font-size:var(--sm);color:var(--soft)}
/* 말씀 */
.wcb .summary p+p{margin-top:.75em}
.wcb .full summary{cursor:pointer;list-style:none;padding:.6em .8em;border:1px solid var(--teal);min-height:44px;display:flex;justify-content:space-between;align-items:center;font-size:var(--sm)}
.wcb .full summary:after{content:'＋'}
.wcb .full[open] summary:after{content:'−'}
.wcb .full summary::-webkit-details-marker{display:none}
.wcb .verses{font-size:var(--sm);line-height:1.65}
.wcb .verses p,.wcb p.verses{font-family:var(--scripture)}
.wcb .verses .src{font-family:var(--sans)}
.wcb .full .verses{margin-top:var(--in)}
.wcb .full .verses p+p{margin-top:.5em}
.wcb .verses sup{font-size:.75em;color:var(--teal);font-weight:600;margin-right:.2em}
.wcb .verses .src{margin-top:.5em;font-size:calc(var(--sm)*.9);color:var(--soft)}
.wcb .memo{margin-top:auto!important;padding-top:var(--sec)}
.wcb .memo .lines div{height:2.2em;border-bottom:1px solid #d6dfdc}
/* 교회소식 */
.wcb .news .mast h2{font-size:calc(var(--h2)*1.1)}
.wcb .items .item+.item{margin-top:var(--in)}
.wcb .items h3{font-size:var(--fs);font-weight:600;line-height:1.5}
.wcb .items p{font-size:var(--sm);color:#2f4d4c;margin-top:.15em}
.wcb .sched{list-style:none;padding:0}
.wcb .sched li{display:grid;grid-template-columns:4.4em 1fr;gap:.6em;padding:.5em 0;border-top:1px solid var(--hair)}
.wcb .sched time{font:400 calc(var(--fs)*1.08)/1.3 var(--serif);font-variant-numeric:tabular-nums}
.wcb .sched time small{display:block;font-family:var(--sans);font-size:calc(var(--sm)*.9);color:var(--soft)}
.wcb .sched div small{display:block;font-size:var(--sm);color:var(--soft)}
.wcb .gatherings{border-top:1px solid var(--rule);padding-top:var(--in)}
.wcb .times{display:grid;grid-template-columns:1fr 1fr;gap:.45em 1em;font-size:var(--sm)}
.wcb .times dt{font-weight:600}
.wcb .times dd{color:var(--soft)}
.wcb .visit{font-size:var(--sm);color:var(--soft);line-height:1.65;border-top:1px solid var(--rule);padding-top:var(--in)}
.wcb .visit b{color:var(--ink)}
.wcb .visit address{font-style:normal}
.wcb .qr{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--in);margin-top:auto!important;border-top:1px solid var(--rule);padding-top:var(--in)}
.wcb .qr a{display:flex;align-items:center;justify-content:center;gap:.5em;font-size:var(--sm)}
.wcb .qr svg{width:3.6em;height:3.6em;flex:none}
.wcb .pg-foot{display:none}
/* 표지 그림 */
/* 데스크톱 — 펼친 책처럼 두 쪽씩 */
.wcb{padding:20px 0 40px}
@media(min-width:900px){.wcb{--fs:15px;--sm:13px;--h1:36px;--h2:24px;--gut:32px;--sec:30px;padding:24px 0 48px}.wcb .pages{grid-template-columns:1fr 1fr;gap:24px}}
/* 영어판 — 라틴 글자는 길다 */
.wcb[lang="en"] .field h1{letter-spacing:-.01em;font-size:calc(var(--h1)*.8)}
.wcb[lang="en"] .mast h2{letter-spacing:-.01em}
/* ── 인쇄 면: A4 가로에 A5 두 쪽(PDF 를 만들 때만 보인다) ── */
.wcb .sheet{width:297mm;min-height:210mm;display:flex;background:#fff;break-after:page}
.wcb .sheet:last-child{break-after:auto}
.wcb .sheet .pg{--fs:9pt;--sm:7.8pt;--lb:7.6pt;--h1:24pt;--h2:17pt;--gut:12mm;--sec:7mm;--in:2.6mm;--lh:1.62;width:148.5mm;min-height:210mm;flex:none;padding:12mm 12mm 14mm}
.wcb .sheet .pg+.pg{border-left:.2mm dashed transparent}
.wcb .sheet .qr svg{width:15mm;height:15mm}
.wcb .sheet .cover{--h1:32pt}
.wcb .sheet .top .brand{width:36mm}
.wcb .sheet .field{min-height:70mm;padding:5mm 0;flex:1 0 auto}
/* 「오늘의 말씀」이 없는 주(설교자가 짚은 절이 없을 때)에 아래가 비지 않게 제목·그림 칸이 남은 높이를 채운다. */
/* 칸이 커져도 그림은 오른쪽 아래 정사각 하나 크기로 묶는다 — 칸을 따라 커지면 제목을 덮는다. */
.wcb .sheet .field .art{inset:auto -2mm 0 auto;width:66mm;height:66mm}
.wcb .sheet .memo{flex:1;display:flex;flex-direction:column;min-height:24mm}
/* 인쇄에서는 남은 높이를 메모 줄로 채운다 — 본문이 짧은 주에 말씀 면 아래가 비지 않게. */
.wcb .sheet .memo .lines{flex:1;background:repeating-linear-gradient(to bottom,transparent 0 6.2mm,#d6dfdc 6.2mm 6.45mm)}
.wcb .sheet .memo .lines div{display:none}
.wcb .sheet .order li{padding:.6em 0}
.wcb .sheet .pg-foot{display:flex;justify-content:space-between;position:absolute;left:12mm;right:12mm;bottom:6mm;margin:0!important;font-size:6.8pt;color:var(--soft)}
.wcb .sheet .full{display:none}

/* ── 주보 둘레(사이트 쪽) — 검토 줄, 머리, 목록, 초안 칸, 고치기 폼, 홈 카드 ── */
/*
 * 한 기둥 — 검토 줄·제목·네 쪽·이전/다음이 모두 같은 `wc-wrap` 안쪽 선에 선다(로고와 같은 선).
 * 상자(검토 줄, 쪽)는 바깥 선을, 상자 없는 글(제목)은 글자를 그 선에 맞춘다. 한 쪽씩 보이는
 * 너비에서는 기둥을 640px 로 좁혀 가운데에 둔다. 폰(640px 이하)에서는 상자가 화면 끝까지 가고
 * 안쪽 글이 제목과 같은 24px 선에 선다.
 */
.wcb-main{padding-bottom:0}
.wcb .pages.wc-wrap{box-sizing:content-box}
@media(max-width:899px){.wcb-main .wc-wrap{max-width:640px}}
@media(max-width:640px){
.wcb-main .wcb-review{margin-left:-24px;margin-right:-24px}
.wcb-main .wcb-review{padding-left:20px;padding-right:24px}
.wcb .pages .pg{--gut:24px}
.wcb .pages .qr{grid-template-columns:repeat(3,minmax(0,1fr))}
.wcb .pages .qr a{flex-direction:column;align-items:center;gap:.3em}
.wcb .pages.wc-wrap{padding-left:0;padding-right:0}
}
.wcb-review{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin-top:0;padding:12px 16px;border:1px solid #d6e0dd;border-left:4px solid #a56c13;background:#fffaf0}
.wcb-review-state{margin:0;font-size:.95rem}
.wcb-review-state b{margin-right:6px}
.wcb-review-do{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.wcb-review-do form,.wc-replay-pending-do form{margin:0}
.wcb-main button.wc-btn-primary,.wcb-notices button.wc-btn-primary,.wcb-form button.wc-btn-primary{border:0;cursor:pointer;font:inherit}
.wcb-around{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.wcb-around a{display:block;padding:12px 0;text-decoration:none;font-family:var(--wp--preset--font-family--serif);font-size:1.05rem;color:inherit}
.wcb-around a small{display:block;font-family:var(--wp--preset--font-family--sans,inherit);font-size:.8rem;color:#307a76;margin-bottom:2px}
.wcb-around a:hover{color:#307a76}
.wcb-around-next{text-align:right;grid-column:2}
.wcb-drafts-state{display:block;font-size:.8rem;opacity:.8;margin-top:2px}
/* 머리 — 소식 글과 같은 제목 크기(`.wc-event-single h1`). 폭만 주보 쪽에 맞춰 넓다. */
/* 머리는 낮게(소유자, 2026-10-27: 「상단을 좁게」) — 돌아가기 단추를 작게, PDF 단추는 그 줄 오른쪽에. */
.wcb-main{padding-top:20px}
.wcb-intro .wc-back{margin-bottom:10px;align-items:center}
.wcb-intro .wc-back-btn{padding:4px 9px;gap:5px;font-size:.76rem}
.wcb-intro h1{font-size:1.5rem;font-weight:500;line-height:1.3;margin:0}
.wcb-intro .wc-title-row{margin-bottom:4px;align-items:center;flex-wrap:wrap;gap:8px 12px}
.wcb-intro .wc-copy{margin-top:0}
.wcb-intro .wcb-pdf{margin-left:auto;padding:4px 12px;font-size:.76rem}
.wcb-intro .wcb-review{margin-bottom:22px}
.wcb-editor-note{margin:6px 0 0;font-size:.85rem;color:#8a5a0f}
.wcb-intro{padding-bottom:16px}
/* 목록 — 「교회 소식」 줄 그대로. 초안 딱지만 더한다. */
.wcb-draft-tag{display:inline-block;margin-right:6px;padding:1px 7px;border-radius:999px;background:#fff3dc;color:#8a5a0f;font-size:.72rem;font-weight:600;vertical-align:2px}
.wcb-nrow .wcb-draft-lead{color:#8a5a0f}
.wcb-more a{text-decoration:none}
.wcb-loadmore{margin:20px 0 0;text-align:center}
.wcb-loadmore .wc-btn-quiet[aria-busy="true"]{opacity:.6;pointer-events:none}
.wcb-new-page .wcb-note{margin:0 0 14px}
.wcb-new{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0 0}
.wcb-new-page .wcb-new select{width:auto;flex:0 1 240px}
.wcb-new label{font-size:.85rem}
.wcb-form{max-width:720px}
.wcb-form-state{margin:0 0 12px;font-size:.95rem}
.wcb-fs{border:0;border-top:1px solid #e3e9e7;margin:18px 0 0;padding:14px 0 0}
.wcb-fs legend{font-weight:600;color:#307a76;padding:0 6px 0 0}
.wcb-two{display:flex;flex-wrap:wrap;gap:0 12px}
.wcb-two>.wc-album-field{flex:1 1 220px;min-width:0}
.wcb-two>.wcb-narrow{flex:0 1 140px}
.wcb-slot-row{display:flex;flex-wrap:wrap;gap:6px}
.wcb-slot-row select{flex:1 1 200px;min-width:0;min-height:44px}
.wcb-slot-row input{flex:1 1 160px;min-width:0;min-height:44px}
.wcb-form .is-missing>label:after{content:" · 확인 필요";color:#a56c13;font-weight:600}
.wcb-form .wc-album-field small{display:block;font-size:.8rem;opacity:.75;margin-top:4px}
.wcb-note{font-size:.85rem;opacity:.8;margin:6px 0 0}
.wcb-form-cover{display:block;max-width:220px;background:#edf2f2;padding:8px;margin-bottom:8px}
.wcb-check{display:flex;gap:6px;align-items:center;margin-bottom:10px}
.wcb-form-do{position:sticky;bottom:0;display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;padding:12px 0;background:#fff;border-top:1px solid #e3e9e7;margin-top:20px}
.wcb-form select,.wcb-form input[type="number"],.wcb-new select{box-sizing:border-box;width:100%;border:1px solid var(--wp--preset--color--line);border-radius:10px;padding:10px 12px;font-size:.95rem;background:#fff;color:var(--wp--preset--color--ink);min-height:44px}
.wcb-form [hidden]{display:none!important}
.wc-replay-pending-do{flex-wrap:wrap}
/* 물벗 버튼(오른쪽 아래 둥근 단추)과 저장 단추가 겹치지 않게 */
@media(max-width:640px){.wcb-form-do{padding-right:72px}}