/* 주님의 식탁(검토용) — 식탁을 따라 걷기 */
main.tb-page{--tone:#214b43;--gold:#a8742a;--seal:#b3261e;width:min(calc(100% - 28px),820px);padding:20px 0 72px}
@media(min-width:720px){main.tb-page{width:min(calc(100% - 48px),820px);padding:40px 0 100px}}
body:has(.tb-page) header.top .wrap,body:has(.tb-page) nav.subnav.wrap,body:has(.tb-page) footer.wrap{width:min(calc(100% - 28px),820px)}
@media(min-width:720px){body:has(.tb-page) header.top .wrap,body:has(.tb-page) nav.subnav.wrap,body:has(.tb-page) footer.wrap{width:min(calc(100% - 48px),820px)}}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tb-review{background:var(--grain);border-radius:12px;padding:9px 14px;font-size:var(--fs-sm,14px);color:var(--muted);margin:0 0 20px}
.tb-eyebrow{color:var(--point);font-size:var(--fs-sm,14px);letter-spacing:.14em;font-weight:600;margin:0 0 6px}
.tb-page p{line-height:1.95;margin:0 0 16px;word-break:keep-all}
.tb-hero{padding:6px 0 10px}
.tb-page h1{font:400 clamp(3rem,13vw,5.2rem)/1.08 'Poor Story',cursive;margin:4px 0 8px}
.tb-sub{font-size:var(--fs-lg,18px);color:var(--muted);margin:0 0 24px!important}
.tb-core{margin:26px 0;padding:20px 20px;border-left:5px solid var(--point);background:color-mix(in srgb,var(--point) 8%,transparent);border-radius:0 16px 16px 0;font:400 clamp(1.3rem,5vw,1.7rem)/1.6 'Poor Story',cursive;color:var(--point)}
.tb-sec{position:relative;padding:40px 0 8px;border-top:1px solid var(--line);margin-top:20px}
.tb-hero{border-top:0;margin-top:0}
.tb-head{display:flex;gap:14px;align-items:center;margin:0 0 14px}
.tb-ico{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:var(--grain);color:var(--point)}
.tb-ico svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.tb-page h2{font:400 clamp(1.7rem,6.4vw,2.3rem)/1.3 'Poor Story',cursive;margin:0;border:0;padding:0}
.tb-h{font-size:var(--fs-md,16px);color:var(--point);margin:26px 0 10px}
.tb-page h3{font-weight:700}
.tb-verse{margin:6px 0 20px;padding:12px 16px;border-left:3px solid var(--gold);background:var(--paper);border-radius:0 12px 12px 0;box-shadow:0 0 0 1px var(--line) inset}
.tb-verse p{margin:0 0 6px;font-size:1rem;line-height:1.9;color:var(--ink)}.tb-verse cite{font-size:var(--fs-sm,14px);color:var(--muted);font-style:normal}
.tb-verse .vn{font-size:var(--fs-xs,12px);color:var(--muted);vertical-align:super;margin-right:3px}
.tb-fold{border-top:1px solid var(--line);margin:8px 0 18px}
.tb-fold summary{cursor:pointer;list-style:none;padding:14px 4px;min-height:48px;font-weight:700;color:var(--point);display:flex;align-items:center;justify-content:space-between}
.tb-fold summary::-webkit-details-marker{display:none}.tb-fold summary::after{content:"⌄";transition:transform .25s;font-size:var(--fs-xl,20px)}
.tb-fold[open] summary::after{transform:rotate(180deg)}
.tb-vfold .tb-verse{margin-top:0}
.tb-list{padding-left:1.2rem;margin:0 0 16px}.tb-list li{margin:8px 0;line-height:1.85}
.tb-big{margin:20px 0;padding:6px 0 6px 16px;border-left:4px solid var(--point)}
.tb-big p{margin:0 0 8px;font:400 clamp(1.25rem,4.8vw,1.55rem)/1.6 'Poor Story',cursive;color:var(--point)}
.tb-big.strong{border-left-color:var(--seal);background:color-mix(in srgb,var(--seal) 5%,transparent);padding:16px 16px;border-radius:0 14px 14px 0}.tb-big.strong p{color:var(--ink)}
/* 타임라인 */
.tb-timeline{margin:26px 0 8px;padding:16px 4px 6px}
.tb-timeline ol{list-style:none;margin:0;padding:6px 2px 10px;display:flex;gap:0;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}.tb-timeline ol::-webkit-scrollbar{display:none}
.tb-timeline li{flex:1 0 96px;position:relative;scroll-snap-align:start;text-align:center}
.tb-timeline li::before{content:"";position:absolute;top:17px;left:-50%;width:100%;height:2px;background:var(--line)}.tb-timeline li:first-child::before{display:none}
.tb-timeline a{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;color:var(--ink);font-size:var(--fs-sm,14px);line-height:1.4;padding:0 4px;word-break:keep-all}
.tb-timeline .dot{position:relative;z-index:1;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--paper);border:2px solid var(--point);color:var(--point);font-weight:700;font-size:var(--fs-sm,14px);transition:background .2s,color .2s}
.tb-timeline a:hover .dot,.tb-timeline a:focus-visible .dot{background:var(--point);color:#fffdf8}
/* 고정 목차 */
.tb-nav{position:sticky;top:0;z-index:30;margin:6px -14px 0;padding:10px 14px;background:color-mix(in srgb,var(--paper) 94%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.tb-chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x proximity}.tb-chips::-webkit-scrollbar{display:none}
.tb-chips a{flex:none;scroll-snap-align:start;padding:8px 14px;min-height:40px;display:flex;align-items:center;border:1px solid var(--line);border-radius:999px;font-size:var(--fs-sm,14px);color:var(--muted);text-decoration:none;background:var(--paper);white-space:nowrap}
.tb-chips a.on{background:var(--point);border-color:var(--point);color:#fffdf8}
.tb-sec{scroll-margin-top:70px}
/* 자리 배치도 */
.tb-seats{margin:24px 0 8px;padding:16px;border-radius:var(--r-md,12px);background:var(--grain)}
.tb-tabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 0 8px}.tb-tabs::-webkit-scrollbar{display:none}
.tb-tabs button,.tb-btn{font:inherit;font-size:var(--fs-sm,14px);flex:none;padding:8px 14px;min-height:40px;border:1px solid var(--point);border-radius:999px;background:transparent;color:var(--point);cursor:pointer}
.tb-tabs button[aria-selected="true"],.tb-btn.main{background:var(--point);color:#fffdf8}
.tb-btn.small{font-size:var(--fs-sm,14px);padding:6px 13px;min-height:36px}
.tb-seatfig{margin:0}
.tb-seatfig svg{display:block;width:100%;max-width:380px;height:auto;margin:0 auto}
.tb-seatfig figcaption{font-size:var(--fs-sm,14px);line-height:1.8;margin:6px 2px 0}
.tb-legend{list-style:none;display:flex;flex-wrap:wrap;gap:6px 14px;padding:0;margin:10px 0 0;font-size:var(--fs-sm,14px);color:var(--muted)}
.tb-legend i{display:inline-block;width:11px;height:11px;border-radius:50%;margin-right:6px;vertical-align:-1px}
.tb-seatfig .tbl{fill:var(--paper);stroke:var(--line);stroke-width:2}
.k-jesus{fill:var(--point)}.k-disciple{fill:#7aa28f}.k-tax{fill:#b98a4b}.k-sinner{fill:#d4a55c}.k-host{fill:#d4a55c;stroke:var(--seal);stroke-width:2.5}.k-crowd{fill:#c9bfa9}.k-out{fill:transparent;stroke:#8d887d;stroke-dasharray:3 3;stroke-width:1.6}
.tb-seatfig text{font:600 11px 'Pretendard',sans-serif;fill:var(--ink);text-anchor:middle}.tb-seatfig text.sm{font-weight:500;font-size:var(--fs-xs,12px);fill:var(--muted)}
.tb-seatfig .seat{animation:seatin .4s ease-out both}
/* 비교·시선·숯불 */
.tb-compare{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:stretch;margin:6px 0 18px}
.tb-compare>div:not(.tb-arrow){padding:14px;border:1px solid var(--line);border-radius:var(--r-md,12px);background:var(--paper)}.tb-compare .tb-r{border-color:var(--point);background:color-mix(in srgb,var(--point) 6%,transparent)}
.tb-compare h4{margin:0 0 8px;color:var(--point)}.tb-compare ul{margin:0;padding-left:1.1rem}.tb-compare li{margin:6px 0;font-size:var(--fs-sm,14px);line-height:1.6}
.tb-arrow{align-self:center;color:var(--point);font-size:var(--fs-2xl,24px)}
@media(max-width:560px){.tb-compare{grid-template-columns:1fr}.tb-arrow{transform:rotate(90deg);justify-self:center}}
.tb-eyes{list-style:none;padding:0;margin:0 0 20px;display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.tb-eyes li{padding:14px 12px;border-radius:var(--r-md,12px);background:var(--grain);text-align:center}.tb-eyes b{display:block;color:var(--point);margin-bottom:6px;font:400 1.3rem 'Poor Story',cursive}.tb-eyes span{font-size:var(--fs-sm,14px);line-height:1.55;word-break:keep-all}
@media(max-width:560px){.tb-eyes{grid-template-columns:1fr}}
.tb-coals{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:6px 0 16px}
.tb-coal{padding:14px;border-radius:var(--r-md,12px);background:var(--grain)}.tb-coal:nth-child(2){background:color-mix(in srgb,var(--gold) 14%,var(--paper))}
.tb-coalnote{font-size:var(--fs-sm,14px);color:var(--muted);margin:0 0 10px!important}
.tb-coal .tb-verse{margin:0;box-shadow:none;background:transparent;padding:6px 0 0 12px}.tb-coal .tb-verse p{font-size:var(--fs-md,16px)}
@media(max-width:620px){.tb-coals{grid-template-columns:1fr}}
/* 절기 */
.tb-cal{margin:20px 0 6px;padding:18px 16px;border-radius:var(--r-md,12px);background:var(--grain)}
.tb-cal h3{margin:0 0 10px;font-size:var(--fs-md,16px);color:var(--point)}
.tb-upcoming{list-style:none;padding:0;margin:0 0 8px;display:grid;gap:8px}
.tb-upcoming li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;border-radius:12px;background:var(--paper);border:1px solid var(--line)}
.tb-upcoming b{font-weight:700}.tb-upcoming .d{color:var(--point);font-weight:700;white-space:nowrap}.tb-upcoming small{display:block;color:var(--muted);font-size:var(--fs-sm,14px)}
.tb-small{font-size:var(--fs-sm,14px);color:var(--muted);margin:6px 0 12px!important}
.tb-tablewrap{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tb-cal table{width:100%;border-collapse:collapse;font-size:var(--fs-sm,14px);background:var(--paper);border-radius:12px;overflow:hidden}.tb-cal caption{text-align:left;font-weight:700;color:var(--point);padding:0 0 6px}
.tb-cal th,.tb-cal td{text-align:left;vertical-align:top;padding:9px 10px;border-top:1px solid var(--line);line-height:1.5}.tb-cal th[scope=row]{width:36%;font-weight:600}
@media(max-width:620px){.tb-tablewrap{grid-template-columns:1fr}}
/* 빈자리 */
.tb-empty{display:flex;gap:18px;align-items:center;flex-wrap:wrap;margin:22px 0 10px;padding:18px;border-radius:var(--r-md,12px);background:var(--grain)}
.tb-empty svg{flex:0 0 min(240px,100%);width:240px;max-width:100%;height:auto}.tb-empty .tbl{fill:var(--paper);stroke:var(--line);stroke-width:2}
.tb-emptytxt{flex:1;min-width:200px}.tb-bigline{font:400 1.45rem/1.5 'Poor Story',cursive;color:var(--point);margin:0 0 12px!important}
.tb-invite{margin:10px 0 18px;padding:18px 18px 6px;border:2px solid var(--gold);border-radius:var(--r-md,12px);background:var(--paper);animation:rise .4s ease-out}
.tb-invite[hidden]{display:none}.tb-msg{font-size:var(--fs-sm,14px);color:var(--point)}
#tb-emptyseats .seat{fill:#7aa28f}#tb-emptyseats .free{fill:transparent;stroke:var(--gold);stroke-width:2.5;stroke-dasharray:4 4;animation:pulse 2s ease-in-out infinite}
/* 일곱 가지 */
.tb-seven{list-style:none;counter-reset:s;padding:0;margin:0 0 22px;display:grid;gap:10px}
.tb-seven li{counter-increment:s;position:relative;padding:14px 14px 14px 56px;border:1px solid var(--line);border-radius:var(--r-md,12px);background:var(--paper)}
.tb-seven li::before{content:counter(s);position:absolute;left:14px;top:14px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--point);color:#fffdf8;font-weight:700;font-size:var(--fs-sm,14px)}
.tb-seven b{display:block;margin-bottom:2px}.tb-seven span{font-size:var(--fs-sm,14px);color:var(--muted);line-height:1.65;word-break:keep-all}
.tb-next{list-style:none;padding:0;margin:0 0 30px;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px}
.tb-next a{display:block;padding:14px;border:1px solid var(--line);border-radius:var(--r-md,12px);color:var(--ink);text-decoration:none;min-height:72px}.tb-next b{display:block;color:var(--point)}.tb-next span{font-size:var(--fs-sm,14px);color:var(--muted);line-height:1.5}
.tb-online{margin-top:20px;padding-top:26px;border-top:1px solid var(--line)}.tb-online h2{margin-bottom:8px}.tb-online h3{font-size:var(--fs-lg,18px);margin:26px 0 8px;color:var(--ink)}
.tb-page a:focus-visible,.tb-page button:focus-visible,.tb-page summary:focus-visible{outline:2px solid var(--point);outline-offset:2px}
/* 등장 */
.tb-sec.pre{opacity:0;transform:translateY(18px)}.tb-sec.pre.in{opacity:1;transform:none;transition:opacity .6s ease,transform .6s ease}
@keyframes seatin{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes pulse{50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.tb-sec.pre{opacity:1;transform:none}.tb-page *{animation:none!important;transition:none!important}}
.tb-legend i.k-jesus{background:var(--point)}.tb-legend i.k-disciple{background:#7aa28f}.tb-legend i.k-tax{background:#b98a4b}.tb-legend i.k-sinner{background:#d4a55c}.tb-legend i.k-host{background:#d4a55c;border:2px solid var(--seal)}.tb-legend i.k-crowd{background:#c9bfa9}
/* 공개판: 눈썹·제목은 영어판에도 남는 기존 문장이라 구역 밖에 둔다 */
.tb-page>.eyebrow{color:var(--point);font-size:var(--fs-sm,14px);letter-spacing:.14em;font-weight:600;margin:0 0 6px}
.tb-online h2{font:700 1.1rem/1.5 'Pretendard',sans-serif;margin:26px 0 8px;border:0;padding:0;color:var(--ink)}
.tb-online h2.tb-online-title{font:400 clamp(1.7rem,6.4vw,2.3rem)/1.3 'Poor Story',cursive;margin:0 0 12px}
.tb-online .lead{font-size:1rem;margin:0 0 14px}

/* 1분 듣기 · 카드 받기 */
.tb-tools{margin:0 0 18px;padding:12px 14px;border-radius:var(--r-md,12px);background:var(--grain)}
.tb-audio{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.tb-audio span{color:var(--point);font-size:var(--fs-sm,14px);font-weight:700;white-space:nowrap}
.tb-audio audio{flex:1;min-width:200px;height:36px}
.tb-sharerow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px}
.tb-btn{display:inline-flex;align-items:center;text-decoration:none}
