/* Weekly Fellowship week detail (node--weekly_fellowship_week). Ported from the
   mockup; --fel maps to --accent via the .section--fellowship scope. */

.fwk { background: var(--paper); padding: 0 0 120px; }
.fwk .crumb { padding: 22px 0 0; }
.fwk .crumb a { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ink-3); text-decoration: none; }
.fwk .crumb a:hover { color: var(--accent); }
.fwk-wrap { max-width: 1200px; display: grid; grid-template-columns: 1fr 240px; gap: 64px; padding-top: 12px; }
.fwk-article { min-width: 0; max-width: 740px; padding: 8px 0 64px; }

.fwk-hero { position: relative; padding: 8px 0 44px; margin-bottom: 32px; }
.fwk-hero::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: var(--line); }
.fwk-hero-eyebrow { font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: 1.4px; color: var(--accent); text-transform: uppercase; }
[dir="rtl"] .fwk-hero-eyebrow { letter-spacing: 0.4px; }
.fwk-hero h1 { font-family: var(--serif); font-weight: 500; font-size: 64px; line-height: 1; letter-spacing: -1.8px; margin: 14px 0 18px; color: var(--ink); text-wrap: balance; }
[dir="rtl"] .fwk-hero h1 { font-family: var(--farsi); font-weight: 600; letter-spacing: 0; }
.fwk-hero-lede { font-size: 18px; line-height: 1.75; color: var(--ink-2); margin: 0 0 28px; max-width: 620px; }
.fwk-hero-art { position: relative; aspect-ratio: 16/9; border-radius: 18px; overflow: hidden; background: #1a1024 center/cover no-repeat; margin: 28px 0 28px; box-shadow: 0 28px 60px rgba(63,38,88,0.24), 0 8px 18px rgba(63,38,88,0.10); }
.fwk-hero-start { display: inline-flex; align-items: center; gap: 12px; margin-top: 22px; padding: 14px 22px; border-radius: 999px; background: var(--accent); color: #fff; border: none; cursor: pointer; font-family: inherit; font-weight: 700; font-size: 14.5px; letter-spacing: -0.1px; box-shadow: 0 14px 28px rgba(146,104,170,0.32); transition: filter 0.15s, transform 0.15s, box-shadow 0.15s; }
.fwk-hero-start:hover { filter: brightness(1.08); transform: translateY(-1px); box-shadow: 0 18px 36px rgba(146,104,170,0.40); }
[dir="rtl"] .fwk-hero-start svg { transform: scaleX(-1); }
.fwk-hero-meta { display: flex; align-items: center; gap: 14px; font-size: 13.5px; color: var(--ink-3); flex-wrap: wrap; }
.fwk-hero-share { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: var(--paper-2); color: var(--ink-2); border: none; cursor: pointer; font-family: inherit; font-size: 12.5px; font-weight: 600; transition: background 0.15s, color 0.15s; }
.fwk-hero-share:hover { background: var(--accent-tint); color: var(--accent); }

.fwk-step-sec { --step-hue: 270; --step-color: hsl(var(--step-hue), 36%, 50%); --step-soft: hsl(var(--step-hue), 70%, 96%); position: relative; padding: 56px 0 28px; border-top: 1px solid var(--line); scroll-margin-top: 96px; transition: opacity 0.4s ease; }
.fwk-step-sec[data-hue="welcome"] { --step-hue: 28; }
.fwk-step-sec[data-hue="worship"] { --step-hue: 210; }
.fwk-step-sec[data-hue="word"] { --step-hue: 200; }
.fwk-step-sec[data-hue="message"] { --step-hue: 280; }
.fwk-step-sec[data-hue="discuss"] { --step-hue: 156; }
.fwk-step-sec[data-hue="pray"] { --step-hue: 348; }
.fwk-step-sec[data-hue="thisweek"] { --step-hue: 48; }
.fwk-step-sec:first-child { border-top: none; padding-top: 24px; }
.fwk-step-sec.past, .fwk-step-sec.upcoming { opacity: 0.36; }
.fwk-step-sec.past:hover, .fwk-step-sec.upcoming:hover { opacity: 0.72; }
.fwk-step-sec.current { opacity: 1; }

.fwk-step-head { position: relative; display: flex; flex-direction: column; gap: 10px; margin-bottom: 28px; padding-bottom: 22px; border-bottom: 1px solid var(--step-soft); }
.fwk-step-edit { position: absolute; top: 0; inset-inline-end: 0; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; border: 1px solid rgba(146,104,170,0.28); background: rgba(255,255,255,0.92); color: var(--accent-deep); font-size: 12px; font-weight: 700; letter-spacing: 0.2px; text-decoration: none; box-shadow: 0 4px 14px rgba(146,104,170,0.10); transition: background 0.15s, border-color 0.15s, transform 0.15s; z-index: 2; }
.fwk-step-edit:hover { background: #fff; border-color: rgba(146,104,170,0.45); transform: translateY(-1px); color: var(--accent-deep); text-decoration: none; }
.fwk-step-badge { display: inline-flex; align-items: center; gap: 14px; align-self: flex-start; }
.fwk-step-num { position: relative; width: 64px; height: 64px; border-radius: 999px; background: linear-gradient(135deg, var(--accent), var(--accent-deep)); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-family: var(--serif); font-weight: 500; font-size: 24px; letter-spacing: -0.4px; box-shadow: 0 12px 28px rgba(146,104,170,0.30), 0 4px 10px rgba(146,104,170,0.16); }
.fwk-step-num::after { content: ''; position: absolute; inset: -6px; border-radius: 999px; border: 1px solid var(--accent); opacity: 0.18; pointer-events: none; }
.fwk-step-of { font-size: 11px; font-weight: 800; letter-spacing: 1.6px; color: var(--accent); text-transform: uppercase; }
[dir="rtl"] .fwk-step-of { letter-spacing: 0.4px; }
.fwk-step-label { font-family: var(--serif); font-weight: 500; font-size: 17px; color: var(--ink-2); letter-spacing: -0.2px; margin-top: 2px; }
[dir="rtl"] .fwk-step-label { font-family: var(--farsi); font-weight: 600; }
.fwk-step-head h2 { font-family: var(--serif); font-weight: 500; font-size: 44px; line-height: 1.08; letter-spacing: -1.1px; color: var(--ink); margin: 6px 0 0; text-wrap: balance; }
[dir="rtl"] .fwk-step-head h2 { font-family: var(--farsi); font-weight: 600; letter-spacing: 0; font-size: 40px; }

.fwk-block-p { font-size: 17px; line-height: 1.9; color: var(--ink-2); margin: 0 0 22px; }
.fwk-block-p :where(p) { margin: 0 0 16px; }
.fwk-block-h { font-family: var(--serif); font-weight: 500; font-size: 24px; color: var(--ink); margin: 28px 0 12px; letter-spacing: -0.3px; }
[dir="rtl"] .fwk-block-h { font-family: var(--farsi); font-weight: 600; }

.fwk-block-video { display: block; position: relative; background: linear-gradient(135deg, hsl(var(--hue, 270), 50%, 30%), hsl(var(--hue, 270), 60%, 14%)); border-radius: 18px; overflow: hidden; margin: 14px 0 28px; cursor: pointer; border: none; padding: 0; width: 100%; font-family: inherit; transition: transform 0.2s, box-shadow 0.2s; aspect-ratio: 16/9; box-shadow: 0 22px 48px rgba(0,0,0,0.20), 0 6px 14px rgba(0,0,0,0.10); text-align: start; }
.fwk-block-video[style*="--fwk-vthumb"] { background-image: var(--fwk-vthumb); background-size: cover; background-position: center; }
.fwk-block-video:hover { transform: translateY(-3px); box-shadow: 0 30px 60px rgba(0,0,0,0.28); }
.fwk-block-video::before { content: ''; position: absolute; inset: 0; background: radial-gradient(70% 60% at 50% 50%, transparent 0%, rgba(0,0,0,0.30) 100%), radial-gradient(600px 380px at 100% 0%, rgba(255,255,255,0.12), transparent 60%); }
.fwk-block-video .fwk-bv-thumb-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,0.95); }
.fwk-block-video .fwk-bv-thumb-play::before { content: ''; position: absolute; width: 88px; height: 88px; border-radius: 999px; background: rgba(255,255,255,0.18); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,0.30); transition: transform 0.2s, background 0.2s; }
.fwk-block-video:hover .fwk-bv-thumb-play::before { transform: scale(1.08); background: rgba(255,255,255,0.26); }
.fwk-block-video .fwk-bv-thumb-play svg { position: relative; z-index: 1; width: 40px; height: 40px; transform: translateX(2px); }
.fwk-block-video--unavailable { cursor: default; background-color: #1e1e24; background-image: linear-gradient(135deg, #3a3a42, #1e1e24); box-shadow: none; }
.fwk-block-video--unavailable[style*="--fwk-vthumb"] { background-image: var(--fwk-vthumb); background-size: cover; background-position: center; }
.fwk-block-video--unavailable:hover { transform: none; box-shadow: none; }
.fwk-block-video--unavailable::before { background: rgba(0,0,0,0.45); }
.fwk-bv-unavailable { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 20px; text-align: center; color: #fafafa; }
.fwk-bv-unavailable strong { font-size: 15px; font-weight: 700; letter-spacing: 0.02em; }
.fwk-bv-unavailable span { font-size: 12px; opacity: 0.7; max-width: 28em; line-height: 1.4; }
.fwk-bv-body { position: absolute; inset-inline-start: 28px; inset-inline-end: 28px; bottom: 22px; z-index: 1; color: #fff; text-align: start; }
.fwk-bv-body .ttl { font-family: var(--serif); font-weight: 500; font-size: 24px; letter-spacing: -0.3px; line-height: 1.2; margin: 0; }
[dir="rtl"] .fwk-bv-body .ttl { font-family: var(--farsi); font-weight: 600; }

.fwk-block-verse, .fwk-block-chord { display: flex; align-items: center; gap: 18px; padding: 18px 22px; background: #fff; border: 1px solid var(--line); border-radius: 14px; margin: 14px 0 28px; cursor: pointer; width: 100%; font-family: inherit; transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s; text-align: start; color: inherit; }
.fwk-block-verse:hover { border-color: #41A769; transform: translateY(-2px); box-shadow: 0 14px 30px rgba(65,167,105,0.18); }
.fwk-block-chord:hover { border-color: #A53C7E; transform: translateY(-2px); box-shadow: 0 14px 30px rgba(186,56,133,0.18); }
.fwk-block-verse .ico { width: 48px; height: 48px; border-radius: 12px; background: rgba(65,167,105,0.10); color: #41A769; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.fwk-block-chord .ico { width: 48px; height: 48px; border-radius: 12px; background: rgba(186,56,133,0.10); color: #A53C7E; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.fwk-block-verse .info, .fwk-block-chord .info { text-align: start; min-width: 0; }
.fwk-block-verse .info .l, .fwk-block-chord .info .l { font-size: 11px; font-weight: 800; letter-spacing: 1.4px; color: var(--ink-3); }
[dir="rtl"] .fwk-block-verse .info .l, [dir="rtl"] .fwk-block-chord .info .l { letter-spacing: 0.4px; }
.fwk-block-verse .info .t, .fwk-block-chord .info .t { font-family: var(--serif); font-weight: 500; font-size: 17px; color: var(--ink); margin-top: 2px; letter-spacing: -0.1px; }
[dir="rtl"] .fwk-block-verse .info .t, [dir="rtl"] .fwk-block-chord .info .t { font-family: var(--farsi); font-weight: 600; }
.fwk-block-verse .chev, .fwk-block-chord .chev { margin-inline-start: auto; color: var(--ink-3); flex-shrink: 0; }
[dir="rtl"] .fwk-block-verse .chev, [dir="rtl"] .fwk-block-chord .chev { transform: scaleX(-1); }

.fwk-block-extlink { display: inline-flex; align-items: center; gap: 10px; padding: 12px 18px; border: 1px solid var(--line); border-radius: 999px; font-size: 14px; font-weight: 600; color: var(--ink); margin: 14px 0 24px; transition: border-color 0.15s, color 0.15s; text-decoration: none; }
.fwk-block-extlink:hover { border-color: var(--step-color); color: var(--step-color); }

.fwk-block-psalm { border-inline-start: 3px solid var(--accent); background: var(--paper-3); border-radius: 0 14px 14px 0; padding: 22px 26px; margin: 0 0 22px; }
[dir="rtl"] .fwk-block-psalm { border-radius: 14px 0 0 14px; }
.fwk-block-psalm .pl { font-family: var(--serif); font-weight: 500; font-size: 18px; color: var(--ink); margin: 0 0 8px; }
[dir="rtl"] .fwk-block-psalm .pl { font-family: var(--farsi); font-weight: 600; }
.fwk-block-psalm .pb { font-family: var(--serif); font-size: 16px; line-height: 1.8; color: var(--ink-2); margin: 0; white-space: pre-line; }
[dir="rtl"] .fwk-block-psalm .pb { font-family: var(--farsi); }

.fwk-step-cta { margin-top: 28px; }
.fwk-continue-btn { display: inline-flex; align-items: center; gap: 14px; padding: 16px 24px; background: var(--accent); color: #fff; font-family: inherit; font-weight: 700; font-size: 14.5px; border: none; border-radius: 999px; cursor: pointer; box-shadow: 0 14px 28px rgba(146,104,170,0.32); transition: filter 0.15s, transform 0.15s, box-shadow 0.15s; text-decoration: none; }
.fwk-continue-btn:hover { filter: brightness(1.08); transform: translateY(-1px); }
.fwk-continue-btn .lbl { font-size: 11px; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase; opacity: 0.82; }
[dir="rtl"] .fwk-continue-btn .lbl { letter-spacing: 0.2px; text-transform: none; opacity: 0.85; }
.fwk-continue-btn .next-name { font-family: var(--serif); font-weight: 500; font-size: 17px; letter-spacing: -0.1px; }
[dir="rtl"] .fwk-continue-btn .next-name { font-family: var(--farsi); font-weight: 600; }
.fwk-continue-btn .arrow { display: inline-flex; }
[dir="rtl"] .fwk-continue-btn .arrow svg { transform: scaleX(-1); }
.fwk-continue-finish .lbl { font-family: var(--serif); font-weight: 500; font-size: 17px; letter-spacing: -0.2px; text-transform: none; opacity: 1; }
[dir="rtl"] .fwk-continue-finish .lbl { font-family: var(--farsi); font-weight: 600; }

.fwk-side { position: relative; align-self: stretch; }
.fwk-side-sticky { position: sticky; top: 92px; padding: 16px 0 0; }
.fwk-side-eyebrow { font-size: var(--fs-eyebrow); font-weight: 800; letter-spacing: 1.6px; color: var(--ink-3); text-transform: uppercase; margin-bottom: 16px; padding-inline-start: 22px; }
[dir="rtl"] .fwk-side-eyebrow { letter-spacing: 0.4px; }
.fwk-side-nav { display: flex; flex-direction: column; gap: 2px; position: relative; }
.fwk-side-nav::before { content: ''; position: absolute; inset-block: 12px; inset-inline-start: 11px; width: 2px; background: var(--line); border-radius: 2px; }
.fwk-side-nav .seg { position: relative; display: flex; align-items: center; gap: 14px; padding: 8px 0 8px 38px; border: none; background: transparent; cursor: pointer; font-family: inherit; text-align: start; font-size: 14px; color: var(--ink-3); font-weight: 500; transition: color 0.15s; }
[dir="rtl"] .fwk-side-nav .seg { padding: 8px 38px 8px 0; }
.fwk-side-nav .seg::before { content: ''; position: absolute; inset-inline-start: 6px; top: 50%; transform: translateY(-50%); width: 12px; height: 12px; border-radius: 999px; background: #fff; border: 2px solid var(--line); transition: background 0.18s, border-color 0.18s, transform 0.18s; z-index: 1; }
.fwk-side-nav .seg:hover { color: var(--ink); }
.fwk-side-nav .seg.visited { color: var(--ink-2); }
.fwk-side-nav .seg.visited::before { background: var(--accent); border-color: var(--accent); }
.fwk-side-nav .seg.on { color: var(--accent); font-weight: 700; }
.fwk-side-nav .seg.on::before { background: var(--accent); border-color: var(--accent); transform: translateY(-50%) scale(1.35); box-shadow: 0 0 0 4px var(--accent-tint); }

.fwk-step-sec { animation: fwkFadeIn 0.5s ease both; }
@keyframes fwkFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.fwk-step-sec.past, .fwk-step-sec.upcoming { animation: none; }

/* Video modal */
.fwk-vp-scrim { position: fixed; inset: 0; z-index: 980; background: rgba(15,8,12,0.78); backdrop-filter: blur(12px); opacity: 0; pointer-events: none; transition: opacity 0.22s ease; }
.fwk-vp-scrim.on { opacity: 1; pointer-events: auto; }
.fwk-vp-modal { position: fixed; inset: 0; z-index: 990; display: flex; align-items: center; justify-content: center; padding: 56px 24px; opacity: 0; pointer-events: none; transition: opacity 0.22s ease; }
.fwk-vp-modal.on { opacity: 1; pointer-events: auto; }
.fwk-vp-stage { width: auto; max-width: none; line-height: 0; border-radius: 18px; overflow: hidden; box-shadow: 0 40px 100px rgba(0,0,0,0.55); transform: scale(0.96); transition: transform 0.22s ease; }
.fwk-vp-modal.on .fwk-vp-stage { transform: scale(1); }
.fwk-vp-close { position: fixed; top: 22px; right: 22px; z-index: 1000; width: 44px; height: 44px; border-radius: 999px; background: rgba(255,255,255,0.12); color: #fff; border: none; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background 0.15s; }
[dir="rtl"] .fwk-vp-close { right: auto; left: 22px; }
.fwk-vp-close:hover { background: rgba(255,255,255,0.22); }
.fwk-vp-frame { position: relative; background: #000; overflow: hidden; }
.fwk-vp-frame.is-landscape { width: min(1100px, calc(100vw - 48px), calc((100vh - 112px) * 16 / 9)); aspect-ratio: 16 / 9; }
.fwk-vp-frame.is-portrait { width: min(480px, calc(100vw - 48px), calc((100vh - 112px) * 9 / 16)); aspect-ratio: 9 / 16; }
.fwk-vp-frame.is-native { width: min(1100px, calc(100vw - 48px)); aspect-ratio: auto; }
.fwk-vp-frame iframe,
.fwk-vp-frame video { position: absolute; inset: 0; display: block; width: 100%; height: 100%; border: 0; background: #000; object-fit: contain; }

/* Verse + chord modals */
.fwk-vm-scrim, .fwk-cm-scrim { position: fixed; inset: 0; background: rgba(20,16,30,0.55); backdrop-filter: blur(6px); opacity: 0; pointer-events: none; transition: opacity 0.22s; z-index: 980; }
.fwk-vm-scrim.on, .fwk-cm-scrim.on { opacity: 1; pointer-events: auto; }
.fwk-vm-sheet { position: fixed; left: 50%; top: 50%; transform: translate(-50%, calc(-50% + 12px)); width: min(640px, calc(100vw - 32px)); max-height: min(86vh, 820px); background: #fff; border-radius: 22px; box-shadow: 0 32px 90px rgba(20,24,40,0.4); opacity: 0; pointer-events: none; transition: opacity 0.22s, transform 0.22s; z-index: 990; display: flex; flex-direction: column; overflow: hidden; }
.fwk-vm-sheet.on { opacity: 1; pointer-events: auto; transform: translate(-50%, -50%); }
.fwk-vm-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 22px 26px 14px; border-bottom: 1px solid var(--line); flex-shrink: 0; }
.fwk-vm-head .fwk-vm-eyebrow { font-size: var(--fs-eyebrow); font-weight: 800; letter-spacing: 1.6px; color: #41A769; text-transform: uppercase; margin-bottom: 6px; }
[dir="rtl"] .fwk-vm-head .fwk-vm-eyebrow { letter-spacing: 0.4px; }
.fwk-vm-head .fwk-vm-ref { font-family: var(--serif); font-weight: 500; font-size: 24px; letter-spacing: -0.4px; color: var(--ink); }
[dir="rtl"] .fwk-vm-head .fwk-vm-ref { font-family: var(--farsi); font-weight: 600; }
.fwk-vm-close { width: 36px; height: 36px; border-radius: 999px; background: var(--paper-2); border: none; color: var(--ink-2); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background 0.15s; }
.fwk-vm-close:hover { background: var(--paper-3); }
.fwk-vm-body { padding: 22px 26px; overflow-y: auto; flex: 1; }
.fwk-vm-body :where(p, div) { font-family: var(--serif); font-weight: 400; font-size: 18px; line-height: 1.85; color: var(--ink); margin: 0 0 16px; text-wrap: pretty; }
[dir="rtl"] .fwk-vm-body :where(p, div) { font-family: var(--farsi); }
.fwk-vm-body p .vn { font-size: 11px; font-weight: 700; color: #41A769; vertical-align: super; margin-inline-end: 4px; }
.fwk-vm-foot { display: flex; gap: 10px; padding: 14px 22px; border-top: 1px solid var(--line); flex-shrink: 0; }
.fwk-vm-btn { flex: 1; padding: 12px 16px; border-radius: 12px; font: inherit; font-weight: 600; font-size: 14px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; gap: 8px; transition: all 0.15s; text-decoration: none; }
.fwk-vm-btn.primary { background: #41A769; color: #fff; border: none; }
.fwk-vm-btn.primary:hover { background: #368B57; color: #fff; }
.fwk-vm-btn.primary.is-hidden { display: none; }
.fwk-vm-btn.ghost { background: transparent; color: var(--ink-2); border: 1px solid var(--line); }
.fwk-vm-btn.ghost:hover { background: var(--paper-2); color: var(--ink); }
[dir="rtl"] .fwk-vm-btn svg { transform: scaleX(-1); }

.fwk-cm-sheet { position: fixed; left: 50%; top: 50%; transform: translate(-50%, calc(-50% + 12px)); width: min(1140px, calc(100vw - 32px)); max-height: min(90vh, 980px); background: #fff; border-radius: 22px; box-shadow: 0 32px 90px rgba(20,24,40,0.4); opacity: 0; pointer-events: none; transition: opacity 0.22s, transform 0.22s; z-index: 990; display: flex; flex-direction: column; overflow: hidden; }
.fwk-cm-sheet.on { opacity: 1; pointer-events: auto; transform: translate(-50%, -50%); }
.fwk-cm-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 22px; border-bottom: 1px solid var(--line); flex-shrink: 0; flex-wrap: wrap; }
.fwk-cm-title { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fwk-cm-title .l { font-size: 10.5px; font-weight: 800; letter-spacing: 1.6px; color: #A53C7E; text-transform: uppercase; }
[dir="rtl"] .fwk-cm-title .l { letter-spacing: 0.4px; }
.fwk-cm-title .t { font-family: var(--serif); font-weight: 500; font-size: 22px; letter-spacing: -0.4px; color: var(--ink); }
[dir="rtl"] .fwk-cm-title .t { font-family: var(--farsi); font-weight: 600; }
.fwk-cm-tools { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fwk-cm-trn { display: inline-flex; align-items: center; gap: 0; background: var(--paper-2); border-radius: 999px; padding: 4px; }
.fwk-cm-trn-btn { width: 30px; height: 30px; border-radius: 999px; border: none; background: transparent; color: var(--ink-2); font: inherit; font-weight: 700; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background 0.12s, color 0.12s; }
.fwk-cm-trn-btn:hover { background: #fff; color: #A53C7E; }
.fwk-cm-trn-key { min-width: 56px; text-align: center; font-family: var(--serif); font-weight: 500; font-size: 14px; color: var(--ink); padding: 0 8px; }
.fwk-cm-trn-key small { color: var(--ink-3); font-size: 10.5px; font-weight: 600; margin-inline-start: 4px; letter-spacing: 0.4px; }
.fwk-cm-print, .fwk-cm-close { width: 36px; height: 36px; border-radius: 999px; background: var(--paper-2); border: none; color: var(--ink-2); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background 0.15s, color 0.15s; }
.fwk-cm-print:hover { background: #FBE5F0; color: #A53C7E; }
.fwk-cm-close:hover { background: var(--paper-3); }
.fwk-cm-body { padding: 22px 28px 28px; overflow-y: auto; flex: 1; font-family: ui-monospace, Menlo, Consolas, monospace; line-height: 1.85; font-size: 15px; }
.fwk-cm-section { margin: 0 0 22px; }
.fwk-cm-section-l { display: block; font-family: var(--sans, system-ui, sans-serif); font-size: 11px; font-weight: 800; letter-spacing: 1.4px; text-transform: uppercase; color: #A53C7E; margin: 0 0 10px; }
[dir="rtl"] .fwk-cm-section-l { letter-spacing: 0.4px; }
.fwk-cm-line { display: block; white-space: pre-wrap; color: var(--ink); margin: 0; padding: 0; }
.fwk-cm-chord-line { display: block; white-space: pre; color: #A53C7E; font-weight: 700; margin: 0; padding: 0; min-height: 1.2em; letter-spacing: -0.2px; }

.fwk-print-only { display: none; }

/* Screen: print-only helpers stay hidden. Print: clean week PDF + chord modal. */
@media print {
  /* Chord-modal print: only the open chart. */
  body:has(.fwk-cm-sheet.print-mode) header.site,
  body:has(.fwk-cm-sheet.print-mode) footer,
  body:has(.fwk-cm-sheet.print-mode) .kal-cm-edit-bar,
  body:has(.fwk-cm-sheet.print-mode) .kal-mini-player,
  body:has(.fwk-cm-sheet.print-mode) .section--fellowship.fwk,
  body:has(.fwk-cm-sheet.print-mode) .fwk-vp-modal,
  body:has(.fwk-cm-sheet.print-mode) .fwk-vp-scrim,
  body:has(.fwk-cm-sheet.print-mode) .fwk-vm-sheet,
  body:has(.fwk-cm-sheet.print-mode) .fwk-vm-scrim,
  body:has(.fwk-cm-sheet.print-mode) .fwk-cm-scrim {
    display: none !important;
  }
  .fwk-cm-sheet.print-mode {
    position: static !important;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    max-height: none !important;
    height: auto !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
  }
  .fwk-cm-sheet.print-mode .fwk-cm-tools,
  .fwk-cm-sheet.print-mode .fwk-cm-close { display: none !important; }
  .fwk-cm-sheet.print-mode .fwk-cm-head {
    border-bottom: 1px solid #ddd;
    padding: 0 0 10px !important;
    margin: 0 0 14px !important;
  }
  .fwk-cm-sheet.print-mode .fwk-cm-body {
    overflow: visible !important;
    padding: 0 !important;
    font-size: 11pt;
    line-height: 1.55;
    color: #111;
  }
  .fwk-cm-sheet.print-mode .fwk-cm-chord-line { color: #7a245c; }

  /* Week PDF (body.fwk-printing set by Download PDF). */
  body.fwk-printing header.site,
  body.fwk-printing footer,
  body.fwk-printing .kal-cm-edit-bar,
  body.fwk-printing .kal-mini-player,
  body.fwk-printing .crumb,
  body.fwk-printing .fwk-side,
  body.fwk-printing .fwk-hero-art,
  body.fwk-printing .fwk-hero-start,
  body.fwk-printing .fwk-hero-share,
  body.fwk-printing .fwk-vp-modal,
  body.fwk-printing .fwk-vp-scrim,
  body.fwk-printing .fwk-vm-sheet,
  body.fwk-printing .fwk-vm-scrim,
  body.fwk-printing .fwk-cm-sheet,
  body.fwk-printing .fwk-cm-scrim,
  body.fwk-printing .fwk-block-video,
  body.fwk-printing .fwk-block-verse,
  body.fwk-printing .fwk-block-chord,
  body.fwk-printing .fwk-block-extlink,
  body.fwk-printing .fwk-step-cta,
  body.fwk-printing .fwk-continue-btn,
  body.fwk-printing .fwk-step-edit {
    display: none !important;
  }

  body.fwk-printing .fwk-print-only { display: block !important; }
  body.fwk-printing .fwk-wrap { display: block !important; grid-template-columns: none !important; }
  body.fwk-printing .fwk-article { max-width: none !important; width: 100% !important; }
  body.fwk-printing .fwk-hero {
    padding: 0 0 12px !important;
    margin: 0 0 16px !important;
    border-bottom: 1px solid #ddd;
  }
  body.fwk-printing .fwk-hero-eyebrow {
    font-size: 9pt !important;
    letter-spacing: 0.2px !important;
    text-transform: none !important;
    color: #666 !important;
  }
  body.fwk-printing .fwk-hero h1 {
    font-size: 20pt !important;
    line-height: 1.2 !important;
    margin: 4px 0 8px !important;
    color: #111 !important;
  }
  body.fwk-printing .fwk-hero-lede {
    font-size: 10pt !important;
    line-height: 1.45 !important;
    margin: 0 0 4px !important;
    color: #333 !important;
  }
  body.fwk-printing .fwk-hero-meta { font-size: 9pt !important; color: #666 !important; }
  body.fwk-printing .fwk-step-sec {
    display: block !important;
    opacity: 1 !important;
    filter: none !important;
    pointer-events: auto !important;
    transform: none !important;
    padding: 10px 0 14px !important;
    min-height: 0 !important;
    break-inside: avoid-page;
    border-bottom: 1px solid #eee;
  }
  body.fwk-printing .fwk-step-sec .fwk-step-head { padding: 0 0 6px !important; margin: 0 0 8px !important; }
  body.fwk-printing .fwk-step-badge { gap: 10px !important; }
  body.fwk-printing .fwk-step-num {
    width: 28px !important;
    height: 28px !important;
    font-size: 11pt !important;
    box-shadow: none !important;
  }
  body.fwk-printing .fwk-step-of { font-size: 8pt !important; letter-spacing: 0.2px !important; text-transform: none !important; }
  body.fwk-printing .fwk-step-label { font-size: 10pt !important; }
  body.fwk-printing .fwk-step-head h2 { font-size: 14pt !important; line-height: 1.25 !important; margin: 6px 0 0 !important; }
  body.fwk-printing .fwk-block-h { font-size: 12pt !important; margin: 10px 0 4px !important; }
  body.fwk-printing .fwk-block-p { font-size: 10.5pt !important; line-height: 1.5 !important; margin: 4px 0 8px !important; color: #222 !important; }
  body.fwk-printing .fwk-block-psalm { border: 1px solid #ddd; border-radius: 0; padding: 10px 12px; margin: 8px 0; background: #fff; box-shadow: none; }
  body.fwk-printing .fwk-block-psalm .pl { font-size: 9pt !important; }
  body.fwk-printing .fwk-block-psalm .pb { font-size: 10.5pt !important; }

  body.fwk-printing .fwk-print-resource {
    margin: 8px 0;
    padding: 8px 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 10pt;
    line-height: 1.4;
    break-inside: avoid;
  }
  body.fwk-printing .fwk-print-resource-label {
    display: block;
    font-size: 8.5pt;
    font-weight: 700;
    color: #5A3D75;
    margin: 0 0 2px;
  }
  body.fwk-printing a.fwk-print-resource-label {
    color: #1a5f8a;
    text-decoration: underline;
    margin: 0;
  }
  body.fwk-printing .fwk-print-resource a:not(.fwk-print-resource-label) {
    word-break: break-all;
    color: #1a5f8a;
    text-decoration: underline;
  }
  body.fwk-printing .fwk-print-verse {
    margin: 8px 0;
    padding: 10px 12px;
    border-right: 3px solid #5A3D75;
    background: #faf8fc;
    break-inside: avoid;
  }
  [dir="ltr"] body.fwk-printing .fwk-print-verse { border-right: none; border-left: 3px solid #5A3D75; }
  body.fwk-printing .fwk-print-verse-ref {
    font-size: 9pt;
    font-weight: 700;
    color: #5A3D75;
    margin: 0 0 6px;
  }
  body.fwk-printing .fwk-print-verse-body {
    font-size: 10.5pt;
    line-height: 1.55;
    color: #222;
  }
}

@media (max-width: 1080px) {
  .fwk-wrap { grid-template-columns: 1fr; gap: 32px; }
  .fwk-side { display: none; }
  .fwk-article { max-width: 720px; margin: 0 auto; }
}
@media (max-width: 720px) {
  .fwk-hero h1 { font-size: 38px; letter-spacing: -1.2px; }
  .fwk-step-head h2 { font-size: 30px; }
  .fwk-step-num { width: 52px; height: 52px; font-size: 20px; }
  .fwk-bv-body .ttl { font-size: 18px; }
  .fwk-vp-modal { padding: 16px; }
  .fwk-vp-close { top: 14px; right: 14px; }
  [dir="rtl"] .fwk-vp-close { right: auto; left: 14px; }
  .fwk-cm-body { padding: 16px 18px 22px; font-size: 12px; line-height: 1.65; }
  .fwk-vm-foot { gap: 8px; padding: 12px 14px; }
  .fwk-vm-btn { font-size: 12px; padding: 10px 8px; }
}