diff --git a/src/AdminPage.tsx b/src/AdminPage.tsx
index d2d32d7..d84b33d 100644
--- a/src/AdminPage.tsx
+++ b/src/AdminPage.tsx
@@ -89,7 +89,7 @@ function SortableLessonSection({ section, study, updateStudySection, removeStudy
-
diff --git a/src/App.css b/src/App.css
index 1cde95b..dbed398 100644
--- a/src/App.css
+++ b/src/App.css
@@ -1264,6 +1264,47 @@
/* ── Colossians Study ── */
.study-index-page,
+/* ── Lesson Announcement Banner ── */
+.study-lesson-announcement-banner {
+ display: flex;
+ align-items: flex-start;
+ gap: 1rem;
+ padding: 1rem 1.5rem;
+ background: linear-gradient(135deg, #1a1500 0%, #241c00 100%);
+ border-bottom: 2px solid #c9a84c;
+ width: 100%;
+ box-sizing: border-box;
+}
+
+.study-lesson-announcement-icon {
+ font-size: 1.4rem;
+ line-height: 1;
+ flex-shrink: 0;
+ margin-top: 0.1rem;
+}
+
+.study-lesson-announcement-body {
+ flex: 1;
+ min-width: 0;
+}
+
+.study-lesson-announcement-label {
+ display: block;
+ font-size: 0.72rem;
+ text-transform: uppercase;
+ letter-spacing: 0.12em;
+ color: #c9a84c;
+ margin-bottom: 0.3rem;
+ font-weight: 700;
+}
+
+.study-lesson-announcement-text {
+ margin: 0;
+ font-size: 0.95rem;
+ color: #f0e9cc;
+ line-height: 1.6;
+}
+
.study-section-page {
background:
radial-gradient(1200px 500px at 90% -10%, rgba(201, 168, 76, 0.12), transparent 55%),
diff --git a/src/colossiansStudy.tsx b/src/colossiansStudy.tsx
index 4c1ef40..9d2f37b 100644
--- a/src/colossiansStudy.tsx
+++ b/src/colossiansStudy.tsx
@@ -1639,6 +1639,15 @@ export function ColossiansStudySectionPage({ content }: Props) {
return (
+ {section.announcement && (
+
+
📢
+
+
Announcement
+
{section.announcement}
+
+
+ )}
@@ -1648,13 +1657,6 @@ export function ColossiansStudySectionPage({ content }: Props) {
{section.reference}
{section.summary}
- {section.announcement && (
-
- Lesson Announcement
- {section.announcement}
-
- )}
-
{lessonAudioEmbedUrl && (
Lesson Audio
@@ -1679,7 +1681,13 @@ export function ColossiansStudySectionPage({ content }: Props) {
Instructor Commentary
- {section.commentary}
+ {section.commentary.split(/\n{2,}/).map((para, i) => (
+
+ {para.split('\n').map((line, j, arr) => (
+ j < arr.length - 1 ? <>{line}
> : line
+ ))}
+
+ ))}