new render stuff, fixed lexicon

Cargo.lock

···
 
 [[package]]
 name = "aws-lc-rs"
-version = "1.15.1"
+version = "1.15.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6b5ce75405893cd713f9ab8e297d8e438f624dde7d706108285f7e17a25a180f"
+checksum = "6a88aab2464f1f25453baa7a07c84c5b7684e274054ba06817f382357f77a288"
 dependencies = [
  "aws-lc-sys",
  "zeroize",
···
 
 [[package]]
 name = "aws-lc-sys"
-version = "0.34.0"
+version = "0.35.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "179c3777a8b5e70e90ea426114ffc565b2c1a9f82f6c4a0c5a34aa6ef5e781b6"
+checksum = "b45afffdee1e7c9126814751f88dddc747f41d91da16c9551a0f1e8a11e788a1"
 dependencies = [
  "cc",
  "cmake",
···
 
 [[package]]
 name = "bumpalo"
-version = "3.19.0"
+version = "3.19.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "46c5e41b57b8bba42a04676d81cb89e9ee8e859a1a66f80a5a72e1cb76b34d43"
+checksum = "5dd9dc738b7a8311c7ade152424974d8115f2cdad61e8dab8dac9f2362298510"
 dependencies = [
  "allocator-api2",
 ]
···
 
 [[package]]
 name = "cmake"
-version = "0.1.56"
+version = "0.1.57"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "b042e5d8a74ae91bb0961acd039822472ec99f8ab0948cbf6d1369588f8be586"
+checksum = "75443c44cd6b379beb8c5b45d85d0773baf31cce901fe7bb252f4eff3008ef7d"
 dependencies = [
  "cc",
 ]
···
 [[package]]
 name = "dioxus-primitives"
 version = "0.0.1"
-source = "git+https://github.com/DioxusLabs/components#7e5862e574aeceb3a3a021d042c165a839f1860b"
+source = "git+https://github.com/DioxusLabs/components#3564270718866d2e886f879973afc77d7c3a1689"
 dependencies = [
  "dioxus 0.7.2",
  "dioxus-sdk-time",
···
 
 [[package]]
 name = "generator"
-version = "0.8.7"
+version = "0.8.8"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "605183a538e3e2a9c1038635cc5c2d194e2ee8fd0d1b66b8349fad7dbacce5a2"
+checksum = "52f04ae4152da20c76fe800fa48659201d5cf627c5149ca0b707b69d7eef6cf9"
 dependencies = [
  "cc",
  "cfg-if",
  "libc",
  "log",
  "rustversion",
- "windows 0.61.3",
+ "windows-link 0.2.1",
+ "windows-result 0.4.1",
 ]
 
 [[package]]
···
 
 [[package]]
 name = "insta"
-version = "1.44.3"
+version = "1.45.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "b5c943d4415edd8153251b6f197de5eb1640e56d84e8d9159bea190421c73698"
+checksum = "b76866be74d68b1595eb8060cb9191dca9c021db2316558e52ddc5d55d41b66c"
 dependencies = [
  "console",
  "once_cell",
  "serde",
  "similar",
+ "tempfile",
 ]
 
 [[package]]
···
 
 [[package]]
 name = "libredox"
-version = "0.1.10"
+version = "0.1.11"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "416f7e718bdb06000964960ffa43b4335ad4012ae8b99060261aa4a8088d5ccb"
+checksum = "df15f6eac291ed1cf25865b1ee60399f57e7c227e7f51bdbd4c5270396a9ed50"
 dependencies = [
  "bitflags 2.10.0",
  "libc",
- "redox_syscall",
+ "redox_syscall 0.6.0",
 ]
 
 [[package]]
···
 [[package]]
 name = "markdown-weaver"
 version = "0.13.0"
-source = "git+https://github.com/rsform/markdown-weaver#52075e20a194375f1bd4a0c78201ce3b3a52c82d"
+source = "git+https://github.com/rsform/markdown-weaver?branch=para-end-context#d1d3e3188bc0c52a060eb194a311f66c08e54377"
 dependencies = [
  "bitflags 2.10.0",
  "getopts",
···
 [[package]]
 name = "markdown-weaver-escape"
 version = "0.11.0"
-source = "git+https://github.com/rsform/markdown-weaver#52075e20a194375f1bd4a0c78201ce3b3a52c82d"
+source = "git+https://github.com/rsform/markdown-weaver?branch=para-end-context#d1d3e3188bc0c52a060eb194a311f66c08e54377"
 
 [[package]]
 name = "markup5ever"
···
 dependencies = [
  "cfg-if",
  "libc",
- "redox_syscall",
+ "redox_syscall 0.5.18",
  "smallvec",
  "windows-link 0.2.1",
 ]
···
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "219cb19e96be00ab2e37d6e299658a0cfa83e52429179969b0f0121b4ac46983"
 dependencies = [
- "toml_edit 0.23.9",
+ "toml_edit 0.23.10+spec-1.0.0",
 ]
 
 [[package]]
···
 version = "0.5.18"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "ed2bf2547551a7053d6fdfafda3f938979645c44812fbfcda098faae3f1a362d"
+dependencies = [
+ "bitflags 2.10.0",
+]
+
+[[package]]
+name = "redox_syscall"
+version = "0.6.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "ec96166dafa0886eb81fe1c0a388bece180fbef2135f97c1e2cf8302e74b43b5"
 dependencies = [
  "bitflags 2.10.0",
 ]
···
 
 [[package]]
 name = "rustls-pki-types"
-version = "1.13.1"
+version = "1.13.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "708c0f9d5f54ba0272468c1d306a52c495b31fa155e91bc25371e6df7996908c"
+checksum = "21e6f2ab2928ca4291b86736a8bd920a277a399bba1589409d72154ff87c1282"
 dependencies = [
  "web-time",
  "zeroize",
···
 
 [[package]]
 name = "supports-hyperlinks"
-version = "3.1.0"
+version = "3.2.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "804f44ed3c63152de6a9f90acbea1a110441de43006ea51bcce8f436196a288b"
+checksum = "e396b6523b11ccb83120b115a0b7366de372751aa6edf19844dfb13a6af97e91"
 
 [[package]]
 name = "supports-unicode"
···
 
 [[package]]
 name = "toml_datetime"
-version = "0.7.3"
+version = "0.7.5+spec-1.1.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "f2cdb639ebbc97961c51720f858597f7f24c4fc295327923af55b74c3c724533"
+checksum = "92e1cfed4a3038bc5a127e35a2d360f145e1f4b971b551a2ba5fd7aedf7e1347"
 dependencies = [
  "serde_core",
 ]
···
 
 [[package]]
 name = "toml_edit"
-version = "0.23.9"
+version = "0.23.10+spec-1.0.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "5d7cbc3b4b49633d57a0509303158ca50de80ae32c265093b24c414705807832"
+checksum = "84c8b9f757e028cee9fa244aea147aab2a9ec09d5325a9b01e0a49730c2b5269"
 dependencies = [
  "indexmap 2.12.1",
- "toml_datetime 0.7.3",
+ "toml_datetime 0.7.5+spec-1.1.0",
  "toml_parser",
  "winnow 0.7.14",
 ]
 
 [[package]]
 name = "toml_parser"
-version = "1.0.4"
+version = "1.0.6+spec-1.1.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "c0cbe268d35bdb4bb5a56a2de88d0ad0eb70af5384a99d648cd4b3d04039800e"
+checksum = "a3198b4b0a8e11f09dd03e133c0280504d0801269e9afa46362ffde1cbeebf44"
 dependencies = [
  "winnow 0.7.14",
 ]
···
 
 [[package]]
 name = "tracing"
-version = "0.1.43"
+version = "0.1.44"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "2d15d90a0b5c19378952d479dc858407149d7bb45a14de0142f6c534b16fc647"
+checksum = "63e71662fa4b2a2c3a26f570f037eb95bb1f85397f3cd8076caed2f026a6d100"
 dependencies = [
  "log",
  "pin-project-lite",
···
 
 [[package]]
 name = "tracing-core"
-version = "0.1.35"
+version = "0.1.36"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "7a04e24fab5c89c6a36eb8558c9656f30d81de51dfa4d3b45f26b21d61fa0a6c"
+checksum = "db97caf9d906fbde555dd62fa95ddba9eecfd14cb388e4f491a66d74cd5fb79a"
 dependencies = [
  "once_cell",
  "valuable",

Cargo.toml

···
 syntect = { version = "5.2.0", default-features = false }
 n0-future = "=0.1.3"
 tracing = { version = "0.1.41", default-features = false, features = ["std"] }
-markdown-weaver = { git = "https://github.com/rsform/markdown-weaver" }
-markdown-weaver-escape = { git = "https://github.com/rsform/markdown-weaver" }
+markdown-weaver = { git = "https://github.com/rsform/markdown-weaver", branch = "para-end-context" }
+markdown-weaver-escape = { git = "https://github.com/rsform/markdown-weaver", branch = "para-end-context" }
 # markdown-weaver = { path = "../markdown-weaver/markdown-weaver" }
 # markdown-weaver-escape = { path = "../markdown-weaver/markdown-weaver-escape" }
 

crates/weaver-app/assets/styling/entry.css

···
-/* Entry page layout with gutter navigation */
-.entry-page-layout {
-    display: grid;
-    grid-template-columns: minmax(200px, 1fr) minmax(0, 95ch) minmax(200px, 1fr);
-    gap: 2rem;
-    width: 100%;
+/* Entry page layout - centered content with sidenote margin */
+.entry-page {
+    --content-width: 65ch;
+    --sidenote-width: 14rem;
+    --sidenote-gap: 1.5rem;
+
+    display: flex;
+    flex-direction: column;
     min-height: 100vh;
     background: var(--color-base);
-    max-width: calc(95ch + 400px + 4rem); /* content + gutters + gaps */
+}
+
+/* Header with inline nav + metadata */
+.entry-header {
+    display: flex;
+    align-items: baseline;
+    justify-content: center;
+    gap: 1rem;
+    padding: 1.5rem 1rem;
+    max-width: calc(var(--content-width) + var(--sidenote-width) + var(--sidenote-gap) + 10rem);
     margin: 0 auto;
-    padding: 0 1rem 0 0;
+    width: 100%;
     box-sizing: border-box;
 }
 
-/* Main content area */
-.entry-content-main {
-    grid-column: 2;
-    background: var(--color-base);
+/* Nav links in header - minimal style */
+.nav-button {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    color: var(--color-subtle);
+    text-decoration: none;
+    font-size: 0.9rem;
+    white-space: nowrap;
+    transition: color 0.2s ease;
 }
 
-/* Navigation gutters */
-.nav-gutter {
-    position: sticky;
-    top: auto;
-    bottom: 2rem;
-    height: fit-content;
-    align-self: end;
+.entry-header .nav-button:hover {
+    color: var(--color-primary);
 }
 
-.nav-prev {
-    grid-column: 1;
+.entry-header .nav-button-prev {
+    flex-shrink: 1;
+    min-width: 0;
 }
 
-.nav-next {
-    grid-column: 3;
+.entry-header .nav-button-next {
+    flex-shrink: 1;
+    min-width: 0;
 }
 
-/* Navigation buttons */
-.nav-button {
+.entry-header .nav-arrow {
+    font-weight: 600;
+    color: var(--color-primary);
+    flex-shrink: 0;
+}
+
+.entry-header .nav-title {
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+/* Metadata takes center, flexes to fill */
+.entry-header .entry-metadata {
+    flex: 1;
+    max-width: var(--content-width);
+    margin: 0;
+    padding: 0;
+    border: none;
+}
+
+/* Main content area */
+.entry-content-wrapper {
+    flex: 1;
     display: flex;
-    flex-direction: column;
-    gap: 0.5rem;
-    padding: 1rem;
-    background: var(--color-surface);
-    box-shadow: 0 1px 3px color-mix(in srgb, var(--color-text) 8%, transparent);
-    text-decoration: none;
-    color: var(--color-text);
-    transition:
-        box-shadow 0.2s ease,
-        border-color 0.2s ease;
+    justify-content: center;
+    padding: 0 1rem;
 }
 
-.nav-button:hover {
-    box-shadow: 0 2px 6px color-mix(in srgb, var(--color-text) 12%, transparent);
+.entry-content-main {
+    width: var(--content-width);
+    max-width: 100%;
+    position: relative;
 }
 
-/* Dark mode: borders instead of shadows */
-@media (prefers-color-scheme: dark) {
-    .nav-button {
-        box-shadow: none;
-        border: 1px dashed var(--color-border);
-    }
+/* When sidenotes exist, shift content left to make room */
+.entry-content-main:has(.sidenote) {
+    margin-right: calc(var(--sidenote-width) + var(--sidenote-gap));
+}
 
-    .nav-button:hover {
-        box-shadow: none;
-        border-color: var(--color-primary);
-    }
+/* Footer navigation */
+.entry-footer-nav {
+    display: flex;
+    justify-content: space-between;
+    align-items: stretch;
+    gap: 2rem;
+    max-width: calc(var(--content-width) + 20rem);
+    margin: 4rem auto 2rem;
+    padding: 0 1rem;
+    width: 100%;
+    box-sizing: border-box;
 }
 
-.nav-button-prev {
+.entry-footer-nav .nav-button-prev {
     align-items: flex-start;
     text-align: left;
 }
 
-.nav-button-next {
+.entry-footer-nav .nav-button-next {
     align-items: flex-end;
     text-align: right;
+    margin-left: auto;
 }
 
-.nav-arrow {
-    font-size: 1.5rem;
+.entry-footer-nav .nav-arrow {
+    font-size: 1.25rem;
     font-weight: bold;
     color: var(--color-primary);
-    transition: color 0.2s ease;
 }
 
-.nav-button:hover .nav-arrow {
-    color: var(--color-emphasis);
+.entry-footer-nav .nav-title {
+    font-size: 0.95rem;
+    font-weight: 500;
+    line-height: 1.4;
 }
 
-.nav-button:hover .nav-label {
-    color: var(--color-secondary);
+/* Entry metadata in header context */
+.entry-header .entry-metadata .entry-title {
+    font-size: 1.75rem;
+    margin: 0 0 0.5rem 0;
 }
 
-.nav-title {
-    font-size: 0.95rem;
-    font-weight: 500;
-    line-height: 1.4;
+.entry-header .entry-metadata .entry-header-row {
+    flex-wrap: wrap;
 }
 
-/* Entry metadata header */
+/* Standalone entry metadata (when not in header) */
 .entry-metadata {
     margin-bottom: calc(1rem * var(--spacing-scale, 1.5));
     padding-bottom: calc(0.5rem * var(--spacing-scale, 1.5));
···
     background: var(--color-surface);
 }
 
-/* Responsive layout - Tablet/small desktop */
-@media (max-width: 1400px) {
-    .entry-page-layout {
-        grid-template-columns: 1fr;
-        gap: 0;
-    }
+/* TODO: footnote ordering needs non-flex solution for aside reflow to work */
 
-    .entry-content-main {
-        grid-column: 1;
-        padding: 2rem 1rem;
+/* Responsive: tablet */
+@media (max-width: 1200px) {
+    .entry-header {
+        flex-wrap: wrap;
     }
 
-    .nav-gutter {
-        position: relative;
-        bottom: auto;
-        grid-column: 1;
-        padding: 0 1rem;
+    .entry-header .entry-metadata {
+        order: -1;
+        flex-basis: 100%;
+        max-width: none;
     }
 
-    .nav-prev {
-        order: 2;
-        margin-top: 2rem;
+    .entry-header .nav-button-prev {
+        order: 0;
     }
 
-    .nav-next {
-        order: 3;
-        margin-top: 1rem;
+    .entry-header .nav-button-next {
+        order: 1;
+        margin-left: auto;
     }
+}
 
-    .entry-content-main {
-        order: 1;
+/* Responsive: when sidenotes need to squeeze */
+@media (max-width: 1000px) {
+    .entry-content-main:has(.sidenote) {
+        margin-right: calc(var(--sidenote-width) + 0.5rem);
+        margin-left: -3rem;
     }
 }
 
-/* Tablet and smaller */
+/* Responsive: narrower - compress left margin more */
 @media (max-width: 900px) {
-    .entry-page-layout {
-        max-width: 100%;
-        grid-template-columns: minmax(0, 1fr);
+    .entry-header .nav-title {
+        max-width: 8rem;
+    }
+
+    .entry-content-main:has(.sidenote) {
+        margin-left: -5rem;
     }
 }
 
-/* Small mobile phones */
-@media (max-width: 480px) {
-    .entry-content-main {
-        padding: 1rem 0.75rem;
+/* Responsive: mobile - sidenotes go inline */
+@media (max-width: 768px) {
+    .entry-header {
+        flex-direction: column;
+        align-items: stretch;
+        gap: 0.5rem;
     }
 
-    .nav-gutter {
-        padding: 0 0.75rem;
+    .entry-content-main:has(.sidenote) {
+        margin-left: 0;
+        margin-right: 0;
     }
 
-    .nav-button {
-        padding: 0.75rem;
+    .entry-footer-nav {
+        flex-direction: column;
+        gap: 1rem;
+        margin-top: 2rem;
+    }
+}
+
+/* Small mobile */
+@media (max-width: 480px) {
+    .entry-content-main {
+        padding: 0 0.75rem;
     }
 
     .entry-metadata {

crates/weaver-app/src/components/editor/actions.rs

···
         self.end.saturating_sub(self.start)
     }
 
+    #[allow(dead_code)]
     pub fn is_empty(&self) -> bool {
         self.len() == 0
     }
···
 /// These represent semantic operations on the document, decoupled from
 /// how they're triggered (keyboard, mouse, touch, voice, etc.).
 #[derive(Debug, Clone, PartialEq)]
+#[allow(dead_code)]
 pub enum EditorAction {
     // === Text Insertion ===
     /// Insert text at the given range (replacing any selected content).
···
 /// SmolStr to efficiently handle both single characters and composed sequences
 /// (from dead keys, IME, etc.).
 #[derive(Debug, Clone, PartialEq, Eq, Hash)]
+#[allow(dead_code)]
 pub enum Key {
     /// A character key. The string corresponds to the character typed,
     /// taking into account locale, modifiers, and keyboard mapping.
···
     pub super_: bool, // `super` is a keyword
 }
 
+#[allow(dead_code)]
 impl Modifiers {
     pub const NONE: Self = Self {
         ctrl: false,

crates/weaver-app/src/components/editor/beforeinput.rs

···
 ///
 /// See: https://w3c.github.io/input-events/#interface-InputEvent-Attributes
 #[derive(Debug, Clone, PartialEq, Eq)]
+#[allow(dead_code)]
 pub enum InputType {
     // === Insertion ===
     /// Insert typed text.
···
     Unknown(String),
 }
 
+#[allow(dead_code)]
 impl InputType {
     /// Parse from the browser's inputType string.
     pub fn from_str(s: &str) -> Self {
···
 
 /// Result of handling a beforeinput event.
 #[derive(Debug, Clone)]
+#[allow(dead_code)]
 pub enum BeforeInputResult {
     /// Event was handled, prevent default browser behavior.
     Handled,
···
 }
 
 /// Context for beforeinput handling.
+#[allow(dead_code)]
 pub struct BeforeInputContext<'a> {
     /// The input type.
     pub input_type: InputType,
···
 ///
 /// This is the main entry point for beforeinput-based input handling.
 /// Returns whether the event was handled and default should be prevented.
+#[allow(dead_code)]
 pub fn handle_beforeinput(
     doc: &mut EditorDocument,
     ctx: BeforeInputContext<'_>,
···
     let end_text = end_container.text_content().unwrap_or_default();
 
     // Check if containers are the editor element itself
-    let start_is_editor = start_container.dyn_ref::<web_sys::Element>()
+    let start_is_editor = start_container
+        .dyn_ref::<web_sys::Element>()
         .map(|e| e == &editor_element)
         .unwrap_or(false);
-    let end_is_editor = end_container.dyn_ref::<web_sys::Element>()
+    let end_is_editor = end_container
+        .dyn_ref::<web_sys::Element>()
         .map(|e| e == &editor_element)
         .unwrap_or(false);
 

crates/weaver-app/src/components/editor/component.rs

···
 //! The main MarkdownEditor component.
 
-use dioxus::prelude::*;
-use jacquard::IntoStatic;
-use jacquard::cowstr::ToCowStr;
-use jacquard::identity::resolver::IdentityResolver;
-use jacquard::smol_str::{SmolStr, ToSmolStr};
-use jacquard::types::aturi::AtUri;
-use jacquard::types::blob::BlobRef;
-use jacquard::types::ident::AtIdentifier;
-use weaver_api::sh_weaver::embed::images::Image;
-use weaver_common::WeaverExt;
-
+#[allow(unused_imports)]
 use super::actions::{
     EditorAction, Key, KeyCombo, KeybindingConfig, KeydownResult, Range, execute_action,
     handle_keydown_with_bindings,
 };
+#[allow(unused_imports)]
 use super::beforeinput::{BeforeInputContext, BeforeInputResult, InputType, handle_beforeinput};
 #[cfg(all(target_arch = "wasm32", target_os = "unknown"))]
 use super::beforeinput::{get_data_from_event, get_target_range_from_event};
 use super::document::{CompositionState, EditorDocument, LoadedDocState};
-use super::dom_sync::{
-    sync_cursor_from_dom, sync_cursor_from_dom_with_direction, update_paragraph_dom,
-};
+#[cfg(all(target_arch = "wasm32", target_os = "unknown"))]
+use super::dom_sync::update_paragraph_dom;
+use super::dom_sync::{sync_cursor_from_dom, sync_cursor_from_dom_with_direction};
 use super::formatting;
 use super::input::{get_char_at, handle_copy, handle_cut, handle_paste};
 use super::offset_map::SnapDirection;
 use super::paragraph::ParagraphRender;
 use super::platform;
+#[allow(unused_imports)]
 use super::publish::{LoadedEntry, PublishButton, load_entry_for_editing};
 use super::render;
 use super::storage;
 use super::sync::{SyncStatus, load_and_merge_document};
 use super::toolbar::EditorToolbar;
 use super::visibility::update_syntax_visibility;
+#[allow(unused_imports)]
 use super::writer::{EditorImageResolver, SyntaxSpanInfo};
 use crate::auth::AuthState;
 use crate::components::collab::CollaboratorAvatars;
 use crate::components::editor::ReportButton;
 use crate::components::editor::collab::CollabCoordinator;
 use crate::fetch::Fetcher;
+use dioxus::prelude::*;
+use jacquard::IntoStatic;
+use jacquard::cowstr::ToCowStr;
+use jacquard::identity::resolver::IdentityResolver;
+use jacquard::smol_str::{SmolStr, ToSmolStr};
+use jacquard::types::aturi::AtUri;
+#[cfg(all(target_arch = "wasm32", target_os = "unknown"))]
+use jacquard::types::blob::BlobRef;
+use jacquard::types::ident::AtIdentifier;
+use weaver_api::sh_weaver::embed::images::Image;
+use weaver_common::WeaverExt;
 
 /// Result of loading document state.
 enum LoadResult {
···
     /// Loading failed
     Failed(String),
     /// Still loading
+    #[allow(dead_code)]
     Loading,
 }
 
···
     let fetcher = use_context::<Fetcher>();
     let auth_state = use_context::<Signal<AuthState>>();
 
+    #[allow(unused_mut)]
     let mut document = use_hook(|| {
         let mut doc = EditorDocument::from_loaded_state(loaded_state.clone());
 
···
     let doc_for_memo = document.clone();
     let doc_for_refs = document.clone();
     let entry_index_for_memo = entry_index.clone();
+    #[allow(unused_mut)]
     let mut paragraphs = use_memo(move || {
         let edit = doc_for_memo.last_edit();
         let cache = render_cache.peek();
···
 
     let mut new_tag = use_signal(String::new);
 
+    #[allow(unused)]
     let offset_map = use_memo(move || {
         paragraphs()
             .iter()
···
             .flat_map(|p| p.syntax_spans.iter().cloned())
             .collect::<Vec<_>>()
     });
+    #[allow(unused_mut)]
     let mut cached_paragraphs = use_signal(|| Vec::<ParagraphRender>::new());
 
     #[cfg(all(target_arch = "wasm32", target_os = "unknown"))]
···
     });
 
     // Track last saved frontiers to detect changes (peek-only, no subscriptions)
+    #[allow(unused_mut, unused)]
     let mut last_saved_frontiers: Signal<Option<loro::Frontiers>> = use_signal(|| None);
 
     // Store interval handle so it's dropped when component unmounts (prevents panic)
···
                                 // Refresh callback: fetch and merge collaborator changes (incremental)
                                 let on_refresh = if is_published {
                                     let fetcher_for_refresh = fetcher.clone();
-                                    let mut doc_for_refresh = document.clone();
+                                    let doc_for_refresh = document.clone();
                                     let entry_uri = document.entry_ref().map(|r| r.uri.clone().into_static());
 
                                     Some(EventHandler::new(move |_| {
···
                             move |evt| {
                                 tracing::debug!("onclick fired - syncing cursor from DOM");
                                 let paras = cached_paragraphs();
+                                #[cfg(not(all(target_arch = "wasm32", target_os = "unknown")))]
+                                let _ = evt;
 
                                 // Check if click target is a math-clickable element
                                 #[cfg(all(target_arch = "wasm32", target_os = "unknown"))]

crates/weaver-app/src/components/editor/cursor.rs

···
 //! 3. Walking text nodes to find the UTF-16 offset within the element
 //! 4. Setting cursor with web_sys Selection API
 
-use super::offset_map::{OffsetMapping, SnapDirection, find_mapping_for_char, find_nearest_valid_position};
+use super::offset_map::OffsetMapping;
+#[cfg(all(target_family = "wasm", target_os = "unknown"))]
+use super::offset_map::{SnapDirection, find_mapping_for_char, find_nearest_valid_position};
 
 #[cfg(all(target_family = "wasm", target_os = "unknown"))]
 use wasm_bindgen::JsCast;
···
         Some((m, false)) => (m, char_offset), // Valid position, use as-is
         Some((m, true)) => {
             // Position is on invisible content, snap to nearest valid
-            if let Some(snapped) = find_nearest_valid_position(offset_map, char_offset, snap_direction) {
+            if let Some(snapped) =
+                find_nearest_valid_position(offset_map, char_offset, snap_direction)
+            {
                 tracing::trace!(
                     target: "weaver::cursor",
                     original_offset = char_offset,
···
     Err("no text node found in container".into())
 }
 
-/// Non-WASM stub for testing
-#[cfg(not(all(target_family = "wasm", target_os = "unknown")))]
-pub fn restore_cursor_position(
-    _char_offset: usize,
-    _offset_map: &[OffsetMapping],
-    _editor_id: &str,
-    _snap_direction: Option<SnapDirection>,
-) -> Result<(), String> {
-    Ok(())
-}
-
 /// Screen coordinates for a cursor position.
 #[derive(Debug, Clone, Copy)]
 pub struct CursorRect {
···
     let document = window.document()?;
 
     // Get container element
-    let container = document
-        .get_element_by_id(&mapping.node_id)
-        .or_else(|| {
-            let selector = format!("[data-node-id='{}']", mapping.node_id);
-            document.query_selector(&selector).ok().flatten()
-        })?;
+    let container = document.get_element_by_id(&mapping.node_id).or_else(|| {
+        let selector = format!("[data-node-id='{}']", mapping.node_id);
+        document.query_selector(&selector).ok().flatten()
+    })?;
 
     let range = document.create_range().ok()?;
 
···
         y: cursor_rect.y - editor_rect.y(),
         height: cursor_rect.height,
     })
-}
-
-#[cfg(not(all(target_family = "wasm", target_os = "unknown")))]
-pub fn get_cursor_rect(
-    _char_offset: usize,
-    _offset_map: &[OffsetMapping],
-    _editor_id: &str,
-) -> Option<CursorRect> {
-    None
 }
 
 #[cfg(not(all(target_family = "wasm", target_os = "unknown")))]
···
     // Set start
     if let Some(child_index) = start_mapping.child_index {
         let _ = range.set_start(&start_container, child_index as u32);
-    } else if let Ok(container_element) = start_container.clone().dyn_into::<web_sys::HtmlElement>() {
+    } else if let Ok(container_element) = start_container.clone().dyn_into::<web_sys::HtmlElement>()
+    {
         let offset_in_range = start - start_mapping.char_range.start;
         let target_utf16_offset = start_mapping.char_offset_in_node + offset_in_range;
-        if let Ok((text_node, node_offset)) = find_text_node_at_offset(&container_element, target_utf16_offset) {
+        if let Ok((text_node, node_offset)) =
+            find_text_node_at_offset(&container_element, target_utf16_offset)
+        {
             let _ = range.set_start(&text_node, node_offset as u32);
         }
     }
···
     } else if let Ok(container_element) = end_container.dyn_into::<web_sys::HtmlElement>() {
         let offset_in_range = end - end_mapping.char_range.start;
         let target_utf16_offset = end_mapping.char_offset_in_node + offset_in_range;
-        if let Ok((text_node, node_offset)) = find_text_node_at_offset(&container_element, target_utf16_offset) {
+        if let Ok((text_node, node_offset)) =
+            find_text_node_at_offset(&container_element, target_utf16_offset)
+        {
             let _ = range.set_end(&text_node, node_offset as u32);
         }
     }

crates/weaver-app/src/components/editor/dom_sync.rs

···
 //! Handles syncing cursor/selection state between the browser DOM and our
 //! internal document model, and updating paragraph DOM elements.
 
-use dioxus::prelude::*;
-
+#[cfg(all(target_arch = "wasm32", target_os = "unknown"))]
 use super::cursor::restore_cursor_position;
+#[allow(unused_imports)]
 use super::document::{EditorDocument, Selection};
+#[allow(unused_imports)]
 use super::offset_map::{SnapDirection, find_nearest_valid_position, is_valid_cursor_position};
 use super::paragraph::ParagraphRender;
+#[allow(unused_imports)]
+use dioxus::prelude::*;
 
 /// Sync internal cursor and selection state from browser DOM selection.
 ///
···
         (Some(anchor), Some(focus)) => {
             let old_offset = doc.cursor.read().offset;
             // Warn if cursor is jumping a large distance - likely a bug
-            let jump = if focus > old_offset { focus - old_offset } else { old_offset - focus };
+            let jump = if focus > old_offset {
+                focus - old_offset
+            } else {
+                old_offset - focus
+            };
             if jump > 100 {
                 tracing::warn!(
                     old_offset,
···
                         }
                     }
                     // Couldn't find containing paragraph, fall through
-                    tracing::warn!("dom_position_to_text_offset: walked up to editor but couldn't find containing paragraph");
+                    tracing::warn!(
+                        "dom_position_to_text_offset: walked up to editor but couldn't find containing paragraph"
+                    );
                     break None;
                 }
 
···
     let mut cursor_para_updated = false;
 
     // Build lookup for old paragraphs by ID (for syntax span comparison)
-    let old_para_map: HashMap<&str, &ParagraphRender> = old_paragraphs
-        .iter()
-        .map(|p| (p.id.as_str(), p))
-        .collect();
+    let old_para_map: HashMap<&str, &ParagraphRender> =
+        old_paragraphs.iter().map(|p| (p.id.as_str(), p)).collect();
 
     // Build pool of existing DOM elements by ID
     let mut old_elements: HashMap<String, web_sys::Element> = HashMap::new();
···
 
     // Track position for insertBefore - starts at first element child
     // (use first_element_child to skip any stray text nodes)
-    let mut cursor_node: Option<web_sys::Node> =
-        editor.first_element_child().map(|e| e.into());
+    let mut cursor_node: Option<web_sys::Node> = editor.first_element_child().map(|e| e.into());
 
     // Single pass through new paragraphs
     for new_para in new_paragraphs.iter() {
···
                 //
                 // HOWEVER: we must verify browser actually updated the DOM.
                 // PassThrough assumes browser handles edit, but sometimes it doesn't.
-                let should_skip_cursor_update = !FORCE_INNERHTML_UPDATE && is_cursor_para && !force && {
-                    let old_para = old_para_map.get(para_id.as_str());
-                    let syntax_unchanged = old_para
-                        .map(|old| old.syntax_spans == new_para.syntax_spans)
-                        .unwrap_or(false);
+                let should_skip_cursor_update =
+                    !FORCE_INNERHTML_UPDATE && is_cursor_para && !force && {
+                        let old_para = old_para_map.get(para_id.as_str());
+                        let syntax_unchanged = old_para
+                            .map(|old| old.syntax_spans == new_para.syntax_spans)
+                            .unwrap_or(false);
 
-                    // Verify DOM content length matches expected - if not, browser didn't handle it
-                    // NOTE: Get inner element (the <p>) not outer div, to avoid counting
-                    // the newline from </p>\n in the HTML
-                    let dom_matches_expected = if syntax_unchanged {
-                        let inner_elem = existing_elem.first_element_child();
-                        let dom_text = inner_elem
-                            .as_ref()
-                            .and_then(|e| e.text_content())
-                            .unwrap_or_default();
-                        let expected_len = new_para.byte_range.end - new_para.byte_range.start;
-                        let dom_len = dom_text.len();
-                        let matches = dom_len == expected_len;
-                        // Always log for debugging
-                        tracing::debug!(
-                            para_id = %para_id,
-                            dom_len,
-                            expected_len,
-                            matches,
-                            dom_text = %dom_text,
-                            "DOM sync check"
-                        );
-                        matches
-                    } else {
-                        false
-                    };
+                        // Verify DOM content length matches expected - if not, browser didn't handle it
+                        // NOTE: Get inner element (the <p>) not outer div, to avoid counting
+                        // the newline from </p>\n in the HTML
+                        let dom_matches_expected = if syntax_unchanged {
+                            let inner_elem = existing_elem.first_element_child();
+                            let dom_text = inner_elem
+                                .as_ref()
+                                .and_then(|e| e.text_content())
+                                .unwrap_or_default();
+                            let expected_len = new_para.byte_range.end - new_para.byte_range.start;
+                            let dom_len = dom_text.len();
+                            let matches = dom_len == expected_len;
+                            // Always log for debugging
+                            tracing::debug!(
+                                para_id = %para_id,
+                                dom_len,
+                                expected_len,
+                                matches,
+                                dom_text = %dom_text,
+                                "DOM sync check"
+                            );
+                            matches
+                        } else {
+                            false
+                        };
 
-                    syntax_unchanged && dom_matches_expected
-                };
+                        syntax_unchanged && dom_matches_expected
+                    };
 
                 if should_skip_cursor_update {
                     tracing::trace!(
···
 
     cursor_para_updated
 }
-
-#[cfg(not(all(target_arch = "wasm32", target_os = "unknown")))]
-pub fn update_paragraph_dom(
-    _editor_id: &str,
-    _old_paragraphs: &[ParagraphRender],
-    _new_paragraphs: &[ParagraphRender],
-    _cursor_offset: usize,
-    _force: bool,
-) -> bool {
-    false
-}

crates/weaver-app/src/components/editor/formatting.rs

···
 //! Formatting actions and utilities for applying markdown formatting.
 
 use super::document::EditorDocument;
+#[allow(unused_imports)]
 use super::input::{ListContext, detect_list_context, find_line_end};
 use dioxus::prelude::*;
 

crates/weaver-app/src/components/editor/input.rs

···
 
 /// Check if we need to intercept this key event.
 /// Returns true for content-modifying operations, false for navigation.
+#[allow(unused)]
 pub fn should_intercept_key(evt: &Event<KeyboardData>) -> bool {
     use dioxus::prelude::keyboard_types::Key;
 
···
 }
 
 /// Handle keyboard events and update document state.
+#[allow(unused)]
 pub fn handle_keydown(evt: Event<KeyboardData>, doc: &mut EditorDocument) {
     use dioxus::prelude::keyboard_types::Key;
 
···
 /// Handle paste events and insert text at cursor.
 pub fn handle_paste(evt: Event<ClipboardData>, doc: &mut EditorDocument) {
     evt.prevent_default();
+    #[cfg(not(all(target_arch = "wasm32", target_os = "unknown")))]
+    let _ = doc;
 
     #[cfg(all(target_arch = "wasm32", target_os = "unknown"))]
     {
···
 /// Handle cut events - extract text, write to clipboard, then delete.
 pub fn handle_cut(evt: Event<ClipboardData>, doc: &mut EditorDocument) {
     evt.prevent_default();
+    #[cfg(not(all(target_arch = "wasm32", target_os = "unknown")))]
+    let _ = doc;
 
     #[cfg(all(target_arch = "wasm32", target_os = "unknown"))]
     {

crates/weaver-app/src/components/editor/log_buffer.rs

···
 }
 
 /// Get all captured log entries as a single string.
+#[allow(dead_code)]
 pub fn get_logs() -> String {
     LOG_BUFFER.with(|buf| {
         let buf = buf.borrow();

crates/weaver-app/src/components/editor/offset_map.rs

···
 ///
 /// Returns the mapping and whether the cursor should snap to the next
 /// visible position (for invisible content).
+#[allow(dead_code)]
 pub fn find_mapping_for_char(
     offset_map: &[OffsetMapping],
     char_offset: usize,
···
 
 /// Result of finding a valid cursor position.
 #[derive(Debug, Clone)]
+#[allow(dead_code)]
 pub struct SnappedPosition<'a> {
     pub mapping: &'a OffsetMapping,
     pub offset_in_mapping: usize,
     pub snapped: Option<SnapDirection>,
 }
 
+#[allow(dead_code)]
 impl SnappedPosition<'_> {
     /// Get the absolute char offset for this position.
     pub fn char_offset(&self) -> usize {
···
 /// If the position is already valid, returns it directly. Otherwise,
 /// searches in the preferred direction first, falling back to the other
 /// direction if needed.
+#[allow(dead_code)]
 pub fn find_nearest_valid_position(
     offset_map: &[OffsetMapping],
     char_offset: usize,
···
 }
 
 /// Search for a valid position in a specific direction.
+#[allow(dead_code)]
 fn find_valid_in_direction(
     offset_map: &[OffsetMapping],
     char_offset: usize,
···
 }
 
 /// Check if a char offset is at a valid (non-invisible) cursor position.
+#[allow(dead_code)]
 pub fn is_valid_cursor_position(offset_map: &[OffsetMapping], char_offset: usize) -> bool {
     find_mapping_for_char(offset_map, char_offset)
         .map(|(m, should_snap)| !should_snap && m.utf16_len > 0)
···
         let mappings = make_test_mappings();
 
         // Position 10 is invisible (in 5..15), prefer backward to end of "alt" (position 5)
-        let pos = find_nearest_valid_position(&mappings, 10, Some(SnapDirection::Backward)).unwrap();
+        let pos =
+            find_nearest_valid_position(&mappings, 10, Some(SnapDirection::Backward)).unwrap();
         assert_eq!(pos.char_offset(), 5); // end of "alt" mapping
         assert_eq!(pos.snapped, Some(SnapDirection::Backward));
     }

crates/weaver-app/src/components/editor/platform.rs

···
 
 /// Cached platform detection results.
 #[derive(Debug, Clone)]
+#[allow(dead_code)]
 pub struct Platform {
     pub ios: bool,
     pub mac: bool,

crates/weaver-app/src/components/editor/publish.rs

···
 use jacquard::types::collection::Collection;
 use jacquard::types::ident::AtIdentifier;
 use jacquard::types::recordkey::RecordKey;
+#[allow(unused_imports)]
 use jacquard::types::string::{AtUri, Datetime, Nsid, Rkey};
 use jacquard::types::tid::Ticker;
 use jacquard::{IntoStatic, from_data, prelude::*, to_data};

crates/weaver-app/src/components/editor/render.rs

···
 //! Uses EditorWriter which tracks gaps in offset_iter to preserve formatting characters.
 
 use super::document::EditInfo;
+#[allow(unused_imports)]
 use super::offset_map::{OffsetMapping, RenderResult};
 use super::paragraph::{ParagraphRender, hash_source, make_paragraph_id, text_slice_to_string};
+#[allow(unused_imports)]
 use super::writer::{EditorImageResolver, EditorWriter, ImageResolver, SyntaxSpanInfo};
 use loro::LoroText;
 use markdown_weaver::Parser;
-use std::collections::HashMap;
 use std::ops::Range;
 use weaver_common::{EntryIndex, ResolvedContent};
 
···
         if gap_size > MIN_PARAGRAPH_BREAK_INCR {
             let gap_start_char = prev_end_char + MIN_PARAGRAPH_BREAK_INCR;
             let gap_end_char = para.char_range.start;
-            let gap_start_byte = prev_end_byte + MIN_PARAGRAPH_BREAK_INCR;
             let gap_end_byte = para.byte_range.start;
 
             let gap_node_id = format!("gap-{}-{}", gap_start_char, gap_end_char);
···
     let mut new_cached = Vec::with_capacity(paragraph_ranges.len());
     let mut all_refs: Vec<weaver_common::ExtractedRef> = Vec::new();
     // next_para_id must account for all IDs allocated by the writer
-    let mut next_para_id = parsed_para_id_start + parsed_para_count;
+    let next_para_id = parsed_para_id_start + parsed_para_count;
     let reused_count = reused_paragraphs.len();
 
     // Find which paragraph contains cursor (for stable ID assignment)
···
         parsed_count = parsed_paragraph_ranges.len(),
         "ID assignment: cursor and edit info"
     );
-
-    // Build hash->cached_para lookup for non-cursor matching
-    let cached_by_hash: HashMap<u64, &CachedParagraph> = cache
-        .map(|c| c.paragraphs.iter().map(|p| (p.source_hash, p)).collect())
-        .unwrap_or_default();
 
     for (idx, (byte_range, char_range)) in paragraph_ranges.iter().enumerate() {
         let para_source = text_slice_to_string(text, char_range.clone());

crates/weaver-app/src/components/editor/report.rs

···
 
 use dioxus::prelude::*;
 
+#[allow(unused_imports)]
 use super::log_buffer;
+#[allow(unused_imports)]
 use super::storage::load_from_storage;
 
 /// Captured report data.
···
     let email = props.email.clone();
     let submit_report = move |_| {
         let data = report_data();
+        #[allow(unused_variables)]
         let mailto_url = data.to_mailto(&email, &comment());
 
         #[cfg(all(target_arch = "wasm32", target_os = "unknown"))]

crates/weaver-app/src/components/editor/storage.rs

···
 use dioxus::prelude::*;
 #[cfg(all(target_family = "wasm", target_os = "unknown"))]
 use gloo_storage::{LocalStorage, Storage};
+#[allow(unused_imports)]
 use jacquard::IntoStatic;
+#[allow(unused_imports)]
 use jacquard::smol_str::{SmolStr, ToSmolStr};
+#[allow(unused_imports)]
 use jacquard::types::string::{AtUri, Cid};
 use loro::cursor::Cursor;
 use serde::{Deserialize, Serialize};
···
 }
 
 /// Build the full storage key from a draft key.
+#[allow(dead_code)]
 fn storage_key(key: &str) -> String {
     format!("{}{}", DRAFT_KEY_PREFIX, key)
 }

crates/weaver-app/src/components/editor/sync.rs

···
 use jacquard::prelude::*;
 use jacquard::smol_str::format_smolstr;
 use jacquard::types::blob::MimeType;
+#[allow(unused_imports)]
 use jacquard::types::collection::Collection;
 use jacquard::types::ident::AtIdentifier;
 use jacquard::types::recordkey::RecordKey;
···
 use weaver_api::sh_weaver::edit::root::Root;
 use weaver_api::sh_weaver::edit::{DocRef, DocRefValue, DraftRef, EntryRef};
 use weaver_common::constellation::{GetBacklinksQuery, RecordId};
+#[allow(unused_imports)]
 use weaver_common::{WeaverError, WeaverExt};
 
 const ROOT_NSID: &str = "sh.weaver.edit.root";

crates/weaver-app/src/components/editor/visibility.rs

···
 }
 
 /// Check if cursor is in the same paragraph as a syntax span.
+#[allow(dead_code)]
 fn cursor_in_same_paragraph(
     cursor_offset: usize,
     syntax_range: &Range<usize>,

crates/weaver-app/src/components/editor/writer.rs

···
 //!
 //! Uses Parser::into_offset_iter() to track gaps between events, which
 //! represent consumed formatting characters.
-
+#[allow(unused_imports)]
 use super::offset_map::{OffsetMapping, RenderResult};
 use jacquard::types::{ident::AtIdentifier, string::Rkey};
 use loro::LoroText;
 use markdown_weaver::{
     Alignment, BlockQuoteKind, CodeBlockKind, CowStr, EmbedType, Event, LinkType, Tag,
+    WeaverAttributes,
 };
 use markdown_weaver_escape::{
     StrWrite, escape_href, escape_html, escape_html_body_text,
···
     segments: Vec<String>,
 }
 
+#[allow(dead_code)]
 impl SegmentedWriter {
     pub fn new() -> Self {
         Self {
···
     }
 }
 
+/// Tracks the type of wrapper element emitted for WeaverBlock prefix
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+enum WrapperElement {
+    Aside,
+    Div,
+}
+
 /// HTML writer that preserves markdown formatting characters.
 ///
 /// This writer processes offset-iter events to detect gaps (consumed formatting)
···
 
     // Offset mapping tracking - current paragraph
     offset_maps: Vec<OffsetMapping>,
-    node_id_prefix: Option<String>,           // paragraph ID prefix for stable node IDs
-    auto_increment_prefix: Option<usize>,     // if set, auto-increment prefix per paragraph from this value
+    node_id_prefix: Option<String>, // paragraph ID prefix for stable node IDs
+    auto_increment_prefix: Option<usize>, // if set, auto-increment prefix per paragraph from this value
     static_prefix_override: Option<(usize, String)>, // (index, prefix) - override auto-increment at this index
-    current_paragraph_index: usize,           // which paragraph we're currently building (0-indexed)
+    current_paragraph_index: usize, // which paragraph we're currently building (0-indexed)
     next_node_id: usize,
     current_node_id: Option<String>, // node ID for current text container
     current_node_char_offset: usize, // UTF-16 offset within current node
···
     syntax_spans_by_para: Vec<Vec<SyntaxSpanInfo>>,
     refs_by_para: Vec<Vec<weaver_common::ExtractedRef>>,
 
+    // WeaverBlock prefix system
+    /// Pending WeaverBlock attrs to apply to the next block element
+    pending_block_attrs: Option<WeaverAttributes<'static>>,
+    /// Type of wrapper element currently open (needs closing on block end)
+    active_wrapper: Option<WrapperElement>,
+    /// Buffer for WeaverBlock text content (to parse for attrs)
+    weaver_block_buffer: String,
+    /// Start char offset of current WeaverBlock (for syntax span)
+    weaver_block_char_start: Option<usize>,
+
+    // Footnote syntax linking (ref ↔ definition visibility)
+    /// Maps footnote name → (syntax_span_index, char_start) for linking ref and def
+    footnote_ref_spans: HashMap<String, (usize, usize)>,
+    /// Current footnote definition being processed (name, syntax_span_index, char_start)
+    current_footnote_def: Option<(String, usize, usize)>,
+
     _phantom: std::marker::PhantomData<&'a ()>,
 }
 
···
             offset_maps_by_para: Vec::new(),
             syntax_spans_by_para: Vec::new(),
             refs_by_para: Vec::new(),
+            pending_block_attrs: None,
+            active_wrapper: None,
+            weaver_block_buffer: String::new(),
+            weaver_block_char_start: None,
+            footnote_ref_spans: HashMap::new(),
+            current_footnote_def: None,
             _phantom: std::marker::PhantomData,
         }
     }
···
             offset_maps_by_para: self.offset_maps_by_para,
             syntax_spans_by_para: self.syntax_spans_by_para,
             refs_by_para: self.refs_by_para,
+            pending_block_attrs: self.pending_block_attrs,
+            active_wrapper: self.active_wrapper,
+            weaver_block_buffer: self.weaver_block_buffer,
+            weaver_block_char_start: self.weaver_block_char_start,
+            footnote_ref_spans: self.footnote_ref_spans,
+            current_footnote_def: self.current_footnote_def,
             _phantom: std::marker::PhantomData,
         }
     }
···
     }
 
     /// Get the next paragraph ID that would be assigned (for tracking allocations).
+    #[allow(dead_code)]
     pub fn next_paragraph_id(&self) -> Option<usize> {
         self.auto_increment_prefix
     }
···
     }
 
     // Consume raw text events until end tag, for alt attributes
+    #[allow(dead_code)]
     fn raw_text(&mut self) -> Result<(), fmt::Error> {
         use Event::*;
         let mut nest = 0;
···
         }
     }
 
+    /// Parse WeaverBlock text content into attributes.
+    /// Format: comma-separated, colon for key:value, otherwise class.
+    /// Example: ".aside, width: 300px" -> classes: ["aside"], attrs: [("width", "300px")]
+    fn parse_weaver_attrs(text: &str) -> WeaverAttributes<'static> {
+        let mut classes = Vec::new();
+        let mut attrs = Vec::new();
+
+        for part in text.split(',') {
+            let part = part.trim();
+            if part.is_empty() {
+                continue;
+            }
+
+            if let Some((key, value)) = part.split_once(':') {
+                let key = key.trim();
+                let value = value.trim();
+                if !key.is_empty() && !value.is_empty() {
+                    attrs.push((CowStr::from(key.to_string()), CowStr::from(value.to_string())));
+                }
+            } else {
+                // No colon - treat as class, strip leading dot if present
+                let class = part.strip_prefix('.').unwrap_or(part);
+                if !class.is_empty() {
+                    classes.push(CowStr::from(class.to_string()));
+                }
+            }
+        }
+
+        WeaverAttributes { classes, attrs }
+    }
+
+    /// Emit wrapper element start based on pending block attrs.
+    /// Returns true if a wrapper was emitted.
+    fn emit_wrapper_start(&mut self) -> Result<bool, fmt::Error> {
+        if let Some(attrs) = self.pending_block_attrs.take() {
+            let is_aside = attrs.classes.iter().any(|c| c.as_ref() == "aside");
+
+            if !self.end_newline {
+                self.write("\n")?;
+            }
+
+            if is_aside {
+                self.write("<aside")?;
+                self.active_wrapper = Some(WrapperElement::Aside);
+            } else {
+                self.write("<div")?;
+                self.active_wrapper = Some(WrapperElement::Div);
+            }
+
+            // Write classes (excluding "aside" if using <aside> element)
+            let classes: Vec<_> = if is_aside {
+                attrs
+                    .classes
+                    .iter()
+                    .filter(|c| c.as_ref() != "aside")
+                    .collect()
+            } else {
+                attrs.classes.iter().collect()
+            };
+
+            if !classes.is_empty() {
+                self.write(" class=\"")?;
+                for (i, class) in classes.iter().enumerate() {
+                    if i > 0 {
+                        self.write(" ")?;
+                    }
+                    escape_html(&mut self.writer, class)?;
+                }
+                self.write("\"")?;
+            }
+
+            // Write other attrs
+            for (attr, value) in &attrs.attrs {
+                self.write(" ")?;
+                escape_html(&mut self.writer, attr)?;
+                self.write("=\"")?;
+                escape_html(&mut self.writer, value)?;
+                self.write("\"")?;
+            }
+
+            self.write(">\n")?;
+            Ok(true)
+        } else {
+            Ok(false)
+        }
+    }
+
+    /// Close active wrapper element if one is open
+    fn close_wrapper(&mut self) -> Result<(), fmt::Error> {
+        if let Some(wrapper) = self.active_wrapper.take() {
+            match wrapper {
+                WrapperElement::Aside => self.write("</aside>\n")?,
+                WrapperElement::Div => self.write("</div>\n")?,
+            }
+        }
+        Ok(())
+    }
+
     fn process_event(&mut self, event: Event<'_>, range: Range<usize>) -> Result<(), fmt::Error> {
         use Event::*;
 
···
                     escape_html(&mut self.writer, spaces)?;
                     self.write("</span>")?;
 
-                    // Record syntax span info
-                    // self.syntax_spans.push(SyntaxSpanInfo {
-                    //     syn_id,
-                    //     char_range: char_start..char_end,
-                    //     syntax_type: SyntaxType::Inline,
-                    //     formatted_range: None,
-                    // });
-
                     // Count this span as a child
                     self.current_node_child_count += 1;
 
···
 
                     // After <br>, emit plain zero-width space for cursor positioning
                     self.write(" ")?;
-                    //self.write("\u{200B}")?;
 
                     // Count the zero-width space text node as a child
                     self.current_node_child_count += 1;
···
                 self.write("<div class=\"toggle-block\"><hr /></div>\n")?;
             }
             FootnoteReference(name) => {
+                // Get/create footnote number
                 let len = self.numbers.len() + 1;
-                self.write("<sup class=\"footnote-reference\"><a href=\"#")?;
-                escape_html(&mut self.writer, &name)?;
-                self.write("\">")?;
                 let number = *self.numbers.entry(name.to_string()).or_insert(len);
-                write!(&mut self.writer, "{}", number)?;
-                self.write("</a></sup>")?;
+
+                // Emit the [^name] syntax as a hideable syntax span
+                let raw_text = &self.source[range.clone()];
+                let char_start = self.last_char_offset;
+                let syntax_char_len = raw_text.chars().count();
+                let char_end = char_start + syntax_char_len;
+                let syn_id = self.gen_syn_id();
+
+                write!(
+                    &mut self.writer,
+                    "<span class=\"md-syntax-inline\" data-syn-id=\"{}\" data-char-start=\"{}\" data-char-end=\"{}\" spellcheck=\"false\">",
+                    syn_id, char_start, char_end
+                )?;
+                escape_html(&mut self.writer, raw_text)?;
+                self.write("</span>")?;
+
+                // Track this span for linking with the footnote definition later
+                let span_index = self.syntax_spans.len();
+                self.syntax_spans.push(SyntaxSpanInfo {
+                    syn_id,
+                    char_range: char_start..char_end,
+                    syntax_type: SyntaxType::Inline,
+                    formatted_range: None, // Set when we see the definition
+                });
+                self.footnote_ref_spans
+                    .insert(name.to_string(), (span_index, char_start));
+
+                // Record offset mapping for the syntax span content
+                self.record_mapping(range.clone(), char_start..char_end);
+
+                // Count as child
+                self.current_node_child_count += 1;
+
+                // Emit the visible footnote reference (superscript number)
+                write!(
+                    &mut self.writer,
+                    "<sup class=\"footnote-reference\"><a href=\"#fn-{}\">{}</a></sup>",
+                    name, number
+                )?;
+
+                // Update tracking
+                self.last_char_offset = char_end;
+                self.last_byte_offset = range.end;
             }
             TaskListMarker(checked) => {
                 // Emit the [ ] or [x] syntax
···
                     self.write("<input disabled=\"\" type=\"checkbox\"/>\n")?;
                 }
             }
-            WeaverBlock(_) => {}
+            WeaverBlock(text) => {
+                // Buffer WeaverBlock content for parsing on End
+                self.weaver_block_buffer.push_str(&text);
+            }
         }
         Ok(())
     }
···
 
                 Ok(())
             }
-            Tag::Paragraph => {
+            Tag::Paragraph(_) => {
+                // Handle wrapper before block
+                self.emit_wrapper_start()?;
+
                 // Record paragraph start for boundary tracking
                 // BUT skip if inside a list - list owns the paragraph boundary
                 if self.list_depth == 0 {
···
                 classes,
                 attrs,
             } => {
+                // Emit wrapper if pending (but don't close on heading end - wraps following block too)
+                self.emit_wrapper_start()?;
+
                 // Record paragraph start for boundary tracking
                 // Treat headings as paragraph-level blocks
                 self.current_paragraph_start = Some((self.last_byte_offset, self.last_char_offset));
···
                     self.in_non_writing_block = true; // Suppress content output
                     Ok(())
                 } else {
+                    self.emit_wrapper_start()?;
                     self.table_alignments = alignments;
                     self.write("<table>")
                 }
···
                 }
             }
             Tag::BlockQuote(kind) => {
+                self.emit_wrapper_start()?;
+
                 let class_str = match kind {
                     None => "",
                     Some(BlockQuoteKind::Note) => " class=\"markdown-alert-note\"",
···
                 Ok(())
             }
             Tag::CodeBlock(info) => {
+                self.emit_wrapper_start()?;
+
                 // Track code block as paragraph-level block
                 self.current_paragraph_start = Some((self.last_byte_offset, self.last_char_offset));
 
···
                 }
             }
             Tag::List(Some(1)) => {
+                self.emit_wrapper_start()?;
                 // Track list as paragraph-level block
                 self.current_paragraph_start = Some((self.last_byte_offset, self.last_char_offset));
                 self.list_depth += 1;
···
                 }
             }
             Tag::List(Some(start)) => {
+                self.emit_wrapper_start()?;
                 // Track list as paragraph-level block
                 self.current_paragraph_start = Some((self.last_byte_offset, self.last_char_offset));
                 self.list_depth += 1;
···
                 self.write("\">\n")
             }
             Tag::List(None) => {
+                self.emit_wrapper_start()?;
                 // Track list as paragraph-level block
                 self.current_paragraph_start = Some((self.last_byte_offset, self.last_char_offset));
                 self.list_depth += 1;
···
                 Ok(())
             }
             Tag::DefinitionList => {
+                self.emit_wrapper_start()?;
                 if self.end_newline {
                     self.write("<dl>\n")
                 } else {
···
                 id,
                 attrs,
             } => self.write_embed(range, embed_type, dest_url, title, id, attrs),
-            Tag::WeaverBlock(_, _) => {
+            Tag::WeaverBlock(_, attrs) => {
                 self.in_non_writing_block = true;
+                self.weaver_block_buffer.clear();
+                self.weaver_block_char_start = Some(self.last_char_offset);
+                // Store attrs from Start tag, will merge with parsed text on End
+                if !attrs.classes.is_empty() || !attrs.attrs.is_empty() {
+                    self.pending_block_attrs = Some(attrs.into_static());
+                }
                 Ok(())
             }
             Tag::FootnoteDefinition(name) => {
-                if self.end_newline {
-                    self.write("<div class=\"footnote-definition\" id=\"")?;
-                } else {
-                    self.write("\n<div class=\"footnote-definition\" id=\"")?;
+                // Emit the [^name]: prefix as a hideable syntax span
+                // The source should have "[^name]: " at the start
+                let prefix = format!("[^{}]: ", name);
+                let char_start = self.last_char_offset;
+                let prefix_char_len = prefix.chars().count();
+                let char_end = char_start + prefix_char_len;
+                let syn_id = self.gen_syn_id();
+
+                if !self.end_newline {
+                    self.write("\n")?;
                 }
-                escape_html(&mut self.writer, &name)?;
-                self.write("\"><sup class=\"footnote-definition-label\">")?;
+
+                write!(
+                    &mut self.writer,
+                    "<span class=\"md-syntax-block\" data-syn-id=\"{}\" data-char-start=\"{}\" data-char-end=\"{}\" spellcheck=\"false\">",
+                    syn_id, char_start, char_end
+                )?;
+                escape_html(&mut self.writer, &prefix)?;
+                self.write("</span>")?;
+
+                // Track this span for linking with the footnote reference
+                let def_span_index = self.syntax_spans.len();
+                self.syntax_spans.push(SyntaxSpanInfo {
+                    syn_id,
+                    char_range: char_start..char_end,
+                    syntax_type: SyntaxType::Block,
+                    formatted_range: None, // Set at FootnoteDefinition end
+                });
+
+                // Store the definition info for linking at end
+                self.current_footnote_def = Some((name.to_string(), def_span_index, char_start));
+
+                // Record offset mapping for the syntax span
+                self.record_mapping(range.start..range.start + prefix.len(), char_start..char_end);
+
+                // Update tracking for the prefix
+                self.last_char_offset = char_end;
+                self.last_byte_offset = range.start + prefix.len();
+
+                // Emit the definition container
+                write!(
+                    &mut self.writer,
+                    "<div class=\"footnote-definition\" id=\"fn-{}\">",
+                    name
+                )?;
+
+                // Get/create footnote number for the label
                 let len = self.numbers.len() + 1;
                 let number = *self.numbers.entry(name.to_string()).or_insert(len);
-                write!(&mut self.writer, "{}", number)?;
-                self.write("</sup>")
+                write!(
+                    &mut self.writer,
+                    "<sup class=\"footnote-definition-label\">{}</sup>",
+                    number
+                )?;
+
+                Ok(())
             }
             Tag::MetadataBlock(_) => {
                 self.in_non_writing_block = true;
···
                 }
                 Ok(())
             }
-            TagEnd::Paragraph => {
+            TagEnd::Paragraph(_) => {
                 // Capture paragraph boundary info BEFORE writing closing HTML
                 // Skip if inside a list - list owns the paragraph boundary
                 let para_boundary = if self.list_depth == 0 {
···
                 // Write closing HTML to current segment
                 self.end_node();
                 self.write("</p>\n")?;
+                self.close_wrapper()?;
 
                 // Now finalize paragraph (starts new segment)
                 if let Some((byte_range, char_range)) = para_boundary {
···
                 self.write("</")?;
                 write!(&mut self.writer, "{}", level)?;
                 self.write(">\n")?;
+                // Note: Don't close wrapper here - headings typically go with following block
 
                 // Now finalize paragraph (starts new segment)
                 if let Some((byte_range, char_range)) = para_boundary {
···
                     }
                 }
                 self.write("</blockquote>\n")?;
+                self.close_wrapper()?;
 
                 // Now finalize paragraph if we had one
                 if let Some((byte_range, char_range)) = para_boundary {
···
                         });
 
                 self.write("</ol>\n")?;
+                self.close_wrapper()?;
 
                 // Finalize paragraph after closing HTML
                 if let Some((byte_range, char_range)) = para_boundary {
···
                         });
 
                 self.write("</ul>\n")?;
+                self.close_wrapper()?;
 
                 // Finalize paragraph after closing HTML
                 if let Some((byte_range, char_range)) = para_boundary {
···
                 self.end_node();
                 self.write("</li>\n")
             }
-            TagEnd::DefinitionList => self.write("</dl>\n"),
+            TagEnd::DefinitionList => {
+                self.write("</dl>\n")?;
+                self.close_wrapper()
+            }
             TagEnd::DefinitionListTitle => {
                 self.end_node();
                 self.write("</dt>\n")
···
             TagEnd::Embed => Ok(()),
             TagEnd::WeaverBlock(_) => {
                 self.in_non_writing_block = false;
+
+                // Emit the { content } as a hideable syntax span
+                if let Some(char_start) = self.weaver_block_char_start.take() {
+                    // Build the full syntax text: { buffered_content }
+                    let syntax_text = format!("{{{}}}", self.weaver_block_buffer);
+                    let syntax_char_len = syntax_text.chars().count();
+                    let char_end = char_start + syntax_char_len;
+
+                    let syn_id = self.gen_syn_id();
+
+                    write!(
+                        &mut self.writer,
+                        "<span class=\"md-syntax-block\" data-syn-id=\"{}\" data-char-start=\"{}\" data-char-end=\"{}\" spellcheck=\"false\">",
+                        syn_id, char_start, char_end
+                    )?;
+                    escape_html(&mut self.writer, &syntax_text)?;
+                    self.write("</span>")?;
+
+                    // Track the syntax span
+                    self.syntax_spans.push(SyntaxSpanInfo {
+                        syn_id,
+                        char_range: char_start..char_end,
+                        syntax_type: SyntaxType::Block,
+                        formatted_range: None,
+                    });
+
+                    // Record offset mapping for the syntax span
+                    self.record_mapping(range.clone(), char_start..char_end);
+
+                    // Update tracking
+                    self.last_char_offset = char_end;
+                    self.last_byte_offset = range.end;
+                }
+
+                // Parse the buffered text for attrs and store for next block
+                if !self.weaver_block_buffer.is_empty() {
+                    let parsed = Self::parse_weaver_attrs(&self.weaver_block_buffer);
+                    self.weaver_block_buffer.clear();
+                    // Merge with any existing pending attrs or set new
+                    if let Some(ref mut existing) = self.pending_block_attrs {
+                        existing.classes.extend(parsed.classes);
+                        existing.attrs.extend(parsed.attrs);
+                    } else {
+                        self.pending_block_attrs = Some(parsed);
+                    }
+                }
+
                 Ok(())
             }
-            TagEnd::FootnoteDefinition => self.write("</div>\n"),
+            TagEnd::FootnoteDefinition => {
+                self.write("</div>\n")?;
+
+                // Link the footnote definition span with its reference span
+                if let Some((name, def_span_index, _def_char_start)) =
+                    self.current_footnote_def.take()
+                {
+                    let def_char_end = self.last_char_offset;
+
+                    // Look up the reference span
+                    if let Some(&(ref_span_index, ref_char_start)) =
+                        self.footnote_ref_spans.get(&name)
+                    {
+                        // Create formatted_range spanning from ref start to def end
+                        let formatted_range = ref_char_start..def_char_end;
+
+                        // Update both spans with the same formatted_range
+                        // so they show/hide together based on cursor proximity
+                        if let Some(ref_span) = self.syntax_spans.get_mut(ref_span_index) {
+                            ref_span.formatted_range = Some(formatted_range.clone());
+                        }
+                        if let Some(def_span) = self.syntax_spans.get_mut(def_span_index) {
+                            def_span.formatted_range = Some(formatted_range);
+                        }
+                    }
+                }
+
+                Ok(())
+            }
             TagEnd::MetadataBlock(_) => {
                 self.in_non_writing_block = false;
                 Ok(())

crates/weaver-app/src/components/entry.rs

···
 
     tracing::info!("Entry: {book_title} - {title}");
 
+    let prev_entry = book_entry_view().prev.clone();
+    let next_entry = book_entry_view().next.clone();
+
     rsx! {
         EntryOgMeta {
             title: title.to_string(),
···
         }
         document::Link { rel: "stylesheet", href: ENTRY_CSS }
 
-        div { class: "entry-page-layout",
-            // Left gutter with prev button
-            if let Some(ref prev) = book_entry_view().prev {
-                div { class: "nav-gutter nav-prev",
+        div { class: "entry-page",
+            // Header: nav prev + metadata + nav next
+            header { class: "entry-header",
+                if let Some(ref prev) = prev_entry {
                     NavButton {
                         direction: "prev",
                         entry: prev.entry.clone(),
···
                         book_title: book_title()
                     }
                 }
-            }
 
-            // Main content area
-            div { class: "entry-content-main notebook-content",
-                // Metadata header
                 {
                     let (word_count, reading_time_mins) = calculate_reading_stats(&entry_record().content);
                     rsx! {
···
                     }
                 }
 
-                // Rendered markdown
-                EntryMarkdown {
-                    content: entry_record,
-                    ident
+                if let Some(ref next) = next_entry {
+                    NavButton {
+                        direction: "next",
+                        entry: next.entry.clone(),
+                        ident: ident(),
+                        book_title: book_title()
+                    }
+                }
+            }
+
+            // Main content area
+            div { class: "entry-content-wrapper",
+                div { class: "entry-content-main notebook-content",
+                    EntryMarkdown {
+                        content: entry_record,
+                        ident
+                    }
                 }
             }
 
-            // Right gutter with next button
-            if let Some(ref next) = book_entry_view().next {
-                div { class: "nav-gutter nav-next",
+            // Footer navigation
+            footer { class: "entry-footer-nav",
+                if let Some(ref prev) = prev_entry {
+                    NavButton {
+                        direction: "prev",
+                        entry: prev.entry.clone(),
+                        ident: ident(),
+                        book_title: book_title()
+                    }
+                }
+
+                if let Some(ref next) = next_entry {
                     NavButton {
                         direction: "next",
                         entry: next.entry.clone(),
···
     }
 }
 
-/// Navigation button for prev/next entries
+/// Navigation link for prev/next entries (minimal: arrow + title)
 #[component]
 pub fn NavButton(
     direction: &'static str,
···
         .map(|t| t.as_ref())
         .unwrap_or("Untitled");
 
-    // Get path from view for URL, fallback to title
     let entry_path = entry
         .path
         .as_ref()
         .map(|p| p.as_ref().to_string())
         .unwrap_or_else(|| entry_title.to_string());
 
-    let arrow = if direction == "prev" { "←" } else { "→" };
+    let (arrow, title_first) = if direction == "prev" {
+        ("←", false)
+    } else {
+        ("→", true)
+    };
 
     rsx! {
         Link {
···
                 title: entry_path.into()
             },
             class: "nav-button nav-button-{direction}",
-            div { class: "nav-arrow", "{arrow}" }
-            div { class: "nav-title", "{entry_title}" }
+            if title_first {
+                span { class: "nav-title", "{entry_title}" }
+                span { class: "nav-arrow", "{arrow}" }
+            } else {
+                span { class: "nav-arrow", "{arrow}" }
+                span { class: "nav-title", "{entry_title}" }
+            }
         }
     }
 }

crates/weaver-renderer/src/atproto.rs

···
 pub use preprocess::AtProtoPreprocessContext;
 pub use types::{BlobInfo, BlobName};
 pub use writer::{ClientWriter, EmbedContentProvider};
+
+#[cfg(test)]
+mod tests;

crates/weaver-renderer/src/atproto/markdown_writer.rs

···
 
     fn start_tag(&mut self, tag: Tag<'_>) -> Result<(), W::Error> {
         match tag {
-            Tag::Paragraph => Ok(()),
+            Tag::Paragraph(_) => Ok(()),
             Tag::Heading { level, .. } => {
                 write!(self.writer, "{} ", "#".repeat(level as usize))
             }
···
 
     fn end_tag(&mut self, tag: TagEnd) -> Result<(), W::Error> {
         match tag {
-            TagEnd::Paragraph => write!(self.writer, "\n\n"),
+            TagEnd::Paragraph(_) => write!(self.writer, "\n\n"),
             TagEnd::Heading(_) => write!(self.writer, "\n\n"),
             TagEnd::BlockQuote(_) => write!(self.writer, "\n\n"),
             TagEnd::CodeBlock => write!(self.writer, "```\n\n"),
···
 #[cfg(test)]
 mod tests {
     use super::*;
-    use markdown_weaver::{Event, Tag, CowStr};
+    use markdown_weaver::{Event, Tag, CowStr, ParagraphContext};
     use markdown_weaver_escape::FmtWriter;
 
     #[test]
···
         let mut output = String::new();
         let mut writer = MarkdownWriter::new(FmtWriter(&mut output));
 
-        writer.write_event(Event::Start(Tag::Paragraph)).unwrap();
+        writer.write_event(Event::Start(Tag::Paragraph(ParagraphContext::Complete))).unwrap();
         writer.write_event(Event::Text(CowStr::Borrowed("Hello"))).unwrap();
-        writer.write_event(Event::End(markdown_weaver::TagEnd::Paragraph)).unwrap();
+        writer.write_event(Event::End(markdown_weaver::TagEnd::Paragraph(ParagraphContext::Complete))).unwrap();
 
         assert_eq!(output, "Hello\n\n");
     }

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__blockquote_rendering.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<blockquote>
+<p>This is a quote</p>
+<p>With multiple lines</p>
+</blockquote>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__code_block_rendering.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<pre><code class="wvc-code language-Rust"><span class="wvc-source wvc-rust"><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-storage wvc-type wvc-function wvc-rust">fn</span> </span><span class="wvc-entity wvc-name wvc-function wvc-rust">main</span></span><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-function wvc-parameters wvc-rust"><span class="wvc-punctuation wvc-section wvc-parameters wvc-begin wvc-rust">(</span></span><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-function wvc-parameters wvc-rust"><span class="wvc-punctuation wvc-section wvc-parameters wvc-end wvc-rust">)</span></span></span></span><span class="wvc-meta wvc-function wvc-rust"> </span><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-block wvc-rust"><span class="wvc-punctuation wvc-section wvc-block wvc-begin wvc-rust">{</span>
+    <span class="wvc-support wvc-macro wvc-rust">println!</span><span class="wvc-meta wvc-group wvc-rust"><span class="wvc-punctuation wvc-section wvc-group wvc-begin wvc-rust">(</span></span><span class="wvc-meta wvc-group wvc-rust"><span class="wvc-string wvc-quoted wvc-double wvc-rust"><span class="wvc-punctuation wvc-definition wvc-string wvc-begin wvc-rust">&quot;</span>Hello<span class="wvc-punctuation wvc-definition wvc-string wvc-end wvc-rust">&quot;</span></span></span><span class="wvc-meta wvc-group wvc-rust"><span class="wvc-punctuation wvc-section wvc-group wvc-end wvc-rust">)</span></span><span class="wvc-punctuation wvc-terminator wvc-rust">;</span>
+</span><span class="wvc-meta wvc-block wvc-rust"><span class="wvc-punctuation wvc-section wvc-block wvc-end wvc-rust">}</span></span></span>
+</span></code></pre>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__footnote_in_blockquote.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<blockquote>
+<p>Quote with footnote<sup class="footnote-reference"><a href="#q">1</a></sup>.</p>
+</blockquote>
+<div class="footnote-definition" id="q"><sup class="footnote-definition-label">1</sup>
+<p>Footnote for quote.</p>
+</div>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__footnote_multiple.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<p>First<sup class="footnote-reference"><a href="#1">1</a></sup> and second<sup class="footnote-reference"><a href="#2">2</a></sup> footnotes.</p>
+<div class="footnote-definition" id="1"><sup class="footnote-definition-label">1</sup>
+<p>First note.</p>
+</div>
+<div class="footnote-definition" id="2"><sup class="footnote-definition-label">2</sup>
+<p>Second note.</p>
+</div>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__footnote_named.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<p>Reference<label for="sn-1" class="margin-toggle sidenote-number"></label><input type="checkbox" id="sn-1" class="margin-toggle"/><span class="sidenote">Named footnote content.</span>.</p>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__footnote_sidenote_inline.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<p>Here is text<label for="sn-1" class="margin-toggle sidenote-number"></label><input type="checkbox" id="sn-1" class="margin-toggle"/><span class="sidenote">Sidenote content.</span></p>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__footnote_traditional.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<p>Here is some text<label for="sn-1" class="margin-toggle sidenote-number"></label><input type="checkbox" id="sn-1" class="margin-toggle"/><span class="sidenote">This is the footnote definition.</span>.</p>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__footnote_with_inline_formatting.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<p>Text with footnote<label for="sn-1" class="margin-toggle sidenote-number"></label><input type="checkbox" id="sn-1" class="margin-toggle"/><span class="sidenote">Note with <strong>bold</strong> and <em>italic</em>.</span>.</p>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__heading_rendering.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<h1>Heading 1</h1>
+<h2>Heading 2</h2>
+<h3>Heading 3</h3>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__list_rendering.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<ul>
+<li>Item 1</li>
+<li>Item 2
+<ul>
+<li>Nested</li>
+</ul>
+</li>
+</ul>
+<ol>
+<li>Ordered 1</li>
+<li>Ordered 2</li>
+</ol>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__math_rendering.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<p>Inline <span class="math math-inline"><math display="inline"><msup><mi>x</mi><mn>2</mn></msup></math></span> and display:</p>
+<p><span class="math math-display"><math display="block"><mi>y</mi><mo>=</mo><mi>m</mi><mi>x</mi><mo>+</mo><mi>b</mi></math></span></p>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__paragraph_rendering.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<p>This is a paragraph.</p>
+<p>This is another paragraph.</p>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__table_rendering.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<table><thead><tr><th style="text-align: left">Left</th><th style="text-align: center">Center</th><th style="text-align: right">Right</th></tr></thead><tbody>
+<tr><td style="text-align: left">A</td><td style="text-align: center">B</td><td style="text-align: right">C</td></tr>
+</tbody></table>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__weaver_block_aside_class.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<aside>
+<p>This paragraph should be in an aside.</p>
+</aside>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__weaver_block_before_blockquote.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<aside>
+<blockquote>
+<p>This blockquote is in an aside.</p>
+</aside>
+</blockquote>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__weaver_block_before_code_block.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<aside>
+<pre><code class="wvc-code language-Rust"><span class="wvc-source wvc-rust"><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-storage wvc-type wvc-function wvc-rust">fn</span> </span><span class="wvc-entity wvc-name wvc-function wvc-rust">main</span></span><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-function wvc-parameters wvc-rust"><span class="wvc-punctuation wvc-section wvc-parameters wvc-begin wvc-rust">(</span></span><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-function wvc-parameters wvc-rust"><span class="wvc-punctuation wvc-section wvc-parameters wvc-end wvc-rust">)</span></span></span></span><span class="wvc-meta wvc-function wvc-rust"> </span><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-block wvc-rust"><span class="wvc-punctuation wvc-section wvc-block wvc-begin wvc-rust">{</span></span><span class="wvc-meta wvc-block wvc-rust"><span class="wvc-punctuation wvc-section wvc-block wvc-end wvc-rust">}</span></span></span>
+</span></code></pre>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__weaver_block_before_heading.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<aside>
+<h2>Heading in aside</h2>
+<p>Paragraph also in aside.</p>
+</aside>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__weaver_block_before_list.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<aside>
+<ul>
+<li>Item 1</li>
+<li>Item 2</li>
+</ul>
+</aside>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__weaver_block_custom_attributes.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<div class="foo" width="300px" data-test="value">
+<p>Paragraph with class and attributes.</p>
+</div>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__weaver_block_custom_class.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<div class="highlight">
+<p>This paragraph has a custom class.</p>
+</div>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__weaver_block_multiple_classes.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<aside class="highlight important">
+<p>Multiple classes applied.</p>
+</aside>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__weaver_block_no_effect_on_following.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<aside>
+<p>First paragraph in aside.</p>
+</aside>
+<p>Second paragraph NOT in aside.</p>

crates/weaver-renderer/src/atproto/snapshots/weaver_renderer__atproto__tests__weaver_block_with_footnote.snap

···
+---
+source: crates/weaver-renderer/src/atproto/tests.rs
+expression: output
+---
+<aside>
+<p>Aside with a footnote<label for="sn-1" class="margin-toggle sidenote-number"></label><input type="checkbox" id="sn-1" class="margin-toggle"/><span class="sidenote">Footnote in aside context.</span>.</p>
+</aside>

crates/weaver-renderer/src/atproto/tests.rs

···
+//! Tests for the AT Protocol ClientWriter
+//!
+//! These tests verify that ClientWriter produces the same output as StaticPageWriter
+//! for core markdown rendering, particularly footnotes/sidenotes.
+
+use super::writer::ClientWriter;
+use markdown_weaver::Parser;
+use markdown_weaver_escape::FmtWriter;
+
+/// Helper: Render markdown to HTML using ClientWriter
+fn render_markdown(input: &str) -> String {
+    let options = crate::default_md_options();
+    let parser = Parser::new_ext(input, options);
+    let mut output = String::new();
+    let writer: ClientWriter<'_, _, _, ()> = ClientWriter::new(parser, FmtWriter(&mut output));
+    writer.run().unwrap();
+    output
+}
+
+// =============================================================================
+// Basic Rendering Tests
+// =============================================================================
+
+#[test]
+fn test_smoke() {
+    let output = render_markdown("Hello world");
+    assert!(output.contains("Hello world"));
+}
+
+#[test]
+fn test_paragraph_rendering() {
+    let input = "This is a paragraph.\n\nThis is another paragraph.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_heading_rendering() {
+    let input = "# Heading 1\n\n## Heading 2\n\n### Heading 3";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_list_rendering() {
+    let input = "- Item 1\n- Item 2\n  - Nested\n\n1. Ordered 1\n2. Ordered 2";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_code_block_rendering() {
+    let input = "```rust\nfn main() {\n    println!(\"Hello\");\n}\n```";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_table_rendering() {
+    let input = "| Left | Center | Right |\n|:-----|:------:|------:|\n| A | B | C |";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_blockquote_rendering() {
+    let input = "> This is a quote\n>\n> With multiple lines";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_math_rendering() {
+    let input = "Inline $x^2$ and display:\n\n$$\ny = mx + b\n$$";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_empty_input() {
+    let output = render_markdown("");
+    assert_eq!(output, "");
+}
+
+#[test]
+fn test_html_and_special_characters() {
+    // ClientWriter wraps inline HTML in spans to contain embeds etc
+    let input =
+        "Text with <special> & some text. Valid tags: <em>emphasis</em> and <strong>bold</strong>";
+    let output = render_markdown(input);
+    assert!(output.contains("&amp;"));
+    // Inline HTML gets wrapped in html-embed spans
+    assert!(output.contains("html-embed-inline"));
+    assert!(output.contains("<special>"));
+}
+
+#[test]
+fn test_unicode_content() {
+    let input = "Unicode: 你好 🎉 café";
+    let output = render_markdown(input);
+    assert!(output.contains("你好"));
+    assert!(output.contains("🎉"));
+    assert!(output.contains("café"));
+}
+
+// =============================================================================
+// WeaverBlock Prefix Tests
+// =============================================================================
+
+#[test]
+fn test_weaver_block_aside_class() {
+    let input = "\n\n{.aside}\nThis paragraph should be in an aside.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_weaver_block_custom_class() {
+    let input = "\n\n{.highlight}\nThis paragraph has a custom class.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_weaver_block_custom_attributes() {
+    let input = "\n\n{.foo, width: 300px, data-test: value}\nParagraph with class and attributes.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_weaver_block_before_heading() {
+    let input = "\n\n{.aside}\n## Heading in aside\n\nParagraph also in aside.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_weaver_block_before_blockquote() {
+    let input = "\n\n{.aside}\n\n> This blockquote is in an aside.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_weaver_block_before_list() {
+    let input = "\n\n{.aside}\n\n- Item 1\n- Item 2";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_weaver_block_before_code_block() {
+    let input = "\n\n{.aside}\n\n```rust\nfn main() {}\n```";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_weaver_block_multiple_classes() {
+    let input = "\n\n{.aside, .highlight, .important}\nMultiple classes applied.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_weaver_block_no_effect_on_following() {
+    let input = "\n\n{.aside}\nFirst paragraph in aside.\n\nSecond paragraph NOT in aside.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+// =============================================================================
+// Footnote / Sidenote Tests
+// =============================================================================
+
+#[test]
+fn test_footnote_traditional() {
+    let input = "Here is some text[^1].\n[^1]: This is the footnote definition.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_footnote_sidenote_inline() {
+    let input = "Here is text[^note]\n[^note]: Sidenote content.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_footnote_multiple() {
+    let input = "First[^1] and second[^2] footnotes.\n[^1]: First note.\n[^2]: Second note.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_footnote_with_inline_formatting() {
+    let input = "Text with footnote[^fmt].\n[^fmt]: Note with **bold** and *italic*.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_footnote_named() {
+    let input = "Reference[^my-note].\n[^my-note]: Named footnote content.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+#[test]
+fn test_footnote_in_blockquote() {
+    let input = "> Quote with footnote[^q].\n[^q]: Footnote for quote.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}
+
+// =============================================================================
+// Combined WeaverBlock + Footnote Tests
+// =============================================================================
+
+#[test]
+fn test_weaver_block_with_footnote() {
+    let input = "{.aside}\nAside with a footnote[^aside].\n\n[^aside]: Footnote in aside context.";
+    let output = render_markdown(input);
+    insta::assert_snapshot!(output);
+}

crates/weaver-renderer/src/atproto/writer.rs

···
 
 use jacquard::types::string::AtUri;
 use markdown_weaver::{
-    Alignment, BlockQuoteKind, CodeBlockKind, CowStr, EmbedType, Event, LinkType, Tag,
+    Alignment, BlockQuoteKind, CodeBlockKind, CowStr, EmbedType, Event, LinkType,
+    ParagraphContext, Tag, WeaverAttributes,
 };
 use markdown_weaver_escape::{StrWrite, escape_href, escape_html, escape_html_body_text};
 use std::collections::HashMap;
 use weaver_common::ResolvedContent;
+
+/// Tracks the type of wrapper element emitted for WeaverBlock prefix
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+enum WrapperElement {
+    Aside,
+    Div,
+}
 
 /// Synchronous callback for injecting embed content
 ///
···
     embed_provider: Option<E>,
 
     code_buffer: Option<(Option<String>, String)>, // (lang, content)
+
+    /// Pending WeaverBlock attrs to apply to the next block element
+    pending_block_attrs: Option<WeaverAttributes<'static>>,
+    /// Type of wrapper element currently open (needs closing on block end)
+    active_wrapper: Option<WrapperElement>,
+    /// Buffer for WeaverBlock text content (to parse for attrs)
+    weaver_block_buffer: String,
+    /// Pending footnote reference waiting to see if definition follows immediately
+    pending_footnote: Option<(String, usize)>,
+    /// Buffer for content between footnote ref and resolution
+    pending_footnote_content: String,
+    /// Whether current footnote definition is being rendered as a sidenote
+    in_sidenote: bool,
+    /// Whether we're deferring paragraph close for sidenote handling
+    defer_paragraph_close: bool,
+
     _phantom: std::marker::PhantomData<&'a ()>,
 }
 
···
             numbers: self.numbers,
             embed_provider: Some(provider),
             code_buffer: self.code_buffer,
+            pending_block_attrs: self.pending_block_attrs,
+            active_wrapper: self.active_wrapper,
+            weaver_block_buffer: self.weaver_block_buffer,
+            pending_footnote: self.pending_footnote,
+            pending_footnote_content: self.pending_footnote_content,
+            in_sidenote: self.in_sidenote,
+            defer_paragraph_close: self.defer_paragraph_close,
             _phantom: std::marker::PhantomData,
         }
     }
···
             numbers: HashMap::new(),
             embed_provider: None,
             code_buffer: None,
+            pending_block_attrs: None,
+            active_wrapper: None,
+            weaver_block_buffer: String::new(),
+            pending_footnote: None,
+            pending_footnote_content: String::new(),
+            in_sidenote: false,
+            defer_paragraph_close: false,
             _phantom: std::marker::PhantomData,
         }
     }
 
+    /// Parse WeaverBlock text content into attributes.
+    fn parse_weaver_attrs(text: &str) -> WeaverAttributes<'static> {
+        let mut classes = Vec::new();
+        let mut attrs = Vec::new();
+
+        for part in text.split(',') {
+            let part = part.trim();
+            if part.is_empty() {
+                continue;
+            }
+
+            if let Some((key, value)) = part.split_once(':') {
+                let key = key.trim();
+                let value = value.trim();
+                if !key.is_empty() && !value.is_empty() {
+                    attrs.push((
+                        CowStr::from(key.to_string()),
+                        CowStr::from(value.to_string()),
+                    ));
+                }
+            } else {
+                let class = part.strip_prefix('.').unwrap_or(part);
+                if !class.is_empty() {
+                    classes.push(CowStr::from(class.to_string()));
+                }
+            }
+        }
+
+        WeaverAttributes { classes, attrs }
+    }
+
+    /// Close deferred paragraph if we're in that state.
+    /// Called when a non-paragraph block element starts.
+    fn close_deferred_paragraph(&mut self) -> Result<(), W::Error> {
+        if self.defer_paragraph_close {
+            // Flush pending footnote as traditional before closing
+            self.flush_pending_footnote()?;
+            self.write("</p>\n")?;
+            self.close_wrapper()?;
+            self.defer_paragraph_close = false;
+        }
+        Ok(())
+    }
+
+    /// Flush any pending footnote reference as a traditional footnote
+    fn flush_pending_footnote(&mut self) -> Result<(), W::Error> {
+        if let Some((name, number)) = self.pending_footnote.take() {
+            self.write("<sup class=\"footnote-reference\"><a href=\"#")?;
+            escape_html(&mut self.writer, &name)?;
+            self.write("\">")?;
+            write!(&mut self.writer, "{}", number)?;
+            self.write("</a></sup>")?;
+            if !self.pending_footnote_content.is_empty() {
+                let content = std::mem::take(&mut self.pending_footnote_content);
+                escape_html_body_text(&mut self.writer, &content)?;
+                self.end_newline = content.ends_with('\n');
+            }
+        }
+        Ok(())
+    }
+
+    /// Emit wrapper element start based on pending block attrs
+    fn emit_wrapper_start(&mut self) -> Result<bool, W::Error> {
+        if let Some(attrs) = self.pending_block_attrs.take() {
+            let is_aside = attrs.classes.iter().any(|c| c.as_ref() == "aside");
+
+            if !self.end_newline {
+                self.write("\n")?;
+            }
+
+            if is_aside {
+                self.write("<aside")?;
+                self.active_wrapper = Some(WrapperElement::Aside);
+            } else {
+                self.write("<div")?;
+                self.active_wrapper = Some(WrapperElement::Div);
+            }
+
+            let classes: Vec<_> = if is_aside {
+                attrs
+                    .classes
+                    .iter()
+                    .filter(|c| c.as_ref() != "aside")
+                    .collect()
+            } else {
+                attrs.classes.iter().collect()
+            };
+
+            if !classes.is_empty() {
+                self.write(" class=\"")?;
+                for (i, class) in classes.iter().enumerate() {
+                    if i > 0 {
+                        self.write(" ")?;
+                    }
+                    escape_html(&mut self.writer, class)?;
+                }
+                self.write("\"")?;
+            }
+
+            for (attr, value) in &attrs.attrs {
+                self.write(" ")?;
+                escape_html(&mut self.writer, attr)?;
+                self.write("=\"")?;
+                escape_html(&mut self.writer, value)?;
+                self.write("\"")?;
+            }
+
+            self.write(">\n")?;
+            Ok(true)
+        } else {
+            Ok(false)
+        }
+    }
+
+    /// Close active wrapper element if one is open
+    fn close_wrapper(&mut self) -> Result<(), W::Error> {
+        if let Some(wrapper) = self.active_wrapper.take() {
+            match wrapper {
+                WrapperElement::Aside => self.write("</aside>\n")?,
+                WrapperElement::Div => self.write("</div>\n")?,
+            }
+        }
+        Ok(())
+    }
+
     #[inline]
     fn write_newline(&mut self) -> Result<(), W::Error> {
         self.end_newline = true;
···
         while let Some(event) = self.events.next() {
             self.process_event(event)?;
         }
+        self.finalize()?;
         Ok(self.writer)
+    }
+
+    /// Finalize output, closing any deferred state
+    fn finalize(&mut self) -> Result<(), W::Error> {
+        // Flush any pending footnote as traditional
+        self.flush_pending_footnote()?;
+        // Close deferred paragraph if any
+        if self.defer_paragraph_close {
+            self.write("</p>\n")?;
+            self.close_wrapper()?;
+            self.defer_paragraph_close = false;
+        }
+        Ok(())
     }
 
     /// Consume events until End tag without writing anything.
···
                 // If buffering code, append to buffer instead of writing
                 if let Some((_, ref mut buffer)) = self.code_buffer {
                     buffer.push_str(&text);
+                } else if self.pending_footnote.is_some() {
+                    // Buffer text while waiting to see if footnote def follows
+                    self.pending_footnote_content.push_str(&text);
                 } else if !self.in_non_writing_block {
                     escape_html_body_text(&mut self.writer, &text)?;
                     self.end_newline = text.ends_with('\n');
···
                 self.write(&html)?;
                 self.write("</span>")?;
             }
-            SoftBreak => self.write_newline()?,
-            HardBreak => self.write("<br />\n")?,
+            SoftBreak => {
+                if self.pending_footnote.is_some() {
+                    self.pending_footnote_content.push('\n');
+                } else {
+                    self.write_newline()?;
+                }
+            }
+            HardBreak => {
+                if self.pending_footnote.is_some() {
+                    self.pending_footnote_content.push_str("<br />\n");
+                } else {
+                    self.write("<br />\n")?;
+                }
+            }
             Rule => {
                 if self.end_newline {
                     self.write("<hr />\n")?;
···
                 }
             }
             FootnoteReference(name) => {
+                // Flush any existing pending footnote as traditional
+                self.flush_pending_footnote()?;
+                // Get/create footnote number
                 let len = self.numbers.len() + 1;
-                self.write("<sup class=\"footnote-reference\"><a href=\"#")?;
-                escape_html(&mut self.writer, &name)?;
-                self.write("\">")?;
                 let number = *self.numbers.entry(name.to_string()).or_insert(len);
-                write!(&mut self.writer, "{}", number)?;
-                self.write("</a></sup>")?;
+                // Buffer this reference to see if definition follows immediately
+                self.pending_footnote = Some((name.to_string(), number));
             }
             TaskListMarker(checked) => {
                 if checked {
···
                     self.write("<input disabled=\"\" type=\"checkbox\"/>\n")?;
                 }
             }
-            WeaverBlock(_) => {}
+            WeaverBlock(text) => {
+                // Buffer WeaverBlock content for parsing on End
+                self.weaver_block_buffer.push_str(&text);
+            }
         }
         Ok(())
     }
···
     fn start_tag(&mut self, tag: Tag<'_>) -> Result<(), W::Error> {
         match tag {
             Tag::HtmlBlock => self.write(r#"<span class="html-embed html-embed-block">"#),
-            Tag::Paragraph => {
-                if self.end_newline {
-                    self.write("<p>")
+            Tag::Paragraph(_) => {
+                if self.in_sidenote {
+                    // Inside sidenote span - don't emit paragraph tags
+                    Ok(())
+                } else if self.defer_paragraph_close {
+                    // We're continuing a virtual paragraph after a sidenote
+                    // Don't emit <p> (already open)
+                    // Clear defer flag - we'll set it again at end if another sidenote follows
+                    self.defer_paragraph_close = false;
+                    Ok(())
                 } else {
-                    self.write("\n<p>")
+                    self.flush_pending_footnote()?;
+                    self.emit_wrapper_start()?;
+                    if self.end_newline {
+                        self.write("<p>")
+                    } else {
+                        self.write("\n<p>")
+                    }
                 }
             }
             Tag::Heading {
···
                 classes,
                 attrs,
             } => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
                 if !self.end_newline {
                     self.write("\n")?;
                 }
···
                 self.write(">")
             }
             Tag::Table(alignments) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
                 self.table_alignments = alignments;
                 self.write("<table>")
             }
···
                 }
             }
             Tag::BlockQuote(kind) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
                 let class_str = match kind {
                     None => "",
                     Some(BlockQuoteKind::Note) => " class=\"markdown-alert-note\"",
···
                 Ok(())
             }
             Tag::CodeBlock(info) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
                 if !self.end_newline {
                     self.write_newline()?;
                 }
···
                 }
             }
             Tag::List(Some(1)) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
                 if self.end_newline {
                     self.write("<ol>\n")
                 } else {
···
                 }
             }
             Tag::List(Some(start)) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
                 if self.end_newline {
                     self.write("<ol start=\"")?;
                 } else {
···
                 self.write("\">\n")
             }
             Tag::List(None) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
                 if self.end_newline {
                     self.write("<ul>\n")
                 } else {
···
                 }
             }
             Tag::DefinitionList => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
                 if self.end_newline {
                     self.write("<dl>\n")
                 } else {
···
                 id,
                 attrs,
             } => self.write_embed(embed_type, dest_url, title, id, attrs),
-            Tag::WeaverBlock(_, _) => {
+            Tag::WeaverBlock(_, attrs) => {
                 self.in_non_writing_block = true;
+                self.weaver_block_buffer.clear();
+                // Store attrs from Start tag, will merge with parsed text on End
+                if !attrs.classes.is_empty() || !attrs.attrs.is_empty() {
+                    self.pending_block_attrs = Some(attrs.into_static());
+                }
                 Ok(())
             }
             Tag::FootnoteDefinition(name) => {
-                if self.end_newline {
-                    self.write("<div class=\"footnote-definition\" id=\"")?;
+                // Check if this matches a pending footnote reference (sidenote case)
+                let is_sidenote = self
+                    .pending_footnote
+                    .as_ref()
+                    .map(|(n, _)| n.as_str() == name.as_ref())
+                    .unwrap_or(false);
+
+                if is_sidenote {
+                    // Emit sidenote structure at reference position
+                    let (_, number) = self.pending_footnote.take().unwrap();
+                    let id = format!("sn-{}", number);
+
+                    // Emit: <label><input/><span class="sidenote">
+                    self.write("<label for=\"")?;
+                    self.write(&id)?;
+                    self.write("\" class=\"sidenote-number\"></label>")?;
+                    self.write("<input type=\"checkbox\" id=\"")?;
+                    self.write(&id)?;
+                    self.write("\" class=\"margin-toggle\"/>")?;
+                    self.write("<span class=\"sidenote\">")?;
+
+                    self.in_sidenote = true;
                 } else {
-                    self.write("\n<div class=\"footnote-definition\" id=\"")?;
+                    // Traditional footnote - close any deferred paragraph (which also flushes pending ref)
+                    self.close_deferred_paragraph()?;
+
+                    if self.end_newline {
+                        self.write("<div class=\"footnote-definition\" id=\"")?;
+                    } else {
+                        self.write("\n<div class=\"footnote-definition\" id=\"")?;
+                    }
+                    escape_html(&mut self.writer, &name)?;
+                    self.write("\"><sup class=\"footnote-definition-label\">")?;
+                    let len = self.numbers.len() + 1;
+                    let number = *self.numbers.entry(name.to_string()).or_insert(len);
+                    write!(&mut self.writer, "{}", number)?;
+                    self.write("</sup>")?;
                 }
-                escape_html(&mut self.writer, &name)?;
-                self.write("\"><sup class=\"footnote-definition-label\">")?;
-                let len = self.numbers.len() + 1;
-                let number = *self.numbers.entry(name.to_string()).or_insert(len);
-                write!(&mut self.writer, "{}", number)?;
-                self.write("</sup>")
+                Ok(())
             }
             Tag::MetadataBlock(_) => {
                 self.in_non_writing_block = true;
···
         use markdown_weaver::TagEnd;
         match tag {
             TagEnd::HtmlBlock => self.write("</span>\n"),
-            TagEnd::Paragraph => self.write("</p>\n"),
+            TagEnd::Paragraph(ctx) => {
+                if self.in_sidenote {
+                    // Inside sidenote span - don't emit paragraph tags
+                    Ok(())
+                } else if ctx == ParagraphContext::Interrupted && self.pending_footnote.is_some() {
+                    // Paragraph was interrupted AND we have a pending footnote,
+                    // defer the </p> close - the sidenote will be rendered inline
+                    self.defer_paragraph_close = true;
+                    Ok(())
+                } else if self.defer_paragraph_close {
+                    // We were deferring but now closing for real
+                    self.write("</p>\n")?;
+                    self.close_wrapper()?;
+                    self.defer_paragraph_close = false;
+                    Ok(())
+                } else {
+                    self.write("</p>\n")?;
+                    self.close_wrapper()
+                }
+            }
             TagEnd::Heading(level) => {
                 self.write("</")?;
                 write!(&mut self.writer, "{}", level)?;
+                // Don't close wrapper - headings typically go with following block
                 self.write(">\n")
             }
             TagEnd::Table => self.write("</tbody></table>\n"),
···
                 self.table_cell_index += 1;
                 Ok(())
             }
-            TagEnd::BlockQuote(_) => self.write("</blockquote>\n"),
+            TagEnd::BlockQuote(_) => {
+                // Close any deferred paragraph before closing blockquote
+                // (footnotes inside blockquotes can't be sidenotes since def is outside)
+                self.close_deferred_paragraph()?;
+                self.write("</blockquote>\n")?;
+                self.close_wrapper()
+            }
             TagEnd::CodeBlock => {
                 use std::sync::LazyLock;
                 use syntect::parsing::SyntaxSet;
···
                 }
                 Ok(())
             }
-            TagEnd::List(true) => self.write("</ol>\n"),
-            TagEnd::List(false) => self.write("</ul>\n"),
+            TagEnd::List(true) => {
+                self.write("</ol>\n")?;
+                self.close_wrapper()
+            }
+            TagEnd::List(false) => {
+                self.write("</ul>\n")?;
+                self.close_wrapper()
+            }
             TagEnd::Item => self.write("</li>\n"),
-            TagEnd::DefinitionList => self.write("</dl>\n"),
+            TagEnd::DefinitionList => {
+                self.write("</dl>\n")?;
+                self.close_wrapper()
+            }
             TagEnd::DefinitionListTitle => self.write("</dt>\n"),
             TagEnd::DefinitionListDefinition => self.write("</dd>\n"),
             TagEnd::Emphasis => self.write("</em>"),
···
             TagEnd::Embed => Ok(()),
             TagEnd::WeaverBlock(_) => {
                 self.in_non_writing_block = false;
+                // Parse the buffered text for attrs and store for next block
+                if !self.weaver_block_buffer.is_empty() {
+                    let parsed = Self::parse_weaver_attrs(&self.weaver_block_buffer);
+                    self.weaver_block_buffer.clear();
+                    // Merge with any existing pending attrs or set new
+                    if let Some(ref mut existing) = self.pending_block_attrs {
+                        existing.classes.extend(parsed.classes);
+                        existing.attrs.extend(parsed.attrs);
+                    } else {
+                        self.pending_block_attrs = Some(parsed);
+                    }
+                }
                 Ok(())
             }
-            TagEnd::FootnoteDefinition => self.write("</div>\n"),
+            TagEnd::FootnoteDefinition => {
+                if self.in_sidenote {
+                    self.write("</span>")?;
+                    self.in_sidenote = false;
+                    // Write any buffered content that came after the ref
+                    if !self.pending_footnote_content.is_empty() {
+                        let content = std::mem::take(&mut self.pending_footnote_content);
+                        escape_html_body_text(&mut self.writer, &content)?;
+                        self.end_newline = content.ends_with('\n');
+                    }
+                } else {
+                    self.write("</div>\n")?;
+                }
+                Ok(())
+            }
             TagEnd::MetadataBlock(_) => {
                 self.in_non_writing_block = false;
                 Ok(())

crates/weaver-renderer/src/base_html.rs

···
                     escape_html_body_text(&mut self.writer, &text)?;
                     self.write("</code>")?;
                 }
-                InlineMath(text) => {
-                    match crate::math::render_math(&text, false) {
-                        crate::math::MathResult::Success(mathml) => {
-                            self.write(r#"<span class="math math-inline">"#)?;
-                            self.write(&mathml)?;
-                            self.write("</span>")?;
-                        }
-                        crate::math::MathResult::Error { html, .. } => {
-                            self.write(&html)?;
-                        }
+                InlineMath(text) => match crate::math::render_math(&text, false) {
+                    crate::math::MathResult::Success(mathml) => {
+                        self.write(r#"<span class="math math-inline">"#)?;
+                        self.write(&mathml)?;
+                        self.write("</span>")?;
                     }
-                }
-                DisplayMath(text) => {
-                    match crate::math::render_math(&text, true) {
-                        crate::math::MathResult::Success(mathml) => {
-                            self.write(r#"<span class="math math-display">"#)?;
-                            self.write(&mathml)?;
-                            self.write("</span>")?;
-                        }
-                        crate::math::MathResult::Error { html, .. } => {
-                            self.write(&html)?;
-                        }
+                    crate::math::MathResult::Error { html, .. } => {
+                        self.write(&html)?;
                     }
-                }
+                },
+                DisplayMath(text) => match crate::math::render_math(&text, true) {
+                    crate::math::MathResult::Success(mathml) => {
+                        self.write(r#"<span class="math math-display">"#)?;
+                        self.write(&mathml)?;
+                        self.write("</span>")?;
+                    }
+                    crate::math::MathResult::Error { html, .. } => {
+                        self.write(&html)?;
+                    }
+                },
                 Html(html) | InlineHtml(html) => {
                     self.write(&html)?;
                 }
···
     fn start_tag(&mut self, tag: Tag<'a>) -> Result<(), W::Error> {
         match tag {
             Tag::HtmlBlock => Ok(()),
-            Tag::Paragraph => {
+            Tag::Paragraph(_) => {
                 if self.end_newline {
                     self.write("<p>")
                 } else {
···
     fn end_tag(&mut self, tag: TagEnd) -> Result<(), W::Error> {
         match tag {
             TagEnd::HtmlBlock => {}
-            TagEnd::Paragraph => {
+            TagEnd::Paragraph(_) => {
                 self.write("</p>\n")?;
             }
             TagEnd::Heading(level) => {

crates/weaver-renderer/src/css.rs

···
     padding: 1rem 0rem;
     word-wrap: break-word;
     overflow-wrap: break-word;
+    counter-reset: sidenote-counter;
+    max-width: 95ch;
+}}
+
+/* When sidenotes exist, body padding creates the gutter */
+/* Left padding shrinks first as viewport narrows, right stays for sidenotes */
+body:has(.sidenote) {{
+    padding-left: clamp(0rem, calc((100vw - 95ch - 15.5rem - 2rem) / 2), 15.5rem);
+    padding-right: 15.5rem;
 }}
 
 /* Typography */
···
 }}
 
 .footnote-definition {{
+    order: 9999;
+    margin: 0;
+    padding: 0.5rem 0;
+    font-size: 0.9em;
+}}
+
+.footnote-definition:first-of-type {{
     margin-top: 2rem;
-    padding-top: 0.5rem;
-    border-top: 1px solid var(--color-border);
-    font-size: 0.9em;
+    padding-top: 1rem;
+    border-top: 2px solid var(--color-border);
+}}
+
+.footnote-definition:first-of-type::before {{
+    content: "Footnotes";
+    display: block;
+    font-weight: 600;
+    font-size: 1.1em;
+    color: var(--color-subtle);
+    margin-bottom: 0.75rem;
 }}
 
 .footnote-definition-label {{
     font-weight: 600;
     margin-right: 0.5rem;
     color: var(--color-primary);
+}}
+
+/* Aside blocks (via WeaverBlock prefix) */
+aside, .aside {{
+    float: left;
+    width: 40%;
+    margin: 0 1.5rem 1rem 0;
+    padding: 1rem;
+    background: var(--color-surface);
+    border-right: 3px solid var(--color-primary);
+    font-size: 0.9em;
+    clear: left;
+}}
+
+aside > *:first-child,
+.aside > *:first-child {{
+    margin-top: 0;
+}}
+
+aside > *:last-child,
+.aside > *:last-child {{
+    margin-bottom: 0;
+}}
+
+/* Reset blockquote styling inside asides */
+aside > blockquote,
+.aside > blockquote {{
+    border-left: none;
+    background: transparent;
+    padding: 0;
+    margin: 0;
+    font-size: inherit;
+}}
+
+/* Indent utilities */
+.indent-1 {{ margin-left: 1em; }}
+.indent-2 {{ margin-left: 2em; }}
+.indent-3 {{ margin-left: 3em; }}
+
+/* Tufte-style Sidenotes */
+/* Hide checkbox for sidenote toggle */
+.margin-toggle {{
+    display: none;
+}}
+
+/* Sidenote number marker (inline superscript) */
+.sidenote-number {{
+    counter-increment: sidenote-counter;
+}}
+
+.sidenote-number::after {{
+    content: counter(sidenote-counter);
+    font-size: 0.7em;
+    position: relative;
+    top: -0.5em;
+    color: var(--color-primary);
+    padding-left: 0.1em;
+}}
+
+/* Sidenote content (margin notes on wide screens) */
+.sidenote {{
+    float: right;
+    clear: right;
+    margin-right: -15.5rem;
+    width: 14rem;
+    margin-top: 0.3rem;
+    margin-bottom: 1rem;
+    font-size: 0.85em;
+    line-height: 1.4;
+    color: var(--color-subtle);
+}}
+
+.sidenote::before {{
+    content: counter(sidenote-counter) ". ";
+    color: var(--color-primary);
+}}
+
+/* Mobile sidenotes: toggle behavior */
+@media (max-width: 900px) {{
+    /* Reset sidenote gutter on mobile */
+    body:has(.sidenote) {{
+        padding-right: 0;
+    }}
+
+    aside, .aside {{
+        float: none;
+        width: 100%;
+        margin: 1rem 0;
+    }}
+
+    .sidenote {{
+        display: none;
+    }}
+
+    .margin-toggle:checked + .sidenote {{
+        display: block;
+        float: none;
+        width: 95%;
+        margin: 0.5rem 2.5%;
+        padding: 0.5rem;
+        background: var(--color-surface);
+        border-left: 2px solid var(--color-primary);
+    }}
+
+    label.sidenote-number {{
+        cursor: pointer;
+    }}
+
+    label.sidenote-number::after {{
+        text-decoration: underline;
+    }}
 }}
 
 /* Images */

crates/weaver-renderer/src/lib.rs

···
     pub fn get_context<'a>(event: &Event<'a>, prev: Option<&Self>) -> Self {
         match event {
             Event::Start(tag) => match tag {
-                Tag::Paragraph => Self::Text,
+                Tag::Paragraph(_) => Self::Text,
                 Tag::Heading { .. } => Self::Heading,
                 Tag::BlockQuote(_block_quote_kind) => Self::Text,
                 Tag::CodeBlock(_code_block_kind) => Self::CodeBlock,

crates/weaver-renderer/src/static_site/document.rs

···
     }
 
     writer.write_all(b"</head>\n").await.into_diagnostic()?;
-    writer.write_all(b"<body>\n").await.into_diagnostic()?;
+    writer
+        .write_all(b"<body style=\"background: var(--color-base); min-height: 100vh;\">\n")
+        .await
+        .into_diagnostic()?;
     writer
         .write_all(b"<div class=\"notebook-content\">\n")
         .await

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__footnote_in_blockquote.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<blockquote>
+<p>Quote with footnote<sup class="footnote-reference"><a href="#q">1</a></sup>.</p>
+</blockquote>
+<div class="footnote-definition" id="q"><sup class="footnote-definition-label">1</sup>
+<p>Footnote for quote.</p>
+</div>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__footnote_multiple.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<p>First<sup class="footnote-reference"><a href="#1">1</a></sup> and second<sup class="footnote-reference"><a href="#2">2</a></sup> footnotes.</p>
+<div class="footnote-definition" id="1"><sup class="footnote-definition-label">1</sup>
+<p>First note.</p>
+</div>
+<div class="footnote-definition" id="2"><sup class="footnote-definition-label">2</sup>
+<p>Second note.</p>
+</div>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__footnote_named.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<p>Reference<label for="sn-1" class="margin-toggle sidenote-number"></label><input type="checkbox" id="sn-1" class="margin-toggle"/><span class="sidenote">Named footnote content.</span>.</p>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__footnote_sidenote_inline.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<p>Here is text<label for="sn-1" class="margin-toggle sidenote-number"></label><input type="checkbox" id="sn-1" class="margin-toggle"/><span class="sidenote">Sidenote content.</span></p>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__footnote_traditional.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<p>Here is some text<label for="sn-1" class="margin-toggle sidenote-number"></label><input type="checkbox" id="sn-1" class="margin-toggle"/><span class="sidenote">This is the footnote definition.</span>.</p>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__footnote_with_inline_formatting.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<p>Text with footnote<label for="sn-1" class="margin-toggle sidenote-number"></label><input type="checkbox" id="sn-1" class="margin-toggle"/><span class="sidenote">Note with <strong>bold</strong> and <em>italic</em>.</span>.</p>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__weaver_block_aside_class.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<aside>
+<p>This paragraph should be in an aside.</p>
+</aside>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__weaver_block_before_blockquote.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<aside>
+<blockquote>
+<p>This blockquote is in an aside.</p>
+</blockquote>
+</aside>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__weaver_block_before_code_block.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<aside>
+<pre><code class="wvc-code language-Rust"><span class="wvc-source wvc-rust"><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-storage wvc-type wvc-function wvc-rust">fn</span> </span><span class="wvc-entity wvc-name wvc-function wvc-rust">main</span></span><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-function wvc-parameters wvc-rust"><span class="wvc-punctuation wvc-section wvc-parameters wvc-begin wvc-rust">(</span></span><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-function wvc-parameters wvc-rust"><span class="wvc-punctuation wvc-section wvc-parameters wvc-end wvc-rust">)</span></span></span></span><span class="wvc-meta wvc-function wvc-rust"> </span><span class="wvc-meta wvc-function wvc-rust"><span class="wvc-meta wvc-block wvc-rust"><span class="wvc-punctuation wvc-section wvc-block wvc-begin wvc-rust">{</span></span><span class="wvc-meta wvc-block wvc-rust"><span class="wvc-punctuation wvc-section wvc-block wvc-end wvc-rust">}</span></span></span>
+</span></code></pre></aside>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__weaver_block_before_heading.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<aside>
+<h2>Heading in aside</h2>
+<p>Paragraph also in aside.</p>
+</aside>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__weaver_block_before_list.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<aside>
+<ul>
+<li>Item 1</li>
+<li>Item 2</li>
+</ul>
+</aside>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__weaver_block_custom_attributes.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<div class="foo" width="300px" data-test="value">
+<p>Paragraph with class and attributes.</p>
+</div>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__weaver_block_custom_class.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<div class="highlight">
+<p>This paragraph has a custom class.</p>
+</div>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__weaver_block_multiple_classes.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<aside class="highlight important">
+<p>Multiple classes applied.</p>
+</aside>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__weaver_block_no_effect_on_following.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<aside>
+<p>First paragraph in aside.</p>
+</aside>
+<p>Second paragraph NOT in aside.</p>

crates/weaver-renderer/src/static_site/snapshots/weaver_renderer__static_site__tests__weaver_block_with_footnote.snap

···
+---
+source: crates/weaver-renderer/src/static_site/tests.rs
+expression: output
+---
+<aside>
+<p>Aside with a footnote<label for="sn-1" class="margin-toggle sidenote-number"></label><input type="checkbox" id="sn-1" class="margin-toggle"/><span class="sidenote">Footnote in aside context.</span>.</p>
+</aside>

crates/weaver-renderer/src/static_site/tests.rs

···
     assert!(output.contains("🎉"));
     assert!(output.contains("café"));
 }
+
+// =============================================================================
+// WeaverBlock Prefix Tests
+// =============================================================================
+
+#[tokio::test]
+async fn test_weaver_block_aside_class() {
+    let input = "\n\n{.aside}\nThis paragraph should be in an aside.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_weaver_block_custom_class() {
+    let input = "\n\n{.highlight}\nThis paragraph has a custom class.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_weaver_block_custom_attributes() {
+    let input = "\n\n{.foo, width: 300px, data-test: value}\nParagraph with class and attributes.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_weaver_block_before_heading() {
+    let input = "\n\n{.aside}\n## Heading in aside\n\nParagraph also in aside.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_weaver_block_before_blockquote() {
+    let input = "\n\n{.aside}\n\n> This blockquote is in an aside.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_weaver_block_before_list() {
+    let input = "\n\n{.aside}\n\n- Item 1\n- Item 2";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_weaver_block_before_code_block() {
+    let input = "\n\n{.aside}\n\n```rust\nfn main() {}\n```";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_weaver_block_multiple_classes() {
+    let input = "\n\n{.aside, .highlight, .important}\nMultiple classes applied.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_weaver_block_no_effect_on_following() {
+    let input = "\n\n{.aside}\nFirst paragraph in aside.\n\nSecond paragraph NOT in aside.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+// =============================================================================
+// Footnote / Sidenote Tests
+// =============================================================================
+
+#[tokio::test]
+async fn test_footnote_traditional() {
+    let input = "Here is some text[^1].\n[^1]: This is the footnote definition.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_footnote_sidenote_inline() {
+    // When definition immediately follows reference in the same paragraph flow
+    let input = "Here is text[^note]\n[^note]: Sidenote content.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_footnote_multiple() {
+    let input = "First[^1] and second[^2] footnotes.\n[^1]: First note.\n[^2]: Second note.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_footnote_with_inline_formatting() {
+    let input = "Text with footnote[^fmt].\n[^fmt]: Note with **bold** and *italic*.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_footnote_named() {
+    let input = "Reference[^my-note].\n[^my-note]: Named footnote content.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+#[tokio::test]
+async fn test_footnote_in_blockquote() {
+    let input = "> Quote with footnote[^q].\n[^q]: Footnote for quote.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}
+
+// =============================================================================
+// Combined WeaverBlock + Footnote Tests
+// =============================================================================
+
+#[tokio::test]
+async fn test_weaver_block_with_footnote() {
+    let input = "{.aside}\nAside with a footnote[^aside].\n\n[^aside]: Footnote in aside context.";
+    let output = render_markdown(input).await;
+    insta::assert_snapshot!(output);
+}

crates/weaver-renderer/src/static_site/writer.rs

···
 use crate::{NotebookProcessor, base_html::TableState, static_site::context::StaticSiteContext};
 use dashmap::DashMap;
 use markdown_weaver::{
-    Alignment, BlockQuoteKind, CodeBlockKind, CowStr, EmbedType, Event, LinkType, Tag,
+    Alignment, BlockQuoteKind, CodeBlockKind, CowStr, EmbedType, Event, LinkType,
+    ParagraphContext, Tag, WeaverAttributes,
 };
 use markdown_weaver_escape::{StrWrite, escape_href, escape_html, escape_html_body_text};
 use n0_future::StreamExt;
 use weaver_common::jacquard::{client::AgentSession, prelude::*};
+
+/// Tracks the type of wrapper element emitted for WeaverBlock prefix
+#[derive(Debug, Clone, Copy, PartialEq, Eq)]
+enum WrapperElement {
+    Aside,
+    Div,
+}
 
 pub struct StaticPageWriter<'input, I: Iterator<Item = Event<'input>>, A: AgentSession, W: StrWrite>
 {
···
     numbers: DashMap<CowStr<'input>, usize>,
 
     code_buffer: Option<(Option<String>, String)>, // (lang, content)
+
+    /// Pending WeaverBlock attrs to apply to the next block element
+    pending_block_attrs: Option<WeaverAttributes<'static>>,
+    /// Type of wrapper element currently open, and the block depth at which it was opened
+    active_wrapper: Option<(WrapperElement, usize)>,
+    /// Current block nesting depth (for wrapper close tracking)
+    block_depth: usize,
+    /// Buffer for WeaverBlock text content (to parse for attrs)
+    weaver_block_buffer: String,
+    /// Pending footnote reference waiting to see if definition follows immediately
+    pending_footnote: Option<(CowStr<'static>, usize)>,
+    /// Buffer for content between footnote ref and resolution
+    pending_footnote_content: String,
+    /// Whether current footnote definition is being rendered as a sidenote
+    in_sidenote: bool,
+    /// Whether we're deferring paragraph close for sidenote handling
+    defer_paragraph_close: bool,
 }
 
 impl<'input, I: Iterator<Item = Event<'input>>, A: AgentSession, W: StrWrite>
···
             table_cell_index: 0,
             numbers: DashMap::new(),
             code_buffer: None,
+            pending_block_attrs: None,
+            active_wrapper: None,
+            block_depth: 0,
+            weaver_block_buffer: String::new(),
+            pending_footnote: None,
+            pending_footnote_content: String::new(),
+            in_sidenote: false,
+            defer_paragraph_close: false,
         }
     }
 
+    /// Parse WeaverBlock text content into attributes.
+    /// Format: comma-separated, colon for key:value, otherwise class.
+    /// Example: ".aside, width: 300px" -> classes: ["aside"], attrs: [("width", "300px")]
+    fn parse_weaver_attrs(text: &str) -> WeaverAttributes<'static> {
+        let mut classes = Vec::new();
+        let mut attrs = Vec::new();
+
+        for part in text.split(',') {
+            let part = part.trim();
+            if part.is_empty() {
+                continue;
+            }
+
+            if let Some((key, value)) = part.split_once(':') {
+                let key = key.trim();
+                let value = value.trim();
+                if !key.is_empty() && !value.is_empty() {
+                    attrs.push((
+                        CowStr::from(key.to_string()),
+                        CowStr::from(value.to_string()),
+                    ));
+                }
+            } else {
+                // No colon - treat as class, strip leading dot if present
+                let class = part.strip_prefix('.').unwrap_or(part);
+                if !class.is_empty() {
+                    classes.push(CowStr::from(class.to_string()));
+                }
+            }
+        }
+
+        WeaverAttributes { classes, attrs }
+    }
+
     /// Writes a new line.
     #[inline]
     fn write_newline(&mut self) -> Result<(), W::Error> {
···
         Ok(())
     }
 
+    /// Close deferred paragraph if we're in that state.
+    /// Called when a non-paragraph block element starts.
+    fn close_deferred_paragraph(&mut self) -> Result<(), W::Error> {
+        if self.defer_paragraph_close {
+            // Flush pending footnote as traditional before closing
+            self.flush_pending_footnote()?;
+            self.write("</p>\n")?;
+            self.block_depth -= 1;
+            self.close_wrapper()?;
+            self.defer_paragraph_close = false;
+        }
+        Ok(())
+    }
+
+    /// Flush any pending footnote reference as a traditional footnote,
+    /// then write any buffered content that came after the reference.
+    fn flush_pending_footnote(&mut self) -> Result<(), W::Error> {
+        if let Some((name, number)) = self.pending_footnote.take() {
+            // Emit traditional footnote reference
+            self.write("<sup class=\"footnote-reference\"><a href=\"#")?;
+            escape_html(&mut self.writer, &name)?;
+            self.write("\">")?;
+            write!(&mut self.writer, "{}", number)?;
+            self.write("</a></sup>")?;
+            // Write any buffered content
+            if !self.pending_footnote_content.is_empty() {
+                let content = std::mem::take(&mut self.pending_footnote_content);
+                escape_html_body_text(&mut self.writer, &content)?;
+                self.end_newline = content.ends_with('\n');
+            }
+        }
+        Ok(())
+    }
+
+    /// Emit wrapper element start based on pending block attrs
+    /// Returns true if a wrapper was emitted
+    fn emit_wrapper_start(&mut self) -> Result<bool, W::Error> {
+        if let Some(attrs) = self.pending_block_attrs.take() {
+            let is_aside = attrs.classes.iter().any(|c| c.as_ref() == "aside");
+
+            if !self.end_newline {
+                self.write("\n")?;
+            }
+
+            if is_aside {
+                self.write("<aside")?;
+                self.active_wrapper = Some((WrapperElement::Aside, self.block_depth));
+            } else {
+                self.write("<div")?;
+                self.active_wrapper = Some((WrapperElement::Div, self.block_depth));
+            }
+
+            // Write classes (excluding "aside" if using <aside> element)
+            let classes: Vec<_> = if is_aside {
+                attrs
+                    .classes
+                    .iter()
+                    .filter(|c| c.as_ref() != "aside")
+                    .collect()
+            } else {
+                attrs.classes.iter().collect()
+            };
+
+            if !classes.is_empty() {
+                self.write(" class=\"")?;
+                for (i, class) in classes.iter().enumerate() {
+                    if i > 0 {
+                        self.write(" ")?;
+                    }
+                    escape_html(&mut self.writer, class)?;
+                }
+                self.write("\"")?;
+            }
+
+            // Write other attrs
+            for (attr, value) in &attrs.attrs {
+                self.write(" ")?;
+                escape_html(&mut self.writer, attr)?;
+                self.write("=\"")?;
+                escape_html(&mut self.writer, value)?;
+                self.write("\"")?;
+            }
+
+            self.write(">\n")?;
+            Ok(true)
+        } else {
+            Ok(false)
+        }
+    }
+
+    /// Close active wrapper element if one is open and we're at the right depth
+    fn close_wrapper(&mut self) -> Result<(), W::Error> {
+        if let Some((wrapper, open_depth)) = self.active_wrapper.take() {
+            if self.block_depth == open_depth {
+                match wrapper {
+                    WrapperElement::Aside => self.write("</aside>\n")?,
+                    WrapperElement::Div => self.write("</div>\n")?,
+                }
+            } else {
+                // Not at the right depth yet, put it back
+                self.active_wrapper = Some((wrapper, open_depth));
+            }
+        }
+        Ok(())
+    }
+
     fn end_tag(&mut self, tag: markdown_weaver::TagEnd) -> Result<(), W::Error> {
         use markdown_weaver::TagEnd;
         match tag {
             TagEnd::HtmlBlock => {}
-            TagEnd::Paragraph => {
-                self.write("</p>\n")?;
+            TagEnd::Paragraph(ctx) => {
+                if self.in_sidenote {
+                    // Inside sidenote span - don't emit paragraph tags
+                } else if ctx == ParagraphContext::Interrupted && self.pending_footnote.is_some() {
+                    // Paragraph was interrupted AND we have a pending footnote,
+                    // defer the </p> close - the sidenote will be rendered inline
+                    self.defer_paragraph_close = true;
+                    // Don't decrement block_depth yet - we're continuing the virtual paragraph
+                } else if self.defer_paragraph_close {
+                    // We were deferring but now closing for real
+                    self.write("</p>\n")?;
+                    self.block_depth -= 1;
+                    self.close_wrapper()?;
+                    self.defer_paragraph_close = false;
+                } else {
+                    self.write("</p>\n")?;
+                    self.block_depth -= 1;
+                    self.close_wrapper()?;
+                }
             }
             TagEnd::Heading(level) => {
                 self.write("</")?;
                 write!(&mut self.writer, "{}", level)?;
+                self.block_depth -= 1;
+                // Don't close wrapper - headings typically go with following block
                 self.write(">\n")?;
             }
             TagEnd::Table => {
                 self.write("</tbody></table>\n")?;
+                self.block_depth -= 1;
+                self.close_wrapper()?;
             }
             TagEnd::TableHead => {
                 self.write("</tr></thead><tbody>\n")?;
···
                 self.table_cell_index += 1;
             }
             TagEnd::BlockQuote(_) => {
+                // Close any deferred paragraph before closing blockquote
+                // (footnotes inside blockquotes can't be sidenotes since def is outside)
+                self.close_deferred_paragraph()?;
                 self.write("</blockquote>\n")?;
+                self.block_depth -= 1;
+                self.close_wrapper()?;
             }
             TagEnd::CodeBlock => {
                 if let Some((lang, buffer)) = self.code_buffer.take() {
···
                 } else {
                     self.write("</code></pre>\n")?;
                 }
+                self.block_depth -= 1;
+                self.close_wrapper()?;
             }
             TagEnd::List(true) => {
                 self.write("</ol>\n")?;
+                self.block_depth -= 1;
+                self.close_wrapper()?;
             }
             TagEnd::List(false) => {
                 self.write("</ul>\n")?;
+                self.block_depth -= 1;
+                self.close_wrapper()?;
             }
             TagEnd::Item => {
                 self.write("</li>\n")?;
             }
             TagEnd::DefinitionList => {
                 self.write("</dl>\n")?;
+                self.block_depth -= 1;
+                self.close_wrapper()?;
             }
             TagEnd::DefinitionListTitle => {
                 self.write("</dt>\n")?;
···
             TagEnd::Embed => (), // shouldn't happen, handled in start
             TagEnd::WeaverBlock(_) => {
                 self.in_non_writing_block = false;
+                eprintln!(
+                    "[TagEnd::WeaverBlock] buffer: {:?}",
+                    self.weaver_block_buffer
+                );
+                // Parse the buffered text for attrs and store for next block
+                if !self.weaver_block_buffer.is_empty() {
+                    let parsed = Self::parse_weaver_attrs(&self.weaver_block_buffer);
+                    eprintln!("[TagEnd::WeaverBlock] parsed: {:?}", parsed);
+                    self.weaver_block_buffer.clear();
+                    // Merge with any existing pending attrs or set new
+                    if let Some(ref mut existing) = self.pending_block_attrs {
+                        existing.classes.extend(parsed.classes);
+                        existing.attrs.extend(parsed.attrs);
+                    } else {
+                        self.pending_block_attrs = Some(parsed);
+                    }
+                    eprintln!(
+                        "[TagEnd::WeaverBlock] pending_block_attrs now: {:?}",
+                        self.pending_block_attrs
+                    );
+                }
             }
             TagEnd::FootnoteDefinition => {
-                self.write("</div>\n")?;
+                if self.in_sidenote {
+                    self.write("</span>")?;
+                    self.in_sidenote = false;
+                    // Write any buffered content that came after the ref
+                    if !self.pending_footnote_content.is_empty() {
+                        let content = std::mem::take(&mut self.pending_footnote_content);
+                        escape_html_body_text(&mut self.writer, &content)?;
+                        self.end_newline = content.ends_with('\n');
+                    }
+                } else {
+                    self.write("</div>\n")?;
+                }
             }
             TagEnd::MetadataBlock(_) => {
                 self.in_non_writing_block = false;
···
         while let Some(event) = self.context.next().await {
             self.process_event(event).await?
         }
+        self.finalize()
+    }
+
+    /// Finalize output, closing any deferred state
+    fn finalize(&mut self) -> Result<(), W::Error> {
+        // Flush any pending footnote as traditional
+        self.flush_pending_footnote()?;
+        // Close deferred paragraph if any
+        if self.defer_paragraph_close {
+            self.write("</p>\n")?;
+            self.block_depth -= 1;
+            self.close_wrapper()?;
+            self.defer_paragraph_close = false;
+        }
         Ok(())
     }
 
···
         use markdown_weaver::Event::*;
         match event {
             Start(tag) => {
+                println!("Start tag: {:?}", tag);
                 self.start_tag(tag).await?;
             }
             End(tag) => {
···
                 // If buffering code, append to buffer instead of writing
                 if let Some((_, ref mut buffer)) = self.code_buffer {
                     buffer.push_str(&text);
+                } else if self.pending_footnote.is_some() {
+                    // Buffer text while waiting to see if footnote def follows
+                    self.pending_footnote_content.push_str(&text);
                 } else if !self.in_non_writing_block {
                     escape_html_body_text(&mut self.writer, &text)?;
                     self.end_newline = text.ends_with('\n');
···
                 self.write(&html)?;
             }
             SoftBreak => {
-                self.write_newline()?;
+                if self.pending_footnote.is_some() {
+                    self.pending_footnote_content.push('\n');
+                } else {
+                    self.write_newline()?;
+                }
             }
             HardBreak => {
-                self.write("<br />\n")?;
+                if self.pending_footnote.is_some() {
+                    self.pending_footnote_content.push_str("<br />\n");
+                } else {
+                    self.write("<br />\n")?;
+                }
             }
             Rule => {
                 if self.end_newline {
···
                 }
             }
             FootnoteReference(name) => {
+                // Flush any existing pending footnote as traditional
+                self.flush_pending_footnote()?;
+                // Get/create footnote number
                 let len = self.numbers.len() + 1;
-                self.write("<sup class=\"footnote-reference\"><a href=\"#")?;
-                escape_html(&mut self.writer, &name)?;
-                self.write("\">")?;
-                let number = *self.numbers.entry(name.into_static()).or_insert(len);
-                write!(&mut self.writer, "{}", number)?;
-                self.write("</a></sup>")?;
+                let number = *self
+                    .numbers
+                    .entry(name.clone().into_static())
+                    .or_insert(len);
+                // Buffer this reference to see if definition follows immediately
+                self.pending_footnote = Some((name.into_static(), number));
             }
             TaskListMarker(true) => {
                 self.write("<input disabled=\"\" type=\"checkbox\" checked=\"\"/>\n")?;
···
             TaskListMarker(false) => {
                 self.write("<input disabled=\"\" type=\"checkbox\"/>\n")?;
             }
-            WeaverBlock(_text) => {}
+            WeaverBlock(text) => {
+                // Buffer WeaverBlock content for parsing on End
+                eprintln!("[WeaverBlock event] text: {:?}", text);
+                self.weaver_block_buffer.push_str(&text);
+            }
         }
         Ok(())
     }
···
     async fn start_tag(&mut self, tag: Tag<'input>) -> Result<(), W::Error> {
         match tag {
             Tag::HtmlBlock => Ok(()),
-            Tag::Paragraph => {
-                if self.end_newline {
-                    self.write("<p>")
+            Tag::Paragraph(_) => {
+                if self.in_sidenote {
+                    // Inside sidenote span - don't emit paragraph tags
+                    Ok(())
+                } else if self.defer_paragraph_close {
+                    // We're continuing a virtual paragraph after a sidenote
+                    // Don't emit <p> or increment block_depth (already counted)
+                    // Clear defer flag - we'll set it again at end if another sidenote follows
+                    self.defer_paragraph_close = false;
+                    Ok(())
                 } else {
-                    self.write("\n<p>")
+                    self.flush_pending_footnote()?;
+                    self.emit_wrapper_start()?;
+                    self.block_depth += 1;
+                    if self.end_newline {
+                        self.write("<p>")
+                    } else {
+                        self.write("\n<p>")
+                    }
                 }
             }
             Tag::Heading {
···
                 classes,
                 attrs,
             } => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
+                self.block_depth += 1;
                 if self.end_newline {
                     self.write("<")?;
                 } else {
···
                 self.write(">")
             }
             Tag::Table(alignments) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
+                self.block_depth += 1;
                 self.table_alignments = alignments;
                 self.write("<table>")
             }
···
                 }
             }
             Tag::BlockQuote(kind) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
+                self.block_depth += 1;
                 let class_str = match kind {
                     None => "",
                     Some(kind) => match kind {
···
                 }
             }
             Tag::CodeBlock(info) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
+                self.block_depth += 1;
                 if !self.end_newline {
                     self.write_newline()?;
                 }
···
                 }
             }
             Tag::List(Some(1)) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
+                self.block_depth += 1;
                 if self.end_newline {
                     self.write("<ol>\n")
                 } else {
···
                 }
             }
             Tag::List(Some(start)) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
+                self.block_depth += 1;
                 if self.end_newline {
                     self.write("<ol start=\"")?;
                 } else {
···
                 self.write("\">\n")
             }
             Tag::List(None) => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
+                self.block_depth += 1;
                 if self.end_newline {
                     self.write("<ul>\n")
                 } else {
···
                 }
             }
             Tag::DefinitionList => {
+                self.close_deferred_paragraph()?;
+                self.emit_wrapper_start()?;
+                self.block_depth += 1;
                 if self.end_newline {
                     self.write("<dl>\n")
                 } else {
···
                 }
                 Ok(())
             }
-            Tag::WeaverBlock(_, _attrs) => {
-                println!("Weaver block");
+            Tag::WeaverBlock(_, attrs) => {
                 self.in_non_writing_block = true;
+                self.weaver_block_buffer.clear();
+                // Store attrs from Start tag, will merge with parsed text on End
+                if !attrs.classes.is_empty() || !attrs.attrs.is_empty() {
+                    self.pending_block_attrs = Some(attrs.into_static());
+                }
                 Ok(())
             }
             Tag::FootnoteDefinition(name) => {
-                if self.end_newline {
-                    self.write("<div class=\"footnote-definition\" id=\"")?;
+                // Check if this matches a pending footnote reference (sidenote case)
+                let is_sidenote = self
+                    .pending_footnote
+                    .as_ref()
+                    .map(|(n, _)| n.as_ref() == name.as_ref())
+                    .unwrap_or(false);
+
+                if is_sidenote {
+                    // Emit sidenote structure at reference position
+                    let (_, number) = self.pending_footnote.take().unwrap();
+                    let id = format!("sn-{}", number);
+
+                    // Emit: <label><input/><span class="sidenote">
+                    self.write("<label for=\"")?;
+                    self.write(&id)?;
+                    self.write("\" class=\"sidenote-number\"></label>")?;
+                    self.write("<input type=\"checkbox\" id=\"")?;
+                    self.write(&id)?;
+                    self.write("\" class=\"margin-toggle\"/>")?;
+                    self.write("<span class=\"sidenote\">")?;
+
+                    // Write any buffered content AFTER the sidenote span closes
+                    // (we'll do this in end_tag)
+                    self.in_sidenote = true;
                 } else {
-                    self.write("\n<div class=\"footnote-definition\" id=\"")?;
+                    // Traditional footnote - close any deferred paragraph (which also flushes pending ref)
+                    self.close_deferred_paragraph()?;
+
+                    if self.end_newline {
+                        self.write("<div class=\"footnote-definition\" id=\"")?;
+                    } else {
+                        self.write("\n<div class=\"footnote-definition\" id=\"")?;
+                    }
+                    escape_html(&mut self.writer, &name)?;
+                    self.write("\"><sup class=\"footnote-definition-label\">")?;
+                    let len = self.numbers.len() + 1;
+                    let number = *self.numbers.entry(name.into_static()).or_insert(len);
+                    write!(&mut self.writer, "{}", number)?;
+                    self.write("</sup>")?;
                 }
-                escape_html(&mut self.writer, &name)?;
-                self.write("\"><sup class=\"footnote-definition-label\">")?;
-                let len = self.numbers.len() + 1;
-                let number = *self.numbers.entry(name.into_static()).or_insert(len);
-                write!(&mut self.writer, "{}", number)?;
-                self.write("</sup>")
+                Ok(())
             }
             Tag::MetadataBlock(_) => {
                 self.in_non_writing_block = true;

lexicons/notebook/searchNotebooks.json

···
         "type": "params",
         "required": ["q"],
         "properties": {
-          "q": { "type": "string", "minLength": 1, "maxLength": 500 },
+          "q": {
+            "type": "string",
+            "minLength": 1,
+            "maxLength": 500
+          },
           "author": {
             "type": "string",
             "format": "at-identifier",
···
           },
           "tags": {
             "type": "array",
-            "items": { "type": "string" },
+            "items": {
+              "type": "string"
+            },
             "maxLength": 10,
             "description": "Filter by tags (all must match)."
           },
           "rating": {
             "type": "array",
-            "items": { "type": "ref", "ref": "sh.weaver.notebook.defs#contentRating" },
+            "items": {
+              "type": "string",
+              "knownValues": ["general", "teen", "mature", "explicit"]
+            },
             "description": "Filter by content rating (any of these)."
           },
           "sort": {
···
             "knownValues": ["relevance", "recent", "popular"],
             "default": "relevance"
           },
-          "limit": { "type": "integer", "minimum": 1, "maximum": 100, "default": 25 },
-          "cursor": { "type": "string" }
+          "limit": {
+            "type": "integer",
+            "minimum": 1,
+            "maximum": 100,
+            "default": 25
+          },
+          "cursor": {
+            "type": "string"
+          }
         }
       },
       "output": {
···
           "properties": {
             "notebooks": {
               "type": "array",
-              "items": { "type": "ref", "ref": "sh.weaver.notebook.defs#notebookView" }
+              "items": {
+                "type": "ref",
+                "ref": "sh.weaver.notebook.defs#notebookView"
+              }
             },
-            "cursor": { "type": "string" }
+            "cursor": {
+              "type": "string"
+            }
           }
         }
       }

lexicons/notification/listNotifications.json

···
         "properties": {
           "reasons": {
             "type": "array",
-            "items": { "type": "ref", "ref": "sh.weaver.notification.defs#notificationReason" },
+            "items": {
+              "type": "string",
+              "knownValues": [
+                "like",
+                "bookmark",
+                "follow",
+                "followAccept",
+                "subscribe",
+                "subscribeAccept",
+                "collaborationInvite",
+                "collaborationAccept",
+                "newEntry",
+                "entryUpdate",
+                "mention",
+                "tag",
+                "comment"
+              ]
+            },
             "description": "Filter by notification reasons."
           },
           "seenAt": {

test-output/test-sidenotes.html

···
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>test-sidenotes</title>
+  <style>
+/* CSS Reset */
+*, *::before, *::after {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
+}
+
+/* CSS Variables - Light Mode (default) */
+:root {
+    --color-base: #faf4ed;
+    --color-surface: #fffaf3;
+    --color-overlay: #f2e9e1;
+    --color-text: #1f1d2e;
+    --color-muted: #635e74;
+    --color-subtle: #4a4560;
+    --color-emphasis: #1e1a2d;
+    --color-primary: #907aa9;
+    --color-secondary: #56949f;
+    --color-tertiary: #286983;
+    --color-error: #b4637a;
+    --color-warning: #ea9d34;
+    --color-success: #286983;
+    --color-border: #dfdad9;
+    --color-link: #d7827e;
+    --color-highlight: #cecacd;
+
+    --font-body: 'Adobe Caslon Pro','Latin Modern Roman','Times New Roman','serif';
+    --font-heading: 'IBM Plex Sans','system-ui','sans-serif';
+    --font-mono: 'Ioskeley Mono','IBM Plex Mono','Berkeley Mono','Consolas','monospace';
+
+    --spacing-base: 16px;
+    --spacing-line-height: 1.6;
+    --spacing-scale: 1.25;
+}
+
+/* CSS Variables - Dark Mode */
+@media (prefers-color-scheme: dark) {
+    :root {
+        --color-base: #191724;
+        --color-surface: #1f1d2e;
+        --color-overlay: #26233a;
+        --color-text: #e0def4;
+        --color-muted: #6e6a86;
+        --color-subtle: #908caa;
+        --color-emphasis: #e0def4;
+        --color-primary: #c4a7e7;
+        --color-secondary: #9ccfd8;
+        --color-tertiary: #ebbcba;
+        --color-error: #eb6f92;
+        --color-warning: #f6c177;
+        --color-success: #31748f;
+        --color-border: #403d52;
+        --color-link: #ebbcba;
+        --color-highlight: #524f67;
+    }
+}
+
+/* Base Styles */
+html {
+    font-size: var(--spacing-base);
+    line-height: var(--spacing-line-height);
+}
+
+/* Scoped to notebook-content container */
+.notebook-content {
+    font-family: var(--font-body);
+    color: var(--color-text);
+    background-color: var(--color-base);
+    margin: 0 auto;
+    padding: 1rem 0rem;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
+    counter-reset: sidenote-counter;
+    max-width: 95ch;
+}
+
+/* When sidenotes exist, body padding creates the gutter */
+/* Left padding shrinks first as viewport narrows, right stays for sidenotes */
+body:has(.sidenote) {
+    padding-left: clamp(0rem, calc((100vw - 95ch - 15.5rem - 2rem) / 2), 15.5rem);
+    padding-right: 15.5rem;
+}
+
+/* Typography */
+h1, h2, h3, h4, h5, h6 {
+    font-family: var(--font-heading);
+    margin-top: calc(1rem * var(--spacing-scale));
+    margin-bottom: 0.5rem;
+    line-height: 1.2;
+}
+
+h1 {
+  font-size: 2rem;
+  color: var(--color-secondary);
+}
+h2 {
+  font-size: 1.5rem;
+  color: var(--color-primary);
+}
+h3 {
+  font-size: 1.25rem;
+  color: var(--color-secondary);
+}
+h4 {
+  font-size: 1.2rem;
+  color: var(--color-tertiary);
+}
+h5 {
+  font-size: 1.125rem;
+  color: var(--color-secondary);
+}
+h6 { font-size: 1rem; }
+
+p {
+    margin-bottom: 1rem;
+    word-wrap: break-word;
+    overflow-wrap: break-word;
+}
+
+a {
+    color: var(--color-link);
+    text-decoration: none;
+}
+
+.notebook-content a:hover {
+    color: var(--color-emphasis);
+    text-decoration: underline;
+}
+
+/* Wikilink validation (editor) */
+.link-valid {
+    color: var(--color-link);
+}
+
+.link-broken {
+    color: var(--color-error);
+    text-decoration: underline wavy;
+    text-decoration-color: var(--color-error);
+    opacity: 0.8;
+}
+
+/* Selection */
+::selection {
+    background: var(--color-highlight);
+    color: var(--color-text);
+}
+
+/* Lists */
+ul, ol {
+    margin-left: 1rem;
+    margin-bottom: 1rem;
+}
+
+li {
+    margin-bottom: 0.25rem;
+}
+
+/* Code */
+code {
+    font-family: var(--font-mono);
+    background: var(--color-surface);
+    padding: 0.125rem 0.25rem;
+    border-radius: 4px;
+    font-size: 0.9em;
+}
+
+pre {
+    overflow-x: auto;
+    margin-bottom: 1rem;
+    border-radius: 5px;
+    border: 1px solid var(--color-border);
+    box-sizing: border-box;
+}
+
+/* Code blocks inside pre are handled by syntax theme */
+pre code {
+
+    display: block;
+    width: fit-content;
+    min-width: 100%;
+    padding: 1rem;
+    background: var(--color-surface);
+}
+
+/* Math */
+.math {
+    font-family: var(--font-mono);
+}
+
+.math-display {
+    display: block;
+    margin: 1rem 0;
+    text-align: center;
+}
+
+/* Blockquotes */
+blockquote {
+    border-left: 2px solid var(--color-secondary);
+    background: var(--color-surface);
+    padding-left: 1rem;
+    padding-right: 1rem;
+    padding-top: 0.5rem;
+    padding-bottom: 0.04rem;
+    margin: 1rem 0;
+    font-size: 0.95em;
+    border-bottom-right-radius: 5px;
+    border-top-right-radius: 5px;
+}
+}
+
+/* Tables */
+table {
+    border-collapse: collapse;
+    width: 100%;
+    margin-bottom: 1rem;
+    display: block;
+    overflow-x: auto;
+    max-width: 100%;
+}
+
+th, td {
+    border: 1px solid var(--color-border);
+    padding: 0.5rem;
+    text-align: left;
+}
+
+th {
+    background: var(--color-surface);
+    font-weight: 600;
+}
+
+tr:hover {
+    background: var(--color-surface);
+}
+
+/* Footnotes */
+.footnote-reference {
+    font-size: 0.8em;
+    color: var(--color-subtle);
+}
+
+.footnote-definition {
+    order: 9999;
+    margin: 0;
+    padding: 0.5rem 0;
+    font-size: 0.9em;
+}
+
+.footnote-definition:first-of-type {
+    margin-top: 2rem;
+    padding-top: 1rem;
+    border-top: 2px solid var(--color-border);
+}
+
+.footnote-definition:first-of-type::before {
+    content: "Footnotes";
+    display: block;
+    font-weight: 600;
+    font-size: 1.1em;
+    color: var(--color-subtle);
+    margin-bottom: 0.75rem;
+}
+
+.footnote-definition-label {
+    font-weight: 600;
+    margin-right: 0.5rem;
+    color: var(--color-primary);
+}
+
+/* Aside blocks (via WeaverBlock prefix) */
+aside, .aside {
+    float: left;
+    width: 40%;
+    margin: 0 1.5rem 1rem 0;
+    padding: 1rem;
+    background: var(--color-surface);
+    border-right: 3px solid var(--color-primary);
+    font-size: 0.9em;
+    clear: left;
+}
+
+aside > *:first-child,
+.aside > *:first-child {
+    margin-top: 0;
+}
+
+aside > *:last-child,
+.aside > *:last-child {
+    margin-bottom: 0;
+}
+
+/* Reset blockquote styling inside asides */
+aside > blockquote,
+.aside > blockquote {
+    border-left: none;
+    background: transparent;
+    padding: 0;
+    margin: 0;
+    font-size: inherit;
+}
+
+/* Indent utilities */
+.indent-1 { margin-left: 1em; }
+.indent-2 { margin-left: 2em; }
+.indent-3 { margin-left: 3em; }
+
+/* Tufte-style Sidenotes */
+/* Hide checkbox for sidenote toggle */
+.margin-toggle {
+    display: none;
+}
+
+/* Sidenote number marker (inline superscript) */
+.sidenote-number {
+    counter-increment: sidenote-counter;
+}
+
+.sidenote-number::after {
+    content: counter(sidenote-counter);
+    font-size: 0.7em;
+    position: relative;
+    top: -0.5em;
+    color: var(--color-primary);
+    padding-left: 0.1em;
+}
+
+/* Sidenote content (margin notes on wide screens) */
+.sidenote {
+    float: right;
+    clear: right;
+    margin-right: -15.5rem;
+    width: 14rem;
+    margin-top: 0.3rem;
+    margin-bottom: 1rem;
+    font-size: 0.85em;
+    line-height: 1.4;
+    color: var(--color-subtle);
+}
+
+.sidenote::before {
+    content: counter(sidenote-counter) ". ";
+    color: var(--color-primary);
+}
+
+/* Mobile sidenotes: toggle behavior */
+@media (max-width: 900px) {
+    /* Reset sidenote gutter on mobile */
+    body:has(.sidenote) {
+        padding-right: 0;
+    }
+
+    aside, .aside {
+        float: none;
+        width: 100%;
+        margin: 1rem 0;
+    }
+
+    .sidenote {
+        display: none;
+    }
+
+    .margin-toggle:checked + .sidenote {
+        display: block;
+        float: none;
+        width: 95%;
+        margin: 0.5rem 2.5%;
+        padding: 0.5rem;
+        background: var(--color-surface);
+        border-left: 2px solid var(--color-primary);
+    }
+
+    label.sidenote-number {
+        cursor: pointer;
+    }
+
+    label.sidenote-number::after {
+        text-decoration: underline;
+    }
+}
+
+/* Images */
+img {
+    max-width: 100%;
+    height: auto;
+    display: block;
+    margin: 1rem 0;
+    border-radius: 4px;
+}
+
+/* Hygiene for iframes */
+.html-embed-block {
+    max-width: 100%;
+    height: auto;
+    display: block;
+    margin: 1rem 0;
+}
+
+/* AT Protocol Embeds - Container */
+/* Light mode: paper with shadow, dark mode: blueprint with borders */
+.atproto-embed {
+    display: block;
+    position: relative;
+    max-width: 550px;
+    margin: 1rem 0;
+    padding: 1rem;
+    background: var(--color-surface);
+    border-left: 2px solid var(--color-secondary);
+    box-shadow: 0 1px 2px color-mix(in srgb, var(--color-text) 8%, transparent);
+}
+
+.atproto-embed:hover {
+    border-left-color: var(--color-primary);
+}
+
+@media (prefers-color-scheme: dark) {
+    .atproto-embed {
+        box-shadow: none;
+        border: 1px solid var(--color-border);
+        border-left: 2px solid var(--color-secondary);
+    }
+}
+
+.atproto-embed-placeholder {
+    color: var(--color-muted);
+    font-style: italic;
+}
+
+.embed-loading {
+    display: block;
+    padding: 0.5rem 0;
+    color: var(--color-subtle);
+    font-family: var(--font-mono);
+    font-size: 0.85rem;
+}
+
+/* Embed Author Block */
+.embed-author {
+    display: flex;
+    align-items: center;
+    gap: 0.75rem;
+    padding-bottom: 0.5rem;
+}
+
+.embed-avatar {
+    width: 36px;
+    height: 36px;
+    max-width: 36px;
+    max-height: 36px;
+    aspect-ratio: 1;
+    margin: 0;
+    object-fit: cover;
+}
+
+.embed-author-info {
+    display: flex;
+    flex-direction: column;
+    gap: 0;
+    min-width: 0;
+}
+
+.embed-avatar-link {
+    display: block;
+    flex-shrink: 0;
+}
+
+.embed-author-name {
+    font-weight: 600;
+    color: var(--color-text);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    text-decoration: none;
+    line-height: 1.2;
+}
+
+a.embed-author-name:hover {
+    color: var(--color-link);
+}
+
+.embed-author-handle {
+    font-size: 0.85em;
+    font-family: var(--font-mono);
+    color: var(--color-subtle);
+    text-decoration: none;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    line-height: 1.2;
+}
+
+.embed-author-handle:hover {
+    color: var(--color-link);
+}
+
+/* Card-wide clickable link (sits behind content) */
+.embed-card-link {
+    position: absolute;
+    inset: 0;
+    z-index: 0;
+}
+
+.embed-card-link:focus {
+    outline: 2px solid var(--color-primary);
+    outline-offset: 2px;
+}
+
+/* Interactive elements sit above the card link */
+.embed-author,
+.embed-external,
+.embed-quote,
+.embed-images,
+.embed-meta {
+    position: relative;
+    z-index: 1;
+}
+
+/* Embed Content Block */
+.embed-content {
+    display: block;
+    color: var(--color-text);
+    line-height: 1.5;
+    margin-bottom: 0.75rem;
+    white-space: pre-wrap;
+}
+
+
+
+.embed-description {
+    display: block;
+    color: var(--color-text);
+    font-size: 0.95em;
+    line-height: 1.4;
+}
+
+/* Embed Metadata Block */
+.embed-meta {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    font-size: 0.85em;
+    color: var(--color-muted);
+    margin-top: 0.75rem;
+}
+
+.embed-stats {
+    display: flex;
+    gap: 1rem;
+    font-family: var(--font-mono);
+}
+
+.embed-stat {
+    color: var(--color-subtle);
+    font-size: 0.9em;
+}
+
+.embed-time {
+    color: var(--color-subtle);
+    text-decoration: none;
+    font-family: var(--font-mono);
+    font-size: 0.9em;
+}
+
+.embed-time:hover {
+    color: var(--color-link);
+}
+
+.embed-type {
+    font-size: 0.8em;
+    color: var(--color-subtle);
+    font-family: var(--font-mono);
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+}
+
+/* Embed URL link (shown with syntax in editor) */
+.embed-url {
+    color: var(--color-link);
+    font-family: var(--font-mono);
+    font-size: 0.9em;
+    word-break: break-all;
+}
+
+/* External link cards */
+.embed-external {
+    display: flex;
+    gap: 0.75rem;
+    padding: 0.75rem;
+    background: var(--color-surface);
+    border: 1px dashed var(--color-border);
+    text-decoration: none;
+    color: inherit;
+    margin-top: 0.5rem;
+}
+
+.embed-external:hover {
+    border-left: 2px solid var(--color-primary);
+    margin-left: -1px;
+}
+
+@media (prefers-color-scheme: dark) {
+    .embed-external {
+        border: 1px solid var(--color-border);
+    }
+
+    .embed-external:hover {
+        border-left: 2px solid var(--color-primary);
+        margin-left: -1px;
+    }
+}
+
+.embed-external-thumb {
+    width: 120px;
+    height: 80px;
+    object-fit: cover;
+    flex-shrink: 0;
+}
+
+.embed-external-info {
+    display: flex;
+    flex-direction: column;
+    gap: 0.25rem;
+    min-width: 0;
+}
+
+.embed-external-title {
+    font-weight: 600;
+    color: var(--color-text);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+.embed-external-description {
+    font-size: 0.9em;
+    color: var(--color-muted);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+}
+
+.embed-external-url {
+    font-size: 0.8em;
+    font-family: var(--font-mono);
+    color: var(--color-subtle);
+}
+
+/* Image embeds */
+.embed-images {
+    display: grid;
+    gap: 4px;
+    margin-top: 0.5rem;
+    overflow: hidden;
+}
+
+.embed-images-1 {
+    grid-template-columns: 1fr;
+}
+
+.embed-images-2 {
+    grid-template-columns: 1fr 1fr;
+}
+
+.embed-images-3 {
+    grid-template-columns: 1fr 1fr;
+}
+
+.embed-images-4 {
+    grid-template-columns: 1fr 1fr;
+}
+
+.embed-image-link {
+    display: block;
+    line-height: 0;
+}
+
+.embed-image {
+    width: 100%;
+    height: auto;
+    max-height: 500px;
+    object-fit: cover;
+    object-position: center;
+    margin: 0;
+}
+
+/* Quoted records */
+.embed-quote {
+    display: block;
+    margin-top: 0.5rem;
+    padding: 0.75rem;
+    background: var(--color-overlay);
+    border-left: 2px solid var(--color-tertiary);
+}
+
+@media (prefers-color-scheme: dark) {
+    .embed-quote {
+        border: 1px solid var(--color-border);
+        border-left: 2px solid var(--color-tertiary);
+    }
+}
+
+.embed-quote .embed-author {
+    margin-bottom: 0.5rem;
+}
+
+.embed-quote .embed-avatar {
+    width: 24px;
+    height: 24px;
+    min-width: 24px;
+    min-height: 24px;
+    max-width: 24px;
+    max-height: 24px;
+}
+
+.embed-quote .embed-content {
+    font-size: 0.95em;
+    margin-bottom: 0;
+}
+
+/* Placeholder states */
+.embed-video-placeholder,
+.embed-not-found,
+.embed-blocked,
+.embed-detached,
+.embed-unknown {
+    display: block;
+    padding: 1rem;
+    background: var(--color-overlay);
+    border-left: 2px solid var(--color-border);
+    color: var(--color-muted);
+    font-style: italic;
+    margin-top: 0.5rem;
+    font-family: var(--font-mono);
+    font-size: 0.9em;
+}
+
+@media (prefers-color-scheme: dark) {
+    .embed-video-placeholder,
+    .embed-not-found,
+    .embed-blocked,
+    .embed-detached,
+    .embed-unknown {
+        border: 1px dashed var(--color-border);
+    }
+}
+
+/* Record card embeds (feeds, lists, labelers, starter packs) */
+.embed-record-card {
+    display: block;
+    margin-top: 0.5rem;
+    padding: 0.75rem;
+    background: var(--color-overlay);
+    border-left: 2px solid var(--color-tertiary);
+}
+
+.embed-record-card > .embed-author-name {
+    display: block;
+    font-size: 1.1em;
+}
+
+.embed-subtitle {
+    display: block;
+    font-size: 0.85em;
+    color: var(--color-muted);
+    margin-bottom: 0.5rem;
+}
+
+.embed-record-card .embed-description {
+    display: block;
+    margin: 0.5rem 0;
+}
+
+.embed-record-card .embed-stats {
+    display: block;
+    margin-top: 0.25rem;
+}
+
+/* Generic record fields */
+.embed-fields {
+    display: block;
+    margin-top: 0.5rem;
+    font-family: var(--font-ui);
+    font-size: 0.85rem;
+    color: var(--color-muted);
+}
+
+.embed-field {
+    display: block;
+    margin-top: 0.25rem;
+}
+
+/* Nested fields get indentation */
+.embed-fields .embed-fields {
+    display: block;
+    margin-top: 0.5rem;
+    margin-left: 1rem;
+    padding-left: 0.5rem;
+    border-left: 1px solid var(--color-border);
+}
+
+/* Type label inside fields should be block with spacing */
+.embed-fields > .embed-author-handle {
+    display: block;
+    margin-bottom: 0.25rem;
+}
+
+.embed-field-name {
+    color: var(--color-subtle);
+}
+
+.embed-field-number {
+    color: var(--color-tertiary);
+}
+
+.embed-field-date {
+    color: var(--color-muted);
+}
+
+.embed-field-count {
+    color: var(--color-muted);
+    font-style: italic;
+}
+
+.embed-field-bool-true {
+    color: var(--color-success);
+}
+
+.embed-field-bool-false {
+    color: var(--color-muted);
+}
+
+.embed-field-link,
+.embed-field-aturi {
+    color: var(--color-link);
+    text-decoration: none;
+}
+
+.embed-field-link:hover,
+.embed-field-aturi:hover {
+    text-decoration: underline;
+}
+
+.embed-field-did {
+    font-family: var(--font-mono);
+    font-size: 0.9em;
+}
+
+.embed-field-did .did-scheme,
+.embed-field-did .did-separator {
+    color: var(--color-muted);
+}
+
+.embed-field-did .did-method {
+    color: var(--color-tertiary);
+}
+
+.embed-field-did .did-identifier {
+    color: var(--color-text);
+}
+
+.embed-field-nsid {
+    color: var(--color-secondary);
+}
+
+.embed-field-handle {
+    color: var(--color-link);
+}
+
+/* AT URI highlighting */
+.aturi-scheme {
+    color: var(--color-muted);
+}
+
+.aturi-slash {
+    color: var(--color-muted);
+}
+
+.aturi-authority {
+    color: var(--color-link);
+}
+
+.aturi-collection {
+    color: var(--color-secondary);
+}
+
+.aturi-rkey {
+    color: var(--color-tertiary);
+}
+
+/* Generic AT Protocol record embed */
+.atproto-record > .embed-author-handle {
+    display: block;
+    margin-bottom: 0.25rem;
+}
+
+.atproto-record > .embed-author-name {
+    display: block;
+    margin-bottom: 0.5rem;
+}
+
+.atproto-record > .embed-content {
+    margin-bottom: 0.5rem;
+}
+
+/* Notebook entry embed - full width, expandable */
+.atproto-entry {
+    max-width: none;
+    width: 100%;
+    margin: 1.5rem 0;
+    padding: 0;
+    background: var(--color-surface);
+    border: 1px solid var(--color-border);
+    border-left: 1px solid var(--color-border);
+    box-shadow: none;
+    overflow: hidden;
+}
+
+.atproto-entry:hover {
+    border-left-color: var(--color-border);
+}
+
+@media (prefers-color-scheme: dark) {
+    .atproto-entry {
+        border: 1px solid var(--color-border);
+        border-left: 1px solid var(--color-border);
+    }
+}
+
+.embed-entry-header {
+    display: flex;
+    flex-wrap: wrap;
+    align-items: baseline;
+    gap: 0.5rem 1rem;
+    padding: 0.75rem 1rem;
+    background: var(--color-overlay);
+    border-bottom: 1px solid var(--color-border);
+}
+
+.embed-entry-title {
+    font-size: 1.1em;
+    font-weight: 600;
+    color: var(--color-text);
+}
+
+.embed-entry-author {
+    font-size: 0.85em;
+    color: var(--color-muted);
+}
+
+/* Hidden checkbox for expand/collapse */
+.embed-entry-toggle {
+    display: none;
+}
+
+/* Content wrapper - scrollable when collapsed */
+.embed-entry-content {
+    max-height: 30rem;
+    overflow-y: auto;
+    padding: 1rem;
+    transition: max-height 0.3s ease;
+}
+
+/* When checkbox is checked, expand fully */
+.embed-entry-toggle:checked ~ .embed-entry-content {
+    max-height: none;
+}
+
+/* Expand/collapse button */
+.embed-entry-expand {
+    display: block;
+    width: 100%;
+    padding: 0.5rem;
+    text-align: center;
+    font-size: 0.85em;
+    font-family: var(--font-ui);
+    color: var(--color-muted);
+    background: var(--color-overlay);
+    border-top: 1px solid var(--color-border);
+    cursor: pointer;
+    user-select: none;
+}
+
+.embed-entry-expand:hover {
+    color: var(--color-text);
+    background: var(--color-surface);
+}
+
+/* Toggle button text */
+.embed-entry-expand::before {
+    content: "Expand ↓";
+}
+
+.embed-entry-toggle:checked ~ .embed-entry-expand::before {
+    content: "Collapse ↑";
+}
+
+/* Hide expand button if content doesn't overflow (via JS class) */
+.atproto-entry.no-overflow .embed-entry-expand {
+    display: none;
+}
+
+/* Horizontal Rule */
+hr {
+    border: none;
+    border-top: 2px solid var(--color-border);
+    margin: 2rem 0;
+}
+
+/* Tablet and mobile responsiveness */
+@media (max-width: 900px) {
+    .notebook-content {
+        padding: 1.5rem 1rem;
+        max-width: 100%;
+    }
+
+    h1 { font-size: 1.85rem; }
+    h2 { font-size: 1.4rem; }
+    h3 { font-size: 1.2rem; }
+
+    blockquote {
+        margin-left: 0;
+        margin-right: 0;
+    }
+}
+
+/* Small mobile phones */
+@media (max-width: 480px) {
+    .notebook-content {
+        padding: 1rem 0.75rem;
+    }
+
+    h1 { font-size: 1.65rem; }
+    h2 { font-size: 1.3rem; }
+    h3 { font-size: 1.1rem; }
+
+    blockquote {
+        padding-left: 0.75rem;
+        padding-right: 0.75rem;
+    }
+}
+  </style>
+  <style>
+/* Syntax highlighting - Light Mode (default) */
+/*
+ * theme "Rosé Pine Dawn" generated by syntect
+ */
+
+.wvc-code {
+ color: #575279;
+ background-color: #faf4ed;
+}
+
+.wvc-comment {
+ color: #797593;
+font-style: italic;
+}
+.wvc-string, .wvc-punctuation.wvc-definition.wvc-string {
+ color: #ea9d34;
+}
+.wvc-constant.wvc-numeric {
+ color: #ea9d34;
+}
+.wvc-constant.wvc-language {
+ color: #ea9d34;
+font-weight: bold;
+}
+.wvc-constant.wvc-character, .wvc-constant.wvc-other {
+ color: #ea9d34;
+}
+.wvc-variable {
+ color: #575279;
+font-style: italic;
+}
+.wvc-keyword {
+ color: #286983;
+}
+.wvc-storage {
+ color: #56949f;
+}
+.wvc-storage.wvc-type {
+ color: #56949f;
+}
+.wvc-entity.wvc-name.wvc-class {
+ color: #286983;
+font-weight: bold;
+}
+.wvc-entity.wvc-other.wvc-inherited-class {
+ color: #286983;
+font-style: italic;
+}
+.wvc-entity.wvc-name.wvc-function {
+ color: #d7827e;
+font-style: italic;
+}
+.wvc-variable.wvc-parameter {
+ color: #907aa9;
+}
+.wvc-entity.wvc-name.wvc-tag {
+ color: #286983;
+font-weight: bold;
+}
+.wvc-entity.wvc-other.wvc-attribute-name {
+ color: #907aa9;
+}
+.wvc-support.wvc-function {
+ color: #d7827e;
+font-weight: bold;
+}
+.wvc-support.wvc-constant {
+ color: #ea9d34;
+font-weight: bold;
+}
+.wvc-support.wvc-type, .wvc-support.wvc-class {
+ color: #56949f;
+font-weight: bold;
+}
+.wvc-support.wvc-other.wvc-variable {
+ color: #b4637a;
+font-weight: bold;
+}
+.wvc-invalid {
+ color: #575279;
+ background-color: #b4637a;
+}
+.wvc-invalid.wvc-deprecated {
+ color: #575279;
+ background-color: #907aa9;
+}
+.wvc-punctuation, .wvc-keyword.wvc-operator {
+ color: #797593;
+}
+
+
+/* Syntax highlighting - Dark Mode */
+@media (prefers-color-scheme: dark) {
+/*
+ * theme "Rosé Pine" generated by syntect
+ */
+
+.wvc-code {
+ color: #e0def4;
+ background-color: #191724;
+}
+
+.wvc-comment {
+ color: #908caa;
+font-style: italic;
+}
+.wvc-string, .wvc-punctuation.wvc-definition.wvc-string {
+ color: #f6c177;
+}
+.wvc-constant.wvc-numeric {
+ color: #f6c177;
+}
+.wvc-constant.wvc-language {
+ color: #f6c177;
+font-weight: bold;
+}
+.wvc-constant.wvc-character, .wvc-constant.wvc-other {
+ color: #f6c177;
+}
+.wvc-variable {
+ color: #e0def4;
+font-style: italic;
+}
+.wvc-keyword {
+ color: #31748f;
+}
+.wvc-storage {
+ color: #9ccfd8;
+}
+.wvc-storage.wvc-type {
+ color: #9ccfd8;
+}
+.wvc-entity.wvc-name.wvc-class {
+ color: #31748f;
+font-weight: bold;
+}
+.wvc-entity.wvc-other.wvc-inherited-class {
+ color: #31748f;
+font-style: italic;
+}
+.wvc-entity.wvc-name.wvc-function {
+ color: #ebbcba;
+font-style: italic;
+}
+.wvc-variable.wvc-parameter {
+ color: #c4a7e7;
+}
+.wvc-entity.wvc-name.wvc-tag {
+ color: #31748f;
+font-weight: bold;
+}
+.wvc-entity.wvc-other.wvc-attribute-name {
+ color: #c4a7e7;
+}
+.wvc-support.wvc-function {
+ color: #ebbcba;
+font-weight: bold;
+}
+.wvc-support.wvc-constant {
+ color: #f6c177;
+font-weight: bold;
+}
+.wvc-support.wvc-type, .wvc-support.wvc-class {
+ color: #9ccfd8;
+font-weight: bold;
+}
+.wvc-support.wvc-other.wvc-variable {
+ color: #eb6f92;
+font-weight: bold;
+}
+.wvc-invalid {
+ color: #e0def4;
+ background-color: #eb6f92;
+}
+.wvc-invalid.wvc-deprecated {
+ color: #e0def4;
+ background-color: #c4a7e7;
+}
+.wvc-punctuation, .wvc-keyword.wvc-operator {
+ color: #908caa;
+}
+}
+  </style>
+</head>
+<body style="background: var(--color-base); min-height: 100vh;">
+<div class="notebook-content">
+<h1>Weaver: Long-form Writing on AT Protocol</h1>
+<p><em>Or: "Get in kid, we're rebuilding the blogosphere!"</em></p>
+<p>I grew up, like a lot of people on Bluesky, in the era of the internet where most of your online social interactions took place via text. I had a MySpace account, MSN messenger and Google Chat, I first got on Facebook back when they required a school email to sign up, I had a Tumblr, though not a LiveJournal.<label for="sn-1" class="sidenote-number"></label><input type="checkbox" id="sn-1" class="margin-toggle"/><span class="sidenote">Hi Rahaeli. Sorry I was the wrong kind of nerd.</span></p>
+<blockquote>
+<p><img src="weaver_photo_med.jpg" alt="weaver_photo_med.jpg" /><em>The namesake of what I'm building</em></p>
+</blockquote>
+<p>Social media in the conventional sense has been in a lot of ways a small part of the story of my time on the internet. The broader independent blogosphere of my teens and early adulthood shaped my worldview, and I was an avid reader and sometime participant there.</p>
+<h2>The Blogosphere</h2>
+<p>I am an atheist in large part because of a blog called Common Sense Atheism.<label for="sn-2" class="sidenote-number"></label><input type="checkbox" id="sn-2" class="margin-toggle"/><span class="sidenote">The author, Luke Muehlhauser, was criticising both Richard Dawkins <em>and</em> some Christian apologetics I was familiar with.</span> Luke's blog was part of a cluster of blogs out of which grew the rationalists, one of, for better or for worse, the most influential intellectual movements of the 21st century.I also read blogs like boingboing.net, was a big fan of Cory Doctorow. I figured out I am trans in part because of Thing of Things,<label for="sn-3" class="sidenote-number"></label><input type="checkbox" id="sn-3" class="margin-toggle"/><span class="sidenote">Specifically their piece on the <a href="https://thingofthings.wordpress.com/2017/05/05/the-cluster-structure-of-genderspace/">cluster structure of genderspace</a>.</span> a blog by Ozy Frantz, a transmasc person in the broader rationalist and Effective Altruist blogosphere.One thing these all have in common is length. Part of the reason I only really got onto Twitter in 2020 or so was because the concept of microblogging, of having to fit your thoughts into such a small package, baffled me for ages.<label for="sn-4" class="sidenote-number"></label><input type="checkbox" id="sn-4" class="margin-toggle"/><span class="sidenote">Amusingly I now think that being on Twitter and now Bluesky made me a better writer. Restrictions breed creativity, after all.</span></p>
+<aside>
+<blockquote>
+<p><strong>On Platform Decay</strong></p>
+<p>Through all of this I was never really satisfied with the options that were out there for long-form writing. Wordpress required too much setup. Tumblr's system for comments remains insane. Hosting my own seemed like too much money to burn on something nobody might read.</p>
+</blockquote>
+</aside>
+<p>But at the same time, Substack's success proves that there is very much a desire for long-form writing, enough that people will pay for it, and that investors will back it. There are thoughts and forms of writing that you simply cannot fit into a post or even a thread of posts.</p>
+<p>Plus, I'm loathe to enable a centralised platform like Substack where the owners are unfortunately friendly to fascists.<label for="sn-5" class="sidenote-number"></label><input type="checkbox" id="sn-5" class="margin-toggle"/><span class="sidenote">I am very much a fan of freedom of expression. I'm not so much a fan of paying money to Nazis.</span>That's where the <code>at://</code> protocol and Weaver comes in.</p>
+<h2>The Pitch</h2>
+<p>Weaver is designed to be a highly flexible platform for medium and long-form writing on atproto.<label for="sn-6" class="sidenote-number"></label><input type="checkbox" id="sn-6" class="margin-toggle"/><span class="sidenote">The weaver bird builds intricate, self-contained homes—seemed fitting for a platform about owning your writing.</span> I was inspired by how weaver birds build their own homes, and by the notebooks, physical and virtual, that I create in the course of my work.The initial proof-of-concept is essentially a static site generator, able to turn a Markdown text file or a folder of Markdown files into a static "notebook" site. The intermediate goal is an elegant and intuitive writing platform with collaborative editing and straightforward, immediate publishing via a web-app.</p>
+<aside>
+<blockquote>
+<p><strong>The Ultimate Goal</strong></p>
+<p>Build a platform suitable for professional writers and journalists, an open alternative to platforms like Substack, with ways for readers to support writers, all on the <code>at://</code> protocol.</p>
+</blockquote>
+</aside>
+<h2>How It Works</h2>
+<p>Weaver works on a concept of notebooks with entries, which can be grouped into pages or chapters. They can have multiple attributed authors. You can tear out a metaphorical page and stick it in another notebook.</p>
+<p>You own what you write.<label for="sn-7" class="sidenote-number"></label><input type="checkbox" id="sn-7" class="margin-toggle"/><span class="sidenote">Technically you can include entries you don't control in your notebooks, although this isn't a supported mode—it's about <em>your</em> ownership of <em>your</em> words.</span> And once collaborative editing is in, collaborative work will be resilient against deletion by one author. They can delete their notebook or even their account, but what you write will be safe.Entries are Markdown text—specifically, an extension on the Obsidian flavour of Markdown.<label for="sn-8" class="sidenote-number"></label><input type="checkbox" id="sn-8" class="margin-toggle"/><span class="sidenote">I forked the popular rust markdown processing library <code>pulldown-cmark</code> because it had limited extensibility along the axes I wanted—custom syntax extensions to support Obsidian's Markdown flavour and additional useful features, like some of the ones on show here!</span> They support additional embed types, including atproto record embeds and other markdown documents, as well as resizable images.</p>
+<h2>Why Rust?</h2>
+<p>As to why I'm writing it in Rust (and currently zero Typescript) as opposed to Go and Typescript? Well it comes down to familiarity. Rust isn't necessarily anyone's first choice in a vacuum for a web-native programming language, but it works quite well as one. I can share the vast majority of the protocol code, as well as the markdown rendering engine, between front and back end, with few if any compromises on performance, save a larger bundle size due to the nature of WebAssembly.</p>
+<aside>
+<blockquote>
+<p><strong>On Interoperability</strong></p>
+<p>The <code>at://</code> protocol, while it was developed in concert with a microblogging app, is actually pretty damn good for "macroblogging" too. Weaver's app server can display Whitewind posts. With effort, it can faithfully render Leaflet posts. It doesn't care what app your profile is on.</p>
+</blockquote>
+</aside>
+<h2>Evolution</h2>
+<p>Weaver is therefore very much an evolving thing. It will always have and support the proof-of-concept workflow as a first-class citizen. That's part of the benefit of building this on atproto.</p>
+<p>If I screw this up, not too hard for someone else to pick up the torch and continue.<label for="sn-9" class="sidenote-number"></label><input type="checkbox" id="sn-9" class="margin-toggle"/><span class="sidenote">This is the traditional footnote, at the end, because sometimes you want your citations at the bottom of the page rather than in the margins.</span></p>
+</div>
+</body>
+</html>

test-sidenotes.md

···
+# Weaver: Long-form Writing on AT Protocol
+
+*Or: "Get in kid, we're rebuilding the blogosphere!"*
+
+I grew up, like a lot of people on Bluesky, in the era of the internet where most of your online social interactions took place via text. I had a MySpace account, MSN messenger and Google Chat, I first got on Facebook back when they required a school email to sign up, I had a Tumblr, though not a LiveJournal.[^nostalgia]
+[^nostalgia]: Hi Rahaeli. Sorry I was the wrong kind of nerd.
+
+> ![[weaver_photo_med.jpg]]*The namesake of what I'm building*
+
+Social media in the conventional sense has been in a lot of ways a small part of the story of my time on the internet. The broader independent blogosphere of my teens and early adulthood shaped my worldview, and I was an avid reader and sometime participant there.
+
+## The Blogosphere
+
+I am an atheist in large part because of a blog called Common Sense Atheism.[^csa] Luke's blog was part of a cluster of blogs out of which grew the rationalists, one of, for better or for worse, the most influential intellectual movements of the 21st century.
+[^csa]: The author, Luke Muehlhauser, was criticising both Richard Dawkins *and* some Christian apologetics I was familiar with.
+
+I also read blogs like boingboing.net, was a big fan of Cory Doctorow. I figured out I am trans in part because of Thing of Things,[^ozy] a blog by Ozy Frantz, a transmasc person in the broader rationalist and Effective Altruist blogosphere.
+[^ozy]: Specifically their piece on the [cluster structure of genderspace](https://thingofthings.wordpress.com/2017/05/05/the-cluster-structure-of-genderspace/).
+
+One thing these all have in common is length. Part of the reason I only really got onto Twitter in 2020 or so was because the concept of microblogging, of having to fit your thoughts into such a small package, baffled me for ages.[^irony]
+[^irony]: Amusingly I now think that being on Twitter and now Bluesky made me a better writer. Restrictions breed creativity, after all.
+
+{.aside}
+> **On Platform Decay**
+>
+> Through all of this I was never really satisfied with the options that were out there for long-form writing. Wordpress required too much setup. Tumblr's system for comments remains insane. Hosting my own seemed like too much money to burn on something nobody might read.
+
+But at the same time, Substack's success proves that there is very much a desire for long-form writing, enough that people will pay for it, and that investors will back it. There are thoughts and forms of writing that you simply cannot fit into a post or even a thread of posts.
+
+Plus, I'm loathe to enable a centralised platform like Substack where the owners are unfortunately friendly to fascists.[^substack]
+[^substack]: I am very much a fan of freedom of expression. I'm not so much a fan of paying money to Nazis.
+
+That's where the `at://` protocol and Weaver comes in.
+
+## The Pitch
+
+Weaver is designed to be a highly flexible platform for medium and long-form writing on atproto.[^namesake] I was inspired by how weaver birds build their own homes, and by the notebooks, physical and virtual, that I create in the course of my work.
+[^namesake]: The weaver bird builds intricate, self-contained homes—seemed fitting for a platform about owning your writing.
+
+The initial proof-of-concept is essentially a static site generator, able to turn a Markdown text file or a folder of Markdown files into a static "notebook" site. The intermediate goal is an elegant and intuitive writing platform with collaborative editing and straightforward, immediate publishing via a web-app.
+
+{.aside}
+> **The Ultimate Goal**
+>
+> Build a platform suitable for professional writers and journalists, an open alternative to platforms like Substack, with ways for readers to support writers, all on the `at://` protocol.
+
+## How It Works
+
+Weaver works on a concept of notebooks with entries, which can be grouped into pages or chapters. They can have multiple attributed authors. You can tear out a metaphorical page and stick it in another notebook.
+
+You own what you write.[^ownership] And once collaborative editing is in, collaborative work will be resilient against deletion by one author. They can delete their notebook or even their account, but what you write will be safe.
+[^ownership]: Technically you can include entries you don't control in your notebooks, although this isn't a supported mode—it's about *your* ownership of *your* words.
+
+Entries are Markdown text—specifically, an extension on the Obsidian flavour of Markdown.[^markdown] They support additional embed types, including atproto record embeds and other markdown documents, as well as resizable images.
+[^markdown]: I forked the popular rust markdown processing library `pulldown-cmark` because it had limited extensibility along the axes I wanted—custom syntax extensions to support Obsidian's Markdown flavour and additional useful features, like some of the ones on show here!
+
+## Why Rust?
+
+As to why I'm writing it in Rust (and currently zero Typescript) as opposed to Go and Typescript? Well it comes down to familiarity. Rust isn't necessarily anyone's first choice in a vacuum for a web-native programming language, but it works quite well as one. I can share the vast majority of the protocol code, as well as the markdown rendering engine, between front and back end, with few if any compromises on performance, save a larger bundle size due to the nature of WebAssembly.
+
+{.aside}
+> **On Interoperability**
+>
+> The `at://` protocol, while it was developed in concert with a microblogging app, is actually pretty damn good for "macroblogging" too. Weaver's app server can display Whitewind posts. With effort, it can faithfully render Leaflet posts. It doesn't care what app your profile is on.
+
+## Evolution
+
+Weaver is therefore very much an evolving thing. It will always have and support the proof-of-concept workflow as a first-class citizen. That's part of the benefit of building this on atproto.
+
+If I screw this up, not too hard for someone else to pick up the torch and continue.[^open]
+[^open]: This is the traditional footnote, at the end, because sometimes you want your citations at the bottom of the page rather than in the margins.