diff --git a/src/renderer.html b/src/renderer.html
index f5aeffc4..4b21b704 100644
--- a/src/renderer.html
+++ b/src/renderer.html
@@ -72,6 +72,9 @@ <h2 class="signin-title">OneNote Web Clipper</h2>
 				<button class="mode-btn" data-mode="pdf" aria-pressed="false" style="display:none;">
 					<img class="mode-icon-img" src="images/pdf.png" alt=""><span>PDF</span>
 				</button>
+				<button class="mode-btn" data-mode="selection" aria-pressed="false" style="display:none;">
+					<svg class="mode-icon" width="20" height="20" viewBox="0 0 20 20" fill="none" aria-hidden="true"><path d="M3 5.25C3 4.55964 3.55964 4 4.25 4C4.6836 4 5.06594 4.22035 5.29087 4.5575C5.44413 4.78722 5.75458 4.8492 5.9843 4.69594C6.21401 4.54269 6.27599 4.23223 6.12273 4.00252C5.72021 3.39918 5.03182 3 4.25 3C3.00736 3 2 4.00736 2 5.25C2 6.49264 3.00736 7.5 4.25 7.5C4.27225 7.5 4.29416 7.49855 4.31565 7.49573C4.33715 7.49855 4.35908 7.50001 4.38135 7.50001L15.5 7.5C15.7761 7.5 16 7.27614 16 7C16 6.72386 15.7761 6.5 15.5 6.5L4.38135 6.50001C4.3591 6.50001 4.33718 6.50146 4.3157 6.50428C4.2942 6.50146 4.27227 6.5 4.25 6.5C3.55964 6.5 3 5.94036 3 5.25ZM8.49988 4C8.22374 4 7.99988 4.22386 7.99988 4.5C7.99988 4.77614 8.22374 5 8.49988 5H17.4999C17.776 5 17.9999 4.77614 17.9999 4.5C17.9999 4.22386 17.776 4 17.4999 4H8.49988ZM5.50055 9C5.22441 9 5.00055 9.22386 5.00055 9.5C5.00055 9.77614 5.22441 10 5.50055 10H11.3369C12.2316 9.36997 13.3226 9 14.5 9H5.50055ZM2.5 11.5H9.88947C9.68555 11.8128 9.51259 12.1475 9.37494 12.5H2.5C2.22386 12.5 2 12.2761 2 12C2 11.7239 2.22386 11.5 2.5 11.5ZM5.50055 14H9.02242C9.00758 14.1647 9 14.3315 9 14.5C9 14.6685 9.00758 14.8353 9.02242 15H5.50055C5.22441 15 5.00055 14.7761 5.00055 14.5C5.00055 14.2239 5.22441 14 5.50055 14ZM19 14.5C19 16.9853 16.9853 19 14.5 19C12.0147 19 10 16.9853 10 14.5C10 12.0147 12.0147 10 14.5 10C16.9853 10 19 12.0147 19 14.5ZM15 12.5C15 12.2239 14.7761 12 14.5 12C14.2239 12 14 12.2239 14 12.5V14H12.5C12.2239 14 12 14.2239 12 14.5C12 14.7761 12.2239 15 12.5 15H14V16.5C14 16.7761 14.2239 17 14.5 17C14.7761 17 15 16.7761 15 16.5V15H16.5C16.7761 15 17 14.7761 17 14.5C17 14.2239 16.7761 14 16.5 14H15V12.5Z" fill="currentColor"/></svg><span>Selection</span>
+				</button>
 			</div>
 			<div id="pdf-options" style="display:none;" role="group" aria-label="PDF options">
 				<div id="pdf-page-selection" role="radiogroup" aria-label="Page selection">
@@ -151,6 +154,7 @@ <h2 class="signin-title">OneNote Web Clipper</h2>
 </div>
 <div id="aria-status" class="sr-only" aria-live="polite" aria-atomic="true"></div>
 <script src="pdf.combined.js"></script>
+<script src="textHighlighter.js"></script>
 <script src="renderer.js"></script>
 </body>
 </html>
diff --git a/src/scripts/contentCapture/oembedExtractor.ts b/src/scripts/contentCapture/oembedExtractor.ts
new file mode 100644
index 00000000..c9c3e8e5
--- /dev/null
+++ b/src/scripts/contentCapture/oembedExtractor.ts
@@ -0,0 +1,122 @@
+// oEmbed-based extraction for rich-media pages. Caller falls back to Readability on null.
+
+interface OEmbedProvider {
+	name: string;
+	endpoint: string;
+	hostPattern: string;
+}
+
+export interface OEmbedData {
+	type: string;                 // "video" | "photo" | "link" | "rich"
+	html?: string;                // present for video / rich
+	url?: string;                 // present for photo
+	width?: number;
+	height?: number;
+	title?: string;
+	author_name?: string;
+	thumbnail_url?: string;
+	provider_name?: string;
+	pageUrl: string;              // echo of the page URL we matched against
+}
+
+// V1 parity: YouTube + Vimeo. (Khan Academy V1 entry scraped embedded YouTube iframes,
+// which our YouTube provider already handles.)
+const PROVIDERS: OEmbedProvider[] = [
+	{ name: "YouTube", endpoint: "https://www.youtube.com/oembed", hostPattern: "youtube.com" },
+	{ name: "YouTube", endpoint: "https://www.youtube.com/oembed", hostPattern: "youtu.be" },
+	{ name: "Vimeo", endpoint: "https://vimeo.com/api/oembed.json", hostPattern: "vimeo.com" },
+];
+
+function matchProvider(url: string): OEmbedProvider | null {
+	let parsed: URL;
+	try {
+		parsed = new URL(url);
+	} catch (e) {
+		return null;
+	}
+	const host = parsed.hostname.toLowerCase();
+	const hostAndPath = (host + parsed.pathname).toLowerCase();
+
+	for (const provider of PROVIDERS) {
+		const pattern = provider.hostPattern.toLowerCase();
+
+		if (pattern.indexOf("/") !== -1) {
+			if (hostAndPath === pattern
+				|| hostAndPath.indexOf(pattern) === 0
+				|| hostAndPath.indexOf("." + pattern) !== -1) {
+				return provider;
+			}
+		} else if (pattern.charAt(pattern.length - 1) === ".") {
+			if (host.indexOf(pattern) === 0) {
+				return provider;
+			}
+		} else {
+			if (host === pattern || host.indexOf("." + pattern) === host.length - pattern.length - 1) {
+				return provider;
+			}
+		}
+	}
+	return null;
+}
+
+// Strip executable surfaces from provider HTML; preserve iframes/anchors/images.
+export function sanitizeProviderHtml(html: string): string {
+	const doc = new DOMParser().parseFromString(html, "text/html");
+
+	const removable = doc.querySelectorAll("script, object, embed, link, style, meta");
+	for (let i = removable.length - 1; i >= 0; i--) {
+		const el = removable[i];
+		if (el.parentNode) { el.parentNode.removeChild(el); }
+	}
+
+	const all = doc.querySelectorAll("*");
+	for (let i = 0; i < all.length; i++) {
+		const el = all[i] as HTMLElement;
+		const attrs = el.attributes;
+		for (let j = attrs.length - 1; j >= 0; j--) {
+			const name = attrs[j].name.toLowerCase();
+			const value = attrs[j].value;
+			if (name.indexOf("on") === 0) {
+				el.removeAttribute(attrs[j].name);
+			} else if ((name === "href" || name === "src") && /^\s*javascript:/i.test(value)) {
+				el.removeAttribute(attrs[j].name);
+			}
+		}
+	}
+
+	return doc.body ? doc.body.innerHTML : "";
+}
+
+// Sync hostname check (no fetch).
+export function isOEmbedProviderUrl(pageUrl: string): boolean {
+	return matchProvider(pageUrl) !== null;
+}
+
+// Returns oEmbed payload, or null on no-match / fetch failure.
+export async function tryOEmbed(pageUrl: string): Promise<OEmbedData | null> {
+	if (!pageUrl) { return null; }
+
+	const provider = matchProvider(pageUrl);
+	if (!provider) { return null; }
+
+	const endpoint = provider.endpoint
+		+ "?url=" + encodeURIComponent(pageUrl)
+		+ "&format=json&maxwidth=600";
+
+	try {
+		const resp = await fetch(endpoint);
+		if (!resp.ok) { return null; }
+		const data = await resp.json() as Partial<OEmbedData>;
+		// "link" type carries metadata only; let Readability handle it.
+		if (data.type !== "video" && data.type !== "rich" && data.type !== "photo") {
+			return null;
+		}
+		if (!data.provider_name) {
+			data.provider_name = provider.name;
+		}
+		data.pageUrl = pageUrl;
+		return data as OEmbedData;
+	} catch (e) {
+		return null;
+	}
+}
diff --git a/src/scripts/extensions/chrome/manifest.json b/src/scripts/extensions/chrome/manifest.json
index 90bd4652..7bd76109 100644
--- a/src/scripts/extensions/chrome/manifest.json
+++ b/src/scripts/extensions/chrome/manifest.json
@@ -30,8 +30,7 @@
       "tabs",
       "webRequest",
       "webNavigation",
-      "offscreen",
-      "storage"
+      "offscreen"
     ],
     "host_permissions": [
       "<all_urls>"
diff --git a/src/scripts/extensions/contentCaptureInject.ts b/src/scripts/extensions/contentCaptureInject.ts
index 1b7d9de6..7f13e775 100644
--- a/src/scripts/extensions/contentCaptureInject.ts
+++ b/src/scripts/extensions/contentCaptureInject.ts
@@ -272,12 +272,50 @@
 	let contentType = detectContentType();
 	let html = resolveLazyImages(getDomString(doc));
 
+	// Selection through the same DOM-cleanup pipeline; materialize URLs first so they survive base-tag strip.
+	function captureSelectionHtml(): string {
+		try {
+			let sel = window.getSelection();
+			if (!sel || sel.rangeCount === 0) { return ""; }
+			let range = sel.getRangeAt(0);
+			if (range.collapsed) { return ""; }
+
+			let selDoc = cloneDocument(document);
+			if (!selDoc.body) { return ""; }
+			while (selDoc.body.firstChild) { selDoc.body.removeChild(selDoc.body.firstChild); }
+			selDoc.body.appendChild(selDoc.importNode(range.cloneContents(), true));
+
+			addBaseTagIfNecessary(selDoc, document.location);
+			addImageSizeInformationToDom(selDoc);
+			removeUnwantedItems(selDoc);
+
+			// Only img.src + a.href need materializing; other URL-bearing tags are stripped downstream.
+			let materialize = (selector: string, prop: string, attr: string) => {
+				let els = selDoc.querySelectorAll(selector);
+				for (let i = 0; i < els.length; i++) {
+					let el = els[i] as HTMLElement;
+					let resolved = (el as any)[prop];
+					if (resolved && typeof resolved === "string") { el.setAttribute(attr, resolved); }
+				}
+			};
+			materialize("img[src]", "src", "src");
+			materialize("a[href]", "href", "href");
+
+			return selDoc.body.innerHTML;
+		} catch (e) {
+			return "";
+		}
+	}
+	// Resolve lazy images on the selection branch too, else lazy-loaded <img> lands with no src.
+	let selectionHtml = resolveLazyImages(captureSelectionHtml());
+
 	chrome.runtime.sendMessage(JSON.stringify({
 		action: "contentCaptureComplete",
 		html: html,
 		baseUrl: document.baseURI || document.URL,
 		title: document.title || "",
 		url: document.URL || "",
-		contentType: contentType
+		contentType: contentType,
+		selectionHtml: selectionHtml
 	}));
 })();
diff --git a/src/scripts/extensions/edge/manifest.json b/src/scripts/extensions/edge/manifest.json
index 3314e28c..a675c2ca 100644
--- a/src/scripts/extensions/edge/manifest.json
+++ b/src/scripts/extensions/edge/manifest.json
@@ -21,12 +21,10 @@
         "activeTab",
         "scripting",
         "contextMenus",
-        "cookies",
         "tabs",
         "webRequest",
         "webNavigation",
-        "offscreen",
-        "storage"
+        "offscreen"
     ],
 
     "host_permissions": [
diff --git a/src/scripts/extensions/webExtensionBase/webExtension.ts b/src/scripts/extensions/webExtensionBase/webExtension.ts
index 902fcbe2..1373d3cc 100644
--- a/src/scripts/extensions/webExtensionBase/webExtension.ts
+++ b/src/scripts/extensions/webExtensionBase/webExtension.ts
@@ -42,6 +42,8 @@ export class WebExtension extends ExtensionBase<WebExtensionWorker, W3CTab, numb
 
 		this.registerBrowserButton();
 
+		// Listener registers synchronously at SW startup; menu items themselves need locStrings.
+		this.registerContextMenuClickListener();
 		this.clipperIdProcessed.then(() => {
 			this.registerContextMenuItems();
 		});
@@ -184,43 +186,52 @@ export class WebExtension extends ExtensionBase<WebExtensionWorker, W3CTab, numb
 						menus[i].documentUrlPatterns = documentUrlPatternList;
 					}
 					WebExtension.browser.contextMenus.create(menus[i]);
-					WebExtension.browser.contextMenus.onClicked.addListener((info, tab: W3CTab) => {
-						switch (info.menuItemId) {
-							case "WebClipper.Label.OneNoteWebClipper":
-								this.invokeClipperInTab(tab, { invokeSource: InvokeSource.ContextMenu }, { invokeMode: InvokeMode.Default });
-								break;
-							case "WebClipper.Label.ClipSelectionToOneNote":
-								let invokeOptions: InvokeOptions = { invokeMode: InvokeMode.ContextTextSelection };
-
-								// If the tab index is negative, chances are the user is using some sort of PDF plugin,
-								// and the tab object will be invalid. We need to get the parent tab in this scenario.
-								if (tab.index < 0) {
-									// Since we are in a PDF plugin, Rangy won't work, so we rely on WebExtension API to grab pure text
-									invokeOptions.invokeDataForMode = info.selectionText;
-									WebExtension.browser.tabs.query({ active: true, currentWindow: true }, (tabs: W3CTab[]) => {
-										// There will only be one tab that meets this criteria
-										let parentTab = tabs[0];
-										this.invokeClipperInTab(parentTab, { invokeSource: InvokeSource.ContextMenu }, invokeOptions);
-									});
-								} else {
-									this.invokeClipperInTab(tab, { invokeSource: InvokeSource.ContextMenu }, invokeOptions);
-								}
-								break;
-							case "WebClipper.Label.ClipImageToOneNote":
-								// Even though we know the user right-clicked an image, srcUrl is only present if the src attr exists
-								this.invokeClipperInTab(tab, { invokeSource: InvokeSource.ContextMenu }, info.srcUrl ? {
-									// srcUrl will always be the full url, not relative
-									invokeDataForMode: info.srcUrl, invokeMode: InvokeMode.ContextImage
-								} : undefined);
-								break;
-							default:
-						}
-					});
 				}
 			});
 		});
 	}
 
+	// Synchronous part of context-menu setup — dispatches on info.menuItemId only,
+	// no locStrings dependency. See constructor for why this is split out.
+	private registerContextMenuClickListener() {
+		WebExtension.browser.contextMenus.onClicked.addListener((info, tab?: Tab) => {
+			if (!tab) {
+				return;
+			}
+			let clickedTab = tab as W3CTab;
+			switch (info.menuItemId) {
+				case "WebClipper.Label.OneNoteWebClipper":
+					this.invokeClipperInTab(clickedTab, { invokeSource: InvokeSource.ContextMenu }, { invokeMode: InvokeMode.Default });
+					break;
+				case "WebClipper.Label.ClipSelectionToOneNote":
+					let invokeOptions: InvokeOptions = { invokeMode: InvokeMode.ContextTextSelection };
+
+					// If the tab index is negative, chances are the user is using some sort of PDF plugin,
+					// and the tab object will be invalid. We need to get the parent tab in this scenario.
+					if (clickedTab.index < 0) {
+						// Since we are in a PDF plugin, Rangy won't work, so we rely on WebExtension API to grab pure text
+						invokeOptions.invokeDataForMode = info.selectionText;
+						WebExtension.browser.tabs.query({ active: true, currentWindow: true }, (tabs: Tab[]) => {
+							// There will only be one tab that meets this criteria
+							let parentTab = tabs[0] as W3CTab;
+							this.invokeClipperInTab(parentTab, { invokeSource: InvokeSource.ContextMenu }, invokeOptions);
+						});
+					} else {
+						this.invokeClipperInTab(clickedTab, { invokeSource: InvokeSource.ContextMenu }, invokeOptions);
+					}
+					break;
+				case "WebClipper.Label.ClipImageToOneNote":
+					// Even though we know the user right-clicked an image, srcUrl is only present if the src attr exists
+					this.invokeClipperInTab(clickedTab, { invokeSource: InvokeSource.ContextMenu }, info.srcUrl ? {
+						// srcUrl will always be the full url, not relative
+						invokeDataForMode: info.srcUrl, invokeMode: InvokeMode.ContextImage
+					} : { invokeMode: InvokeMode.Default });
+					break;
+				default:
+			}
+		});
+	}
+
 	private registerInstallListener() {
 		// onInstalled is undefined as of Firefox 48
 		if (this.onInstalledSupported()) {
diff --git a/src/scripts/extensions/webExtensionBase/webExtensionWorker.ts b/src/scripts/extensions/webExtensionBase/webExtensionWorker.ts
index ef11141f..19da1adf 100644
--- a/src/scripts/extensions/webExtensionBase/webExtensionWorker.ts
+++ b/src/scripts/extensions/webExtensionBase/webExtensionWorker.ts
@@ -21,7 +21,7 @@ import {ExtensionWorkerBase} from "../extensionWorkerBase";
 import {InjectHelper} from "../injectHelper";
 
 import {InvokeInfo} from "../invokeInfo";
-import {InvokeOptions} from "../invokeOptions";
+import {InvokeMode, InvokeOptions} from "../invokeOptions";
 import {InjectUrls} from "./injectUrls";
 import {WebExtension} from "./webExtension";
 import {WebExtensionBackgroundMessageHandler} from "./webExtensionMessageHandler";
@@ -46,6 +46,10 @@ export class WebExtensionWorker extends ExtensionWorkerBase<W3CTab, number> {
 	private noOpTrackerInvoked: boolean;
 	private activeRendererCleanup: () => void;
 	private activeRendererWindowId: number;
+	// Original InvokeOptions, set by closeAllFramesAndInvokeClipper and forwarded
+	// to the renderer via loadContent so it can auto-engage the right mode.
+	private pendingInvokeMode: string;
+	private pendingInvokeData: string;
 
 	constructor(injectUrls: InjectUrls, tab: W3CTab, clientInfo: SmartValue<ClientInfo>, auth: AuthenticationHelper) {
 		let messageHandlerThunk = () => { return new WebExtensionBackgroundMessageHandler(tab.id); };
@@ -55,6 +59,8 @@ export class WebExtensionWorker extends ExtensionWorkerBase<W3CTab, number> {
 		this.tab = tab;
 		this.tabId = tab.id;
 		this.noOpTrackerInvoked = false;
+		this.pendingInvokeMode = "";
+		this.pendingInvokeData = "";
 
 		this.activeRendererCleanup = () => { /* no-op */ };
 		this.activeRendererWindowId = 0;
@@ -119,6 +125,12 @@ export class WebExtensionWorker extends ExtensionWorkerBase<W3CTab, number> {
 			this.logClipperInvoke(invokeInfo, options);
 		});
 
+		// Capture invocation intent for the contentCapture listener to forward.
+		this.pendingInvokeMode = (options && options.invokeMode !== undefined)
+			? InvokeMode[options.invokeMode]
+			: "";
+		this.pendingInvokeData = (options && options.invokeDataForMode) ? options.invokeDataForMode : "";
+
 		if (this.activeRendererWindowId) {
 			WebExtension.browser.windows.update(this.activeRendererWindowId, { focused: true }, () => {
 				if (WebExtension.browser.runtime.lastError) {
@@ -355,7 +367,10 @@ export class WebExtensionWorker extends ExtensionWorkerBase<W3CTab, number> {
 				title: msg.title || "",
 				url: msg.url || "",
 				statusText: "Capturing page...",
-				contentType: msg.contentType || "html"
+				contentType: msg.contentType || "html",
+				selectionHtml: msg.selectionHtml || "",
+				invokeMode: this.pendingInvokeMode || "",
+				invokeData: this.pendingInvokeData || ""
 			};
 			contentCaptured = true;
 			if (activePort) {
@@ -437,10 +452,10 @@ export class WebExtensionWorker extends ExtensionWorkerBase<W3CTab, number> {
 			contentWidth = renderWidth - sidebarWidth;
 		}
 
-		// Height: cap at 900px so the popup doesn't fill near-full-height on
+		// Height: cap at 980px so the popup doesn't fill near-full-height on
 		// 1080p+ monitors. Floor at 600 so capture progress UI fits comfortably.
 		// On smaller browsers we still shrink to fit (browserHeight - margin).
-		let renderHeight = Math.max(Math.min(browserHeight - screenMargin, 900), 600);
+		let renderHeight = Math.max(Math.min(browserHeight - screenMargin, 980), 600);
 
 		// Position: align with browser window's top-left
 		let renderLeft = browserLeft;
@@ -518,6 +533,16 @@ export class WebExtensionWorker extends ExtensionWorkerBase<W3CTab, number> {
 					}
 				}
 
+				// V1 parity: refresh user state on renderer open (legacy getInitialUser).
+				// updateUserInfoData is cache-aware — no network call if cached token
+				// is fresh. Renderer reads localStorage on userRefreshed.
+				if (message.action === "refreshUser") {
+					let notify = () => {
+						try { port.postMessage({ action: "userRefreshed" }); } catch (e) { /* port may be dead */ }
+					};
+					this.auth.updateUserInfoData(this.clientInfo.get().clipperId, UpdateReason.InitialRetrieval).then(notify, notify);
+				}
+
 				// --- Sign-in from renderer (self-contained sign-in) ---
 				if (message.action === "signIn") {
 					let authType: AuthType = (AuthType as any)[message.authType];
@@ -679,6 +704,7 @@ export class WebExtensionWorker extends ExtensionWorkerBase<W3CTab, number> {
 					let saveAnnotation = msg.annotation || "";
 					let saveSectionId = msg.sectionId || "";
 					let saveUrl = msg.url || "";
+					let savePageMetadata: { [key: string]: string } | undefined = msg.pageMetadata;
 
 					// Ensure fresh token before save (matches old clipper.tsx ensureFreshUserBeforeClip)
 					workerSelf.auth.updateUserInfoData(workerSelf.clientInfo.get().clipperId, UpdateReason.TokenRefreshForPendingClip).then(() => {
@@ -697,7 +723,7 @@ export class WebExtensionWorker extends ExtensionWorkerBase<W3CTab, number> {
 								return;
 							}
 
-							// Build OneNote page content based on mode
+							// Output shape mirrors V1 OneNotePage.getEntireOnml.
 							let buildPage = (bodyOnml: string, imageParts: { name: string; blob: Blob; type: string }[]) => {
 								let boundary = "OneNoteRendererBoundary" + Date.now();
 								let now = new Date();
@@ -710,9 +736,21 @@ export class WebExtensionWorker extends ExtensionWorkerBase<W3CTab, number> {
 								if (parseInt(offsetMins, 10) < 10) { offsetMins = "0" + offsetMins; }
 								let createdTime = offsetSign + offsetHours + ":" + offsetMins;
 								let fontStyle = "font-size: 16px; font-family: Verdana;";
-								let presentationHtml = "<!DOCTYPE html><html><head>"
-									+ "<title>" + saveTitle.replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</title>"
+								let locale = (typeof chrome !== "undefined" && chrome.i18n && chrome.i18n.getUILanguage) ? chrome.i18n.getUILanguage() : "en";
+								let metaTags = "";
+								if (savePageMetadata) {
+									for (let key in savePageMetadata) {
+										if (Object.prototype.hasOwnProperty.call(savePageMetadata, key)) {
+											metaTags += "<meta name=\"" + escapeAttr(key)
+												+ "\" content=\"" + escapeAttr(savePageMetadata[key]) + "\" />";
+										}
+									}
+								}
+								let presentationHtml = "<html xmlns=\"http://www.w3.org/1999/xhtml\" lang=" + locale + ">"
+									+ "<head>"
+									+ "<title>" + escapeHtml(saveTitle) + "</title>"
 									+ "<meta name=\"created\" content=\"" + createdTime + " \">"
+									+ metaTags
 									+ "</head><body>";
 								if (saveAnnotation) {
 									let escaped = saveAnnotation.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
@@ -816,7 +854,8 @@ export class WebExtensionWorker extends ExtensionWorkerBase<W3CTab, number> {
 									).join("&nbsp;");
 									buildPage(bodyOnml, imageParts);
 								});
-							} else if (saveMode === "article") {
+							} else if (saveMode === "article" || saveMode === "selection") {
+								// Selection shares the article save path; renderer composes the body.
 								let articleHtml = msg.contentHtml || "";
 								buildPage(articleHtml, []);
 							} else if (saveMode === "bookmark") {
@@ -861,8 +900,10 @@ export class WebExtensionWorker extends ExtensionWorkerBase<W3CTab, number> {
 											if (parseInt(oM, 10) < 10) { oM = "0" + oM; }
 											let ct = offsetSign2 + oH + ":" + oM;
 											let fStyle = "font-size: 16px; font-family: Verdana;";
-											let distHtml = "<!DOCTYPE html><html><head>"
-												+ "<title>" + pageTitle.replace(/</g, "&lt;").replace(/>/g, "&gt;") + "</title>"
+											let distLocale = (typeof chrome !== "undefined" && chrome.i18n && chrome.i18n.getUILanguage) ? chrome.i18n.getUILanguage() : "en";
+											let distHtml = "<html xmlns=\"http://www.w3.org/1999/xhtml\" lang=" + distLocale + ">"
+												+ "<head>"
+												+ "<title>" + escapeHtml(pageTitle) + "</title>"
 												+ "<meta name=\"created\" content=\"" + ct + " \">"
 												+ "</head><body>";
 											if (pageIdx === 0 && saveAnnotation) {
diff --git a/src/scripts/highlighting/textHighlighter.js b/src/scripts/highlighting/textHighlighter.js
index e3b8e393..a388a376 100644
--- a/src/scripts/highlighting/textHighlighter.js
+++ b/src/scripts/highlighting/textHighlighter.js
@@ -504,21 +504,24 @@ THE SOFTWARE.
     };
 
     TextHighlighter.prototype.bindEvents = function (el) {
+        // Use el's own window so events fire when the host is a same-origin iframe.
+        var win = el.ownerDocument.defaultView;
         el.addEventListener('keydown', this.boundStartDragHandler);
         el.addEventListener('mousedown', this.boundStartDragHandler);
         el.addEventListener('touchstart', this.boundStartDragHandler);
-        window.addEventListener('keyup', this.boundHighlightHandler);
-        window.addEventListener('mouseup', this.boundHighlightHandler);
-        window.addEventListener('touchend', this.boundHighlightHandler);
+        win.addEventListener('keyup', this.boundHighlightHandler);
+        win.addEventListener('mouseup', this.boundHighlightHandler);
+        win.addEventListener('touchend', this.boundHighlightHandler);
     }
 
     TextHighlighter.prototype.unbindEvents = function (el) {
+        var win = el.ownerDocument.defaultView;
         el.removeEventListener('keydown', this.boundStartDragHandler);
         el.removeEventListener('mousedown', this.boundStartDragHandler);
         el.removeEventListener('touchstart', this.boundStartDragHandler);
-        window.removeEventListener('keyup', this.boundHighlightHandler);
-        window.removeEventListener('mouseup', this.boundHighlightHandler);
-        window.removeEventListener('touchend', this.boundHighlightHandler);
+        win.removeEventListener('keyup', this.boundHighlightHandler);
+        win.removeEventListener('mouseup', this.boundHighlightHandler);
+        win.removeEventListener('touchend', this.boundHighlightHandler);
     }
 
     /**
diff --git a/src/scripts/renderer.ts b/src/scripts/renderer.ts
index 0c932142..015179bf 100644
--- a/src/scripts/renderer.ts
+++ b/src/scripts/renderer.ts
@@ -7,6 +7,8 @@ import {PropertyName} from "./logging/submodules/propertyName";
 import {Session} from "./logging/submodules/session";
 import {Status} from "./logging/submodules/status";
 
+import {tryOEmbed, sanitizeProviderHtml, isOEmbedProviderUrl, OEmbedData} from "./contentCapture/oembedExtractor";
+
 // Renderer page script - connects to service worker via port
 // and handles scroll/capture commands. Content HTML arrives inline
 // on the loadContent port message; images sent to worker via chunked
@@ -132,9 +134,21 @@ let signoutLink = document.getElementById("signout-link") as HTMLAnchorElement;
 let currentMode = "fullpage";
 let fullPageComplete = false;
 let fullPageDataUrl = ""; // Cached full-page screenshot data URL for mode switching
+let captureInProgress = false;
+let captureDimensions: { viewportHeight: number; pageHeight: number; contentHeight: number } | null = null;
+let modeBeforeRegion = "";
 let saveDone = false;
 let articleLoaded = false;
-let cachedArticleHtml = ""; // Readability result, extracted lazily from content-frame DOM
+let cachedArticleHtml = ""; // Article preview HTML (Readability or oEmbed-preview shape)
+let cachedOEmbedData: OEmbedData | null = null; // Raw oEmbed payload; if present, save path builds iframe-based HTML from this instead of cachedArticleHtml
+let cachedOEmbedDescription = ""; // og:description (or fallback chain) from page DOM; oEmbed responses typically don't carry the full description
+let cachedPageMetadata: { [key: string]: string } | null = null; // PageMetadata sent in save msg; worker emits each entry as a <meta> tag (matches V1 OneNotePage)
+let cachedSelectionHtml = "";
+let invokedFromContextSelection = false;
+let contextImageSrcUrl = "";
+let invokedFromContextImage = false;
+// True for toolbar invocations on known oEmbed providers; context-menu invokes take precedence.
+let siteSuggestsArticleMode = false;
 let cachedBookmarkHtml = ""; // Bookmark card HTML, extracted lazily from content-frame DOM
 let bookmarkLoaded = false;
 let contentDocReady = false; // true once content-frame has loaded HTML
@@ -174,7 +188,8 @@ let articleSerif = false;
 let articleFontSize = 16;
 let highlighterEnabled = false;
 let textHighlighterInstance: any = undefined;
-let articleWorkingHtml = ""; // Preserves highlights/edits across mode switches
+let articleWorkingHtml = ""; // Preserves article highlights/edits across mode switches
+let selectionWorkingHtml = ""; // Same, for selection mode (V1 parity via EditorPreviewComponentBase)
 let saveTimeoutId: any = 0; // Client-side save timeout (service worker setTimeout unreliable)
 
 // --- Localization ---
@@ -231,6 +246,7 @@ let strings = {
 	modeArticle: loc("WebClipper.ClipType.Article.Button", "Article"),
 	modeBookmark: loc("WebClipper.ClipType.Bookmark.Button", "Bookmark"),
 	modeRegion: loc("WebClipper.ClipType.Region.Button", "Region"),
+	modeSelection: loc("WebClipper.ClipType.Selection.Button", "Selection"),
 	titlePlaceholder: loc("WebClipper.Label.PageTitlePlaceholder", "Add a page title..."),
 	notePlaceholder: loc("WebClipper.Label.AnnotationPlaceholder", "Add a note..."),
 	sourceLabel: loc("WebClipper.Label.Source", "Source"),
@@ -340,7 +356,7 @@ port.onMessage.addListener((msg: any) => {
 // Apply localized strings to UI elements
 sidebarTitle.textContent = strings.clipperTitle;
 cancelBtn.textContent = strings.cancel;
-let modeMap: any = { fullpage: strings.modeFullPage, article: strings.modeArticle, bookmark: strings.modeBookmark, region: strings.modeRegion };
+let modeMap: any = { fullpage: strings.modeFullPage, article: strings.modeArticle, bookmark: strings.modeBookmark, region: strings.modeRegion, selection: strings.modeSelection };
 document.querySelectorAll(".mode-btn").forEach((btn) => {
 	let mode = btn.getAttribute("data-mode");
 	if (mode && modeMap[mode]) {
@@ -355,7 +371,8 @@ let tooltipMap: any = {
 	fullpage: loc("WebClipper.ClipType.ScreenShot.Button.Tooltip", "Take a screenshot of the whole page, just like you see it."),
 	article: loc("WebClipper.ClipType.Button.Tooltip", "Clip just the {0} in an easy-to-read format.").replace("{0}", strings.modeArticle.toLowerCase()),
 	bookmark: loc("WebClipper.ClipType.Bookmark.Button.Tooltip", "Clip just the title, thumbnail, synopsis, and link."),
-	region: loc("WebClipper.ClipType.Region.Button.Tooltip", "Take a screenshot of the part of the page you'll select.")
+	region: loc("WebClipper.ClipType.Region.Button.Tooltip", "Take a screenshot of the part of the page you'll select."),
+	selection: loc("WebClipper.ClipType.Selection.Button.Tooltip", "Clip just the text you selected.")
 };
 document.querySelectorAll(".mode-btn").forEach((btn) => {
 	let mode = btn.getAttribute("data-mode");
@@ -880,8 +897,6 @@ async function fetchFreshNotebooks() {
 		logTelemetryEvent(getNotebooksEvent);
 	}
 }
-fetchFreshNotebooks();
-
 // Lock all interactive controls during initial capture — prevents race conditions
 // (e.g., clicking sign-out mid-capture corrupts state)
 document.querySelectorAll(".mode-btn").forEach((btn) => {
@@ -930,9 +945,7 @@ function lockSidebar() {
 
 function unlockSidebar() {
 	document.querySelectorAll(".mode-btn").forEach((b) => {
-		if (fullPageComplete || b.getAttribute("data-mode") === "fullpage") {
-			(b as HTMLButtonElement).disabled = false;
-		}
+		(b as HTMLButtonElement).disabled = false;
 	});
 	titleField.disabled = false;
 	noteField.disabled = false;
@@ -963,16 +976,19 @@ function resetSaveState() {
 	if (errBanner) { errBanner.style.display = "none"; }
 }
 
-// Save article working state (highlights, edits) before switching away
-function saveArticleWorkingState() {
+// Persist preview-frame body so highlights survive mode switches (V1 parity).
+function saveWorkingState() {
+	let pDoc = previewFrame.contentDocument;
+	if (!pDoc || !pDoc.body) { return; }
 	if (currentMode === "article") {
-		let pDoc = previewFrame.contentDocument;
-		if (pDoc && pDoc.body) { articleWorkingHtml = pDoc.body.innerHTML; }
+		articleWorkingHtml = pDoc.body.innerHTML;
+	} else if (currentMode === "selection") {
+		selectionWorkingHtml = pDoc.body.innerHTML;
 	}
 }
 
 function switchToFullPage() {
-	saveArticleWorkingState();
+	saveWorkingState();
 	resetSaveState();
 	currentMode = "fullpage";
 	previewFrameWrap.style.display = "none";
@@ -990,14 +1006,30 @@ function switchToFullPage() {
 		capturePanel.style.display = "none";
 	} else {
 		iframe.style.display = "block";
+		// Restore visibility (skip-capture flows hide via visibility:hidden).
+		iframe.style.visibility = "";
 		previewContainer.style.display = "none";
 		capturePanel.style.display = "flex";
 		statusText.textContent = strings.capturing;
 		saveBtn.disabled = true;
+		if (captureDimensions && !captureInProgress) {
+			document.querySelectorAll(".mode-btn").forEach((b: Element) => {
+				if (b.getAttribute("data-mode") !== "fullpage") {
+					(b as HTMLButtonElement).disabled = true;
+					b.classList.add("disabled");
+				}
+			});
+			disableSignout();
+			announceToScreenReader(strings.capturing);
+			let progressTrack = document.getElementById("progress-bar-track") as HTMLElement;
+			if (progressTrack) { progressTrack.style.display = "none"; }
+			kickoffFullPageCapture();
+		}
 	}
 }
 
 function switchToArticle() {
+	saveWorkingState(); // capture outgoing mode's preview-frame body (e.g. selection -> article preserves selection's highlights)
 	resetSaveState();
 	currentMode = "article";
 	// Hide full-page content and preview
@@ -1018,6 +1050,22 @@ function switchToArticle() {
 	}
 }
 
+// Article-mode UI sourced from the user's DOM selection (V1 parity).
+function switchToSelection() {
+	saveWorkingState(); // capture outgoing mode's preview-frame body
+	resetSaveState();
+	currentMode = "selection";
+	iframe.style.display = "none";
+	previewContainer.style.display = "none";
+	capturePanel.style.display = "none";
+	previewFrameWrap.style.display = "flex";
+	articleHeader.style.display = "flex";
+
+	renderArticleHtml(selectionWorkingHtml || cachedSelectionHtml);
+	saveBtn.disabled = false;
+	saveBtn.textContent = strings.saveToOneNote;
+}
+
 function loadArticleContent() {
 	if (cachedArticleHtml) {
 		// Already extracted — render immediately
@@ -1053,6 +1101,167 @@ function loadArticleContent() {
 }
 
 function extractArticle() {
+	// Prefer oEmbed payload for known providers (Readability strips iframes); fall back to Readability.
+	let pageUrl = sourceUrlText.textContent || "";
+	tryOEmbed(pageUrl).then(function(data) {
+		if (data) {
+			cachedOEmbedData = data;
+			let iframeDoc = iframe.contentDocument;
+			// Meta-tag fallback if Readability returns empty (same chain as bookmark mode).
+			let metaDesc = "";
+			if (iframeDoc) {
+				metaDesc = getMetaContent(iframeDoc, "og:description", "property")
+					|| getMetaContent(iframeDoc, "description", "name")
+					|| getMetaContent(iframeDoc, "twitter:description", "name")
+					|| "";
+			}
+			let finalize = function(description: string, publishedTime: string) {
+				cachedOEmbedDescription = description;
+				cachedArticleHtml = composeOEmbedForPreview(data, description);
+				cachedPageMetadata = buildPageMetadataForOEmbed(data, description, publishedTime);
+				renderArticleHtml(cachedArticleHtml);
+				articleLoaded = true;
+				if (currentMode === "article") {
+					saveBtn.disabled = false;
+					saveBtn.textContent = strings.saveToOneNote;
+				}
+			};
+			// Readability runs alongside oEmbed to recover excerpt + publishedTime (V1 parity).
+			if (iframeDoc) {
+				let docClone = iframeDoc.cloneNode(true) as Document;
+				(import("@mozilla/readability") as any).then(function(mod: any) {
+					try {
+						let reader = new mod.Readability(docClone, { charThreshold: 100 });
+						let article = reader.parse();
+						let desc = (article && article.excerpt) || metaDesc;
+						let pubTime = (article && article.publishedTime) || "";
+						finalize(desc, pubTime);
+					} catch (e) {
+						finalize(metaDesc, "");
+					}
+				})["catch"](function() { finalize(metaDesc, ""); });
+			} else {
+				finalize(metaDesc, "");
+			}
+			return;
+		}
+		extractArticleViaReadability();
+	});
+}
+
+// Preview shows a static thumbnail; provider iframe is sandboxed off here
+// and flows through composeOEmbedForSave for the saved page.
+function composeOEmbedForPreview(data: OEmbedData, pageDescription: string): string {
+	let html = "<div style=\"margin-bottom:16px;\">";
+	if (data.thumbnail_url) {
+		// Lock framed types to the save-side 16:9 frame so the preview matches.
+		let isFramed = data.type === "video" || data.type === "rich";
+		let containerStyle = isFramed
+			? "position:relative; display:block; width:100%; max-width:600px; aspect-ratio:600/338; background:#000;"
+			: "position:relative; display:inline-block; max-width:100%;";
+		let imgStyle = isFramed
+			? "display:block; width:100%; height:100%; object-fit:cover;"
+			: "display:block; max-width:600px; width:100%; height:auto;";
+		html += "<div style=\"" + containerStyle + "\">";
+		html += "<img src=\"" + escapeAttr(data.thumbnail_url) + "\""
+			+ " style=\"" + imgStyle + "\""
+			+ " alt=\"" + escapeAttr(data.title || "") + "\" />";
+		if (data.type === "video") {
+			// Play-glyph overlay -- pure CSS, no text, so no i18n surface
+			html += "<div style=\""
+				+ "position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);"
+				+ "width:72px; height:72px; border-radius:50%;"
+				+ "background:rgba(0,0,0,0.65); pointer-events:none;"
+				+ "display:flex; align-items:center; justify-content:center;"
+				+ "color:white; font-size:32px; line-height:1; padding-left:6px;"
+				+ "\">&#9654;</div>";
+		}
+		html += "</div>";
+	}
+	if (data.title) {
+		html += "<h3 style=\"margin:12px 0 4px;\">" + escapeHtml(data.title) + "</h3>";
+	}
+	let metaLine: string[] = [];
+	if (data.author_name) { metaLine.push(escapeHtml(data.author_name)); }
+	if (data.provider_name) { metaLine.push(escapeHtml(data.provider_name)); }
+	if (metaLine.length) {
+		html += "<div style=\"color:#666; font-size:14px;\">" + metaLine.join(" · ") + "</div>";
+	}
+	if (pageDescription) {
+		html += "<div style=\"margin-top:12px; color:#333; font-size:14px; line-height:1.5;\">"
+			+ escapeHtml(pageDescription) + "</div>";
+	}
+	html += "</div>";
+	return html;
+}
+
+function composeOEmbedForSave(data: OEmbedData, pageDescription: string): string {
+	let body = "";
+	if (data.type === "photo" && data.url) {
+		body = "<img src=\"" + escapeAttr(data.url) + "\""
+			+ (data.width ? " width=\"" + data.width + "\"" : "")
+			+ (data.height ? " height=\"" + data.height + "\"" : "")
+			+ " data-original-src=\"" + escapeAttr(data.pageUrl) + "\" />";
+	} else if (data.html) {
+		body = normalizeProviderIframe(sanitizeProviderHtml(data.html), data.pageUrl);
+	} else {
+		return "";
+	}
+	let caption = "";
+	if (data.title) { caption += "<h3>" + escapeHtml(data.title) + "</h3>"; }
+	if (data.author_name) { caption += "<div>" + escapeHtml(data.author_name) + "</div>"; }
+	if (pageDescription) { caption += "<div>" + escapeHtml(pageDescription) + "</div>"; }
+	return "<div style=\"margin-bottom: 16px\">"
+		+ body
+		+ (caption ? "<br>" + caption : "")
+		+ "</div>";
+}
+
+function normalizeProviderIframe(html: string, pageUrl: string): string {
+	let parsed = new DOMParser().parseFromString(html, "text/html");
+	let iframes = parsed.getElementsByTagName("iframe");
+	for (let i = 0; i < iframes.length; i++) {
+		// data-original-src marks the iframe for OneNote's renderer; 600x338 matches V1.
+		iframes[i].setAttribute("data-original-src", pageUrl);
+		iframes[i].setAttribute("width", "600");
+		iframes[i].setAttribute("height", "338");
+	}
+	return parsed.body ? parsed.body.innerHTML : html;
+}
+
+// V1 parity: AutoPageTags* + descriptive fields. Worker emits one <meta> per entry.
+function buildPageMetadataForOEmbed(
+	data: OEmbedData,
+	pageDescription: string,
+	publishedTime?: string
+): { [key: string]: string } {
+	let meta: { [key: string]: string } = {
+		AutoPageTagsCodes: "Article",
+		AutoPageTags: "Article"
+	};
+	if (data.title) { meta.title = data.title; }
+	if (data.author_name) { meta.author = data.author_name; }
+	if (data.provider_name) { meta.siteName = data.provider_name; }
+	if (pageDescription) { meta.description = pageDescription; }
+	if (publishedTime) { meta.publishedTime = publishedTime; }
+	return meta;
+}
+
+// V1 parity: AutoPageTags* + descriptive fields. Worker emits one <meta> per entry.
+function buildPageMetadataForReadability(article: any): { [key: string]: string } {
+	let meta: { [key: string]: string } = {
+		AutoPageTagsCodes: "Article",
+		AutoPageTags: "Article"
+	};
+	if (article.title) { meta.title = article.title; }
+	if (article.excerpt) { meta.description = article.excerpt; }
+	if (article.byline) { meta.author = article.byline; }
+	if (article.siteName) { meta.siteName = article.siteName; }
+	if (article.publishedTime) { meta.publishedTime = article.publishedTime; }
+	return meta;
+}
+
+function extractArticleViaReadability() {
 	// Clone content-frame document — Readability mutates the DOM
 	let iframeDoc = iframe.contentDocument;
 	if (!iframeDoc || !iframeDoc.body) {
@@ -1067,6 +1276,8 @@ function extractArticle() {
 
 		if (article && article.content) {
 			cachedArticleHtml = cleanArticleHtml(article.content);
+			cachedOEmbedData = null;
+			cachedPageMetadata = buildPageMetadataForReadability(article);
 			renderArticleHtml(cachedArticleHtml);
 			articleLoaded = true;
 			if (currentMode === "article") {
@@ -1090,17 +1301,20 @@ function showArticleError() {
 	}
 }
 
-// Clean Readability output to match ONML (OneNote Markup Language) constraints,
-// mirroring the old toOnml() pipeline: strip styles/classes, event handlers, and
-// unsupported elements. Applied once at extraction time so both preview and save
-// use the same cleaned HTML.
+// ONML cleanup for Readability/selection output (mirrors V1 toOnml).
 function cleanArticleHtml(html: string): string {
 	let tempDoc = new DOMParser().parseFromString(html, "text/html");
 	// Remove elements not supported in ONML
-	let unsupported = tempDoc.querySelectorAll("applet, audio, button, canvas, embed, hr, input, link, map, menu, menuitem, meter, noscript, progress, script, source, style, svg, video");
+	let unsupported = tempDoc.querySelectorAll("applet, audio, button, canvas, embed, hr, iframe, input, link, map, menu, menuitem, meter, noscript, progress, script, source, style, svg, video");
 	for (let i = unsupported.length - 1; i >= 0; i--) {
 		if (unsupported[i].parentNode) { unsupported[i].parentNode.removeChild(unsupported[i]); }
 	}
+	// Drop blank <img> (V1 parity: removeBlankImages).
+	let blanks = tempDoc.querySelectorAll('img:not([src]), img[src=""]');
+	for (let i = blanks.length - 1; i >= 0; i--) {
+		let parent = blanks[i].parentNode;
+		if (parent) { parent.removeChild(blanks[i]); }
+	}
 	// Strip all style and class attributes (page layout styles leak into preview/OneNote)
 	let allEls = tempDoc.querySelectorAll("*");
 	for (let j = 0; j < allEls.length; j++) {
@@ -1113,36 +1327,26 @@ function cleanArticleHtml(html: string): string {
 function renderArticleHtml(html: string) {
 	let pDoc = previewFrame.contentDocument;
 	if (!pDoc) { return; }
-	// Wrap article HTML in a styled document matching OneNote page layout:
-	// 624px content width + 20px left/right padding = 664px total (from @OneNotePageWidth)
 	let fontFamily = articleSerif ? strings.fontFamilySerif : strings.fontFamilySansSerif;
 	let fontSize = articleFontSize + "px";
 	let articleCss = "body { font-family: " + fontFamily + ", 'Segoe UI', sans-serif; font-size: " + fontSize + "; line-height: 1.6; "
 		+ "max-width: 624px; margin: 24px 0; padding: 0 20px; color: #1a1a1a; margin-bottom: 16px; }"
 		+ "img { max-width: 100%; height: auto; }"
-		// pointer-events:none + cursor:default prevent click navigation in the
-		// preview iframe (matches bookmark mode). Without this, clicking a link
-		// in the rendered article navigates the iframe away from the captured
-		// content, breaking save/highlight flows. Text selection still works
-		// because the selection range covers the link without the link itself
-		// receiving the mouse event.
+		// pointer-events:none on links so the iframe doesn't navigate away on click (matches bookmark mode).
 		+ "a { color: #2e75b5; text-decoration: underline; pointer-events: none; cursor: default; }"
 		+ "::-webkit-scrollbar{width:6px} ::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.2);border-radius:3px} ::-webkit-scrollbar-track{background:transparent}"
 		+ "h2 { font-size: 18px; color: rgb(46,117,181); }"
 		+ "h3, h4, h5, h6 { color: rgb(91,155,213); margin-top: 14pt; margin-bottom: 14pt; }"
 		+ "figure { margin-inline-start: 0; }"
 		+ "pre, code { background: #f5f5f5; padding: 2px 6px; border-radius: 3px; font-size: 14px; }"
-		// Wrap long lines instead of horizontal scroll — OneNote doesn't preserve
-		// scrollbars in saved pages, so showing one in preview is misleading.
-		// !important + overflow-wrap:anywhere defeat inline styles from Readability
-		// output and unbreakable tokens (long URLs, paths) in code samples.
 		+ "pre, pre code { white-space: pre-wrap !important; overflow-wrap: anywhere !important; word-break: break-word !important; overflow-x: hidden !important; }"
 		+ "pre { padding: 12px; }"
 		+ "blockquote { border-inline-start: 3px solid rgb(46,117,181); margin-inline-start: 0; padding-inline-start: 16px; color: #555; }"
 		+ "table { border-collapse: collapse; width: 100%; }"
 		+ "td, th { border: 1px solid #ddd; padding: 8px; }"
 		+ ".highlighted { background: #fefe56; }"
-		+ ".highlight-anchor { position: relative; display: inline-block; }"
+		// display:inline (not inline-block) so word-break still applies to long highlighted tokens.
+		+ ".highlight-anchor { position: relative; display: inline; }"
 		+ ".delete-highlight { position: absolute; top: -8px; inset-inline-start: -8px; z-index: 10; "
 		+ "width: 18px; height: 18px; border-radius: 50%; background: #e74c3c; color: #fff; "
 		+ "font-size: 12px; line-height: 18px; text-align: center; cursor: pointer; }"
@@ -1180,28 +1384,15 @@ function applyArticleFontSize() {
 }
 
 function initHighlighter() {
-	let pDoc = previewFrame.contentDocument;
-	let pWin = previewFrame.contentWindow as any;
-	if (!pDoc || !pDoc.body || !pWin) { return; }
-
-	// Inject TextHighlighter script if not already present
-	if (!pWin.TextHighlighter) {
-		let script = pDoc.createElement("script");
-		script.src = "textHighlighter.js";
-		script.onload = function() {
-			createHighlighterInstance();
-		};
-		pDoc.head.appendChild(script);
-	} else {
-		createHighlighterInstance();
-	}
+	// Parent-window script operating on the sandboxed (allow-same-origin) preview-frame.
+	createHighlighterInstance();
 }
 
 function createHighlighterInstance() {
-	let pWin = previewFrame.contentWindow as any;
 	let pDoc = previewFrame.contentDocument;
-	if (!pWin || !pWin.TextHighlighter || !pDoc || !pDoc.body) { return; }
-	textHighlighterInstance = new pWin.TextHighlighter(pDoc.body, {
+	let highlighterCtor = (window as any).TextHighlighter;
+	if (!highlighterCtor || !pDoc || !pDoc.body) { return; }
+	textHighlighterInstance = new highlighterCtor(pDoc.body, {
 		color: "#fefe56",
 		highlightedClass: "highlighted",
 		enabled: true,
@@ -1324,7 +1515,7 @@ highlightBtn.addEventListener("click", () => {
 // --- Bookmark mode ---
 
 function switchToBookmark() {
-	saveArticleWorkingState();
+	saveWorkingState();
 	resetSaveState();
 	currentMode = "bookmark";
 	iframe.style.display = "none";
@@ -1417,12 +1608,7 @@ function extractBookmark() {
 		}
 	}
 
-	// Convert thumbnail to base64 data URL (OneNote API can't fetch external URLs)
-	// HTML structure matches legacy BookmarkHelper + createPostProcessessedHtml exactly:
-	// - Outer div + tables get fontStyleString (tables don't inherit from div in OneNote API)
-	// - No table-layout/border-collapse on outer table (legacy didn't have them)
-	// - Thumbnail <td> has only padding-top:9px (no vertical-align, no object-fit)
-	// - <img> has id="bookmarkThumbnail", no inline style (legacy pattern)
+	// HTML matches V1 BookmarkHelper + createPostProcessessedHtml; thumbnail goes to base64 below.
 	let buildBookmark = (resolvedThumbSrc: string) => {
 		let thumbHtml = "";
 		if (resolvedThumbSrc) {
@@ -1476,8 +1662,8 @@ function extractBookmark() {
 	}
 }
 
-// Fetch an image URL and convert to base64 data URL via canvas
-// (OneNote API can't fetch external URLs — matches legacy DomUtils.getImageDataUrl)
+// URL -> data URL via canvas (OneNote API can't fetch externals). PNG initial,
+// JPEG step-down on oversized images to stay under the per-MIME-part limit.
 function imageToDataUrl(url: string, callback: (dataUrl: string) => void) {
 	let img = new Image();
 	img.crossOrigin = "anonymous";
@@ -1487,7 +1673,8 @@ function imageToDataUrl(url: string, callback: (dataUrl: string) => void) {
 			canvas.width = img.naturalWidth;
 			canvas.height = img.naturalHeight;
 			(canvas.getContext("2d") as CanvasRenderingContext2D).drawImage(img, 0, 0);
-			callback(canvas.toDataURL("image/png"));
+			let dataUrl = canvas.toDataURL("image/png");
+			callback(adjustImageQualityIfNecessary(canvas, dataUrl));
 		} catch (e) {
 			callback(""); // tainted canvas or other error — fall back
 		}
@@ -1496,6 +1683,18 @@ function imageToDataUrl(url: string, callback: (dataUrl: string) => void) {
 	img.src = url;
 }
 
+// OneNote API per-MIME-part limit (V1: Apis_MediaTypesHandledInMemoryMaxRequestLength), minus envelope padding.
+const MAX_BYTES_FOR_MEDIA_TYPES = 2097152 - 500;
+
+function adjustImageQualityIfNecessary(canvas: HTMLCanvasElement, dataUrl: string): string {
+	let quality = 1.0;
+	while (quality > 0 && dataUrl.length > MAX_BYTES_FOR_MEDIA_TYPES) {
+		dataUrl = canvas.toDataURL("image/jpeg", quality);
+		quality -= 0.1;
+	}
+	return dataUrl;
+}
+
 function getMetaContent(doc: Document, value: string, attr: string): string {
 	let el = doc.querySelector("meta[" + attr + "=\"" + value + "\"]");
 	return el ? el.getAttribute("content") || "" : "";
@@ -1563,7 +1762,11 @@ function startRegionCapture() {
 }
 
 function switchToRegion() {
-	saveArticleWorkingState();
+	saveWorkingState();
+	// Stash the outgoing mode for region-cancel restore; skip self-references.
+	if (currentMode !== "region") {
+		modeBeforeRegion = currentMode;
+	}
 	resetSaveState();
 	currentMode = "region";
 	iframe.style.display = "none";
@@ -1794,6 +1997,7 @@ function switchToPdf() {
 		renderPdfPagesInPreview(0, pdfInitialPageLoad);
 		setupPdfPreviewLazyLoad();
 		updatePdfPageSelection();
+		renderPdfAttachmentIndicator();
 	}
 	saveBtn.disabled = !pdfDoc;
 	saveBtn.textContent = strings.saveToOneNote;
@@ -1844,7 +2048,7 @@ function enterPdfMode(url: string) {
 	}
 	pdfAttachWarning.textContent = strings.pdfTooLarge;
 
-	// Hide non-PDF mode buttons, show PDF + Region + Bookmark, enable them (they start disabled during capture)
+	// Show only PDF/Region/Bookmark buttons; clear .selected on hidden modes.
 	document.querySelectorAll(".mode-btn").forEach(function(btn) {
 		let mode = btn.getAttribute("data-mode");
 		if (mode === "pdf") {
@@ -1861,6 +2065,8 @@ function enterPdfMode(url: string) {
 			btn.setAttribute("aria-pressed", "false");
 		} else {
 			(btn as HTMLElement).style.display = "none";
+			btn.classList.remove("selected");
+			btn.setAttribute("aria-pressed", "false");
 		}
 	});
 	enableSignout();
@@ -1947,6 +2153,7 @@ function setupPdfOptions() {
 
 	pdfAttachCheckbox.addEventListener("change", function() {
 		pdfAttach = pdfAttachCheckbox.checked;
+		renderPdfAttachmentIndicator();
 	});
 
 	pdfDistributeCheckbox.addEventListener("change", function() {
@@ -1954,6 +2161,31 @@ function setupPdfOptions() {
 	});
 }
 
+// V1 PdfPreviewAttachment: 84x96 icon + filename at top of preview when Attach PDF is on.
+function renderPdfAttachmentIndicator() {
+	let existing = document.getElementById("pdf-attachment-indicator");
+	if (existing && existing.parentNode) { existing.parentNode.removeChild(existing); }
+	if (!pdfAttach || !previewContainer) { return; }
+	let url = sourceUrlText.textContent || pdfSourceUrl;
+	let fullName = getPdfFileName(url);
+	let nameOnly = fullName.replace(/\.[^.]+$/, "");
+	let indicator = document.createElement("div");
+	indicator.id = "pdf-attachment-indicator";
+	indicator.className = "pdf-attachment-indicator";
+	indicator.setAttribute("role", "img");
+	indicator.setAttribute("aria-label", strings.pdfAttachFile + ": " + fullName);
+	let img = document.createElement("img");
+	img.src = "images/editorOptions/pdf_attachment_icon.png";
+	img.alt = "";
+	let label = document.createElement("div");
+	label.className = "file-name";
+	label.textContent = nameOnly;
+	label.title = fullName;
+	indicator.appendChild(img);
+	indicator.appendChild(label);
+	previewContainer.insertBefore(indicator, previewContainer.firstChild);
+}
+
 // Update preview to gray out unselected pages (matches legacy opacity:0.3 behavior)
 function updatePdfPageSelection() {
 	let selectedIndices = getPdfSelectedIndices();
@@ -2017,6 +2249,7 @@ function loadPdf(url: string) {
 			// Render initial pages
 			renderPdfPagesInPreview(0, pdfInitialPageLoad);
 			setupPdfPreviewLazyLoad();
+			renderPdfAttachmentIndicator();
 
 			announceToScreenReader(strings.modePdf + " — " + pdfPageCount + " " + strings.page + (pdfPageCount !== 1 ? "s" : ""));
 		}, function(err: any) {
@@ -2058,6 +2291,7 @@ function updateAttachCheckbox() {
 		pdfAttach = false;
 		pdfAttachLabel.classList.add("disabled");
 		pdfAttachWarning.style.display = "";
+		renderPdfAttachmentIndicator();
 	}
 }
 
@@ -2145,8 +2379,8 @@ modeButtons.forEach((btn, idx) => {
 	btn.addEventListener("click", () => {
 		let mode = btn.getAttribute("data-mode");
 		if (mode === currentMode) { return; }
-		// Block mode switching during active capture — captureVisibleTab needs content-frame visible
-		if (!fullPageComplete && mode !== "fullpage") { return; }
+		// Block mode switching mid-capture (captureVisibleTab needs the iframe visible).
+		if (captureInProgress && mode !== "fullpage") { return; }
 
 		// Update selected state visually + ARIA
 		document.querySelectorAll(".mode-btn").forEach((b) => {
@@ -2157,7 +2391,7 @@ modeButtons.forEach((btn, idx) => {
 		btn.setAttribute("aria-pressed", "true");
 
 		// Click event — match legacy componentBase.ts logClickEvent(element.id)
-		let modeClickIds: { [key: string]: string } = { fullpage: "fullPageButton", article: "augmentationButton", bookmark: "bookmarkButton", region: "regionButton", pdf: "pdfButton" };
+		let modeClickIds: { [key: string]: string } = { fullpage: "fullPageButton", article: "augmentationButton", bookmark: "bookmarkButton", region: "regionButton", pdf: "pdfButton", selection: "selectionButton" };
 		logClickEvent(modeClickIds[mode as string] || mode as string);
 
 		if (mode === "fullpage") {
@@ -2166,6 +2400,9 @@ modeButtons.forEach((btn, idx) => {
 		} else if (mode === "article") {
 			switchToArticle();
 			setTelemetryContext(Context.Custom.ContentType, "Article");
+		} else if (mode === "selection") {
+			switchToSelection();
+			setTelemetryContext(Context.Custom.ContentType, "Selection");
 		} else if (mode === "bookmark") {
 			// For PDF pages, generate bookmark from title/URL since DOM has no og: tags
 			if (pdfMode && !cachedBookmarkHtml) {
@@ -2187,7 +2424,78 @@ modeButtons.forEach((btn, idx) => {
 	});
 });
 
+// --- Full-page capture lifecycle helpers ---
+
+// Sends `dimensions` to start the worker's scroll-and-stitch loop.
+function kickoffFullPageCapture() {
+	if (!captureDimensions || captureInProgress || fullPageComplete) { return; }
+	captureInProgress = true;
+	safeSend({
+		action: "dimensions",
+		viewportHeight: captureDimensions.viewportHeight,
+		pageHeight: captureDimensions.pageHeight,
+		contentHeight: captureDimensions.contentHeight
+	});
+}
+
+// Post-loadContent state for invocations that don't need a full-page screenshot
+// (Selection/Image context-menu or oEmbed-site toolbar invoke).
+function enterReadyStateWithoutCapture() {
+	capturePanel.style.display = "none";
+	saveBtn.textContent = strings.saveToOneNote;
+	saveBtn.disabled = false;
+	document.querySelectorAll(".mode-btn").forEach((b: Element) => {
+		(b as HTMLButtonElement).disabled = false;
+		b.classList.remove("disabled");
+	});
+	enableSignout();
+	announceToScreenReader(loc("WebClipper.Label.ClipSuccessful", "Capture complete"));
+	triggerInitialModeAutoEngage();
+}
+
+// Auto-engage Selection / Region / Article mode based on invocation intent.
+function triggerInitialModeAutoEngage() {
+	if (invokedFromContextSelection && cachedSelectionHtml) {
+		let selBtn = document.querySelector('.mode-btn[data-mode="selection"]') as HTMLElement;
+		if (selBtn) {
+			selBtn.style.display = "";
+			(selBtn as HTMLButtonElement).click();
+			selBtn.focus();
+		}
+	} else if (siteSuggestsArticleMode) {
+		let articleBtn = document.querySelector('.mode-btn[data-mode="article"]') as HTMLElement;
+		if (articleBtn) {
+			(articleBtn as HTMLButtonElement).click();
+			articleBtn.focus();
+		}
+	} else if (invokedFromContextImage && contextImageSrcUrl) {
+		// Async fetch; if user has moved on by the time it resolves, don't bounce.
+		imageToDataUrl(contextImageSrcUrl, function(dataUrl: string) {
+			if (!dataUrl) {
+				let fpModeBtn = document.querySelector('.mode-btn[data-mode="fullpage"]') as HTMLElement;
+				if (fpModeBtn) { fpModeBtn.focus(); }
+				return;
+			}
+			regionImages.push(dataUrl);
+			if (captureInProgress || fullPageComplete || currentMode !== "fullpage") {
+				return;
+			}
+			let regionBtn = document.querySelector('.mode-btn[data-mode="region"]') as HTMLElement;
+			if (regionBtn) {
+				(regionBtn as HTMLButtonElement).click();
+				regionBtn.focus();
+			}
+		});
+	}
+}
+
 port.onMessage.addListener((message: any) => {
+	// Worker finished refreshing user state — localStorage is now current.
+	if (message.action === "userRefreshed") {
+		fetchFreshNotebooks();
+		return;
+	}
+
 	if (message.action === "loadContent") {
 		// Page payload arrives inline on the loadContent port message — html,
 		// baseUrl, title, url, contentType, plus the localFileNotAllowed flag.
@@ -2197,6 +2505,23 @@ port.onMessage.addListener((message: any) => {
 		let pageUrl: string = message.url || "";
 		let contentType: string = message.contentType || "html";
 
+		// Context-menu payload from worker (selection HTML + invocation intent).
+		// cleanArticleHtml applies the ONML strip on top of contentCaptureInject's pipeline.
+		cachedSelectionHtml = message.selectionHtml ? cleanArticleHtml(message.selectionHtml) : "";
+		invokedFromContextSelection = message.invokeMode === "ContextTextSelection";
+		contextImageSrcUrl = message.invokeData || "";
+		invokedFromContextImage = message.invokeMode === "ContextImage" && !!contextImageSrcUrl;
+		// Toolbar-only mode hint; context-menu invocations carry explicit intent.
+		siteSuggestsArticleMode =
+			!invokedFromContextSelection &&
+			!invokedFromContextImage &&
+			isOEmbedProviderUrl(pageUrl);
+
+		// Skip-capture flows: hide iframe via visibility (preserves layout for measurement).
+		if (invokedFromContextSelection || invokedFromContextImage || siteSuggestsArticleMode) {
+			iframe.style.visibility = "hidden";
+		}
+
 		// Populate title and source URL (may not have been available on initial page load)
 		if (pageTitle && !titleField.value) { titleField.value = pageTitle; }
 		if (pageUrl && !sourceUrlText.textContent) { sourceUrlText.textContent = pageUrl; sourceUrl.title = pageUrl; }
@@ -2424,12 +2749,19 @@ port.onMessage.addListener((message: any) => {
 					if (parseInt(htmlComputed.paddingTop, 10) > 0) { htmlEl.style.paddingTop = "0"; }
 					if (parseInt(htmlComputed.marginTop, 10) > 0) { htmlEl.style.marginTop = "0"; }
 
-					safeSend({
-						action: "dimensions",
+					// Cache dimensions for deferred Full Page kickoff.
+					captureDimensions = {
 						viewportHeight: viewportH,
 						pageHeight: htmlEl.scrollHeight,
 						contentHeight: contentHeight
-					});
+					};
+					// Skip eager capture when invocation implies a specific non-FullPage
+					// mode; switchToFullPage kicks off on demand if user enters it.
+					if (invokedFromContextSelection || invokedFromContextImage || siteSuggestsArticleMode) {
+						enterReadyStateWithoutCapture();
+					} else {
+						kickoffFullPageCapture();
+					}
 				};
 
 				for (let i = 0; i < iframeImgs.length; i++) {
@@ -2583,18 +2915,14 @@ port.onMessage.addListener((message: any) => {
 				fullPageComplete = true;
 				showPreviewFrame();
 
-					// Only update left panel if still viewing Full Page mode
+					// Only update the panel when user is in Full Page; other modes own previewContainer.
 					if (currentMode === "fullpage") {
 						iframe.style.display = "none";
+						previewContainer.innerHTML = "";
 						previewContainer.style.display = "block";
 						let previewImg = document.createElement("img");
 						previewImg.src = dataUrl;
 						previewContainer.appendChild(previewImg);
-					} else {
-						// Still create the preview image for later switching
-						let previewImg = document.createElement("img");
-						previewImg.src = dataUrl;
-						previewContainer.appendChild(previewImg);
 					}
 
 					// Update sidebar to preview mode — hide progress, show Clip button
@@ -2608,8 +2936,9 @@ port.onMessage.addListener((message: any) => {
 						b.classList.remove("disabled");
 					});
 					enableSignout();
+					captureInProgress = false;
 					announceToScreenReader(loc("WebClipper.Label.ClipSuccessful", "Capture complete"));
-					// Set initial focus on Full Page mode button after capture
+
 					let fpModeBtn = document.querySelector('.mode-btn[data-mode="fullpage"]') as HTMLElement;
 					if (fpModeBtn) { setTimeout(function() { fpModeBtn.focus(); }, 100); }
 
@@ -2663,25 +2992,9 @@ port.onMessage.addListener((message: any) => {
 	if (message.action === "regionCancelled") {
 		capturePanel.style.display = "none";
 		if (regionImages.length === 0) {
-			// Matches legacy clipper behavior: cancelling a fresh region selection
-			// snaps back to the page's default mode — Full Page on web pages,
-			// PDF Document on PDF pages (Full Page mode is hidden in PDF flow).
-			// Focus stays on the Region mode button so the user can re-enter
-			// region mode immediately.
-			let fallbackMode = pdfMode ? "pdf" : "fullpage";
-			document.querySelectorAll(".mode-btn").forEach((b) => {
-				b.classList.remove("selected");
-				b.setAttribute("aria-pressed", "false");
-			});
-			let fallbackBtn = document.querySelector('.mode-btn[data-mode="' + fallbackMode + '"]');
-			if (fallbackBtn) { fallbackBtn.classList.add("selected"); fallbackBtn.setAttribute("aria-pressed", "true"); }
-			if (pdfMode) {
-				switchToPdf();
-				setTelemetryContext(Context.Custom.ContentType, "Pdf");
-			} else {
-				switchToFullPage();
-				setTelemetryContext(Context.Custom.ContentType, "FullPage");
-			}
+			let fallbackMode = modeBeforeRegion || (pdfMode ? "pdf" : "fullpage");
+			let fallbackBtn = document.querySelector('.mode-btn[data-mode="' + fallbackMode + '"]') as HTMLButtonElement;
+			if (fallbackBtn) { fallbackBtn.click(); }
 			let regionBtn = document.querySelector('.mode-btn[data-mode="region"]') as HTMLElement;
 			if (regionBtn) { setTimeout(function() { regionBtn.focus(); }, 0); }
 		} else {
@@ -2847,9 +3160,19 @@ port.onMessage.addListener((message: any) => {
 			fullPageDataUrl = "";
 			articleLoaded = false;
 			cachedArticleHtml = "";
+			articleWorkingHtml = "";
+			cachedSelectionHtml = "";
+			selectionWorkingHtml = "";
+			invokedFromContextSelection = false;
+			contextImageSrcUrl = "";
+			invokedFromContextImage = false;
+			siteSuggestsArticleMode = false;
 			bookmarkLoaded = false;
 			cachedBookmarkHtml = "";
 			contentDocReady = false;
+			captureInProgress = false;
+			captureDimensions = null;
+			modeBeforeRegion = "";
 			// Populate section dropdown — delay slightly to ensure localStorage is written by offscreen
 			populateSectionDropdown();
 			setTimeout(fetchFreshNotebooks, 300);
@@ -2890,9 +3213,17 @@ port.onMessage.addListener((message: any) => {
 		fullPageDataUrl = "";
 		articleLoaded = false;
 		cachedArticleHtml = "";
+		articleWorkingHtml = "";
+		cachedSelectionHtml = "";
+		selectionWorkingHtml = "";
+		invokedFromContextSelection = false;
+		siteSuggestsArticleMode = false;
 		bookmarkLoaded = false;
 		cachedBookmarkHtml = "";
 		contentDocReady = false;
+		captureInProgress = false;
+		captureDimensions = null;
+		modeBeforeRegion = "";
 		regionImages.length = 0;
 		currentMode = "fullpage";
 		// Unlock sidebar (clears disabled state from lockSidebar during save)
@@ -3031,22 +3362,35 @@ saveBtn.addEventListener("click", () => {
 		for (let i = 0; i < regionImages.length; i++) {
 			safeSend({ action: "saveImage", index: i, dataUrl: regionImages[i] });
 		}
-	} else if (currentMode === "article") {
-		let pDoc = previewFrame.contentDocument;
+	} else if (currentMode === "article" || currentMode === "selection") {
 		let articleBody = "";
-		if (pDoc && pDoc.body && pDoc.body.querySelector(".highlighted")) {
-			let clone = pDoc.body.cloneNode(true) as HTMLElement;
-			let delBtns = clone.querySelectorAll(".delete-highlight");
-			for (let i = delBtns.length - 1; i >= 0; i--) {
-				if (delBtns[i].parentNode) { delBtns[i].parentNode.removeChild(delBtns[i]); }
-			}
-			articleBody = clone.innerHTML;
+		let oembedSnap = cachedOEmbedData;
+		if (currentMode === "article" && oembedSnap) {
+			articleBody = composeOEmbedForSave(oembedSnap, cachedOEmbedDescription);
 		} else {
-			articleBody = cachedArticleHtml;
+			let pDoc = previewFrame.contentDocument;
+			if (pDoc && pDoc.body && pDoc.body.querySelector(".highlighted")) {
+				let clone = pDoc.body.cloneNode(true) as HTMLElement;
+				let delBtns = clone.querySelectorAll(".delete-highlight");
+				for (let i = delBtns.length - 1; i >= 0; i--) {
+					if (delBtns[i].parentNode) { delBtns[i].parentNode.removeChild(delBtns[i]); }
+				}
+				articleBody = clone.innerHTML;
+			} else {
+				articleBody = currentMode === "selection" ? cachedSelectionHtml : cachedArticleHtml;
+			}
 		}
 		let fontFamily = articleSerif ? strings.fontFamilySerif : strings.fontFamilySansSerif;
 		let fontStyle = "font-size: " + articleFontSize + "px; font-family: " + fontFamily + ";";
 		saveMsg.contentHtml = "<div style=\"" + fontStyle + "\">" + articleBody + "</div>";
+		// Selection uses Article taxonomy in PageMetadata (V1 parity).
+		if (currentMode === "selection" && !cachedPageMetadata) {
+			cachedPageMetadata = {
+				AutoPageTagsCodes: "Article",
+				AutoPageTags: "Article"
+			};
+		}
+		if (cachedPageMetadata) { saveMsg.pageMetadata = cachedPageMetadata; }
 		saveMsg.saveImageCount = 0;
 		safeSend(saveMsg);
 	} else if (currentMode === "bookmark") {
@@ -3247,3 +3591,6 @@ let signingIn = false; // Used by sign-in flow
 
 // Signal that the renderer is ready
 safeSend({ action: "ready" });
+
+// V1 parity (getInitialUser): refresh user state on open before notebooks fetch.
+safeSend({ action: "refreshUser" });
diff --git a/src/styles/renderer.less b/src/styles/renderer.less
index 188f84e7..6126ee4c 100644
--- a/src/styles/renderer.less
+++ b/src/styles/renderer.less
@@ -1,6 +1,16 @@
 // Renderer window styles — sidebar panel for capture progress and preview
 // Color values follow Fluent 2 design tokens (white theme).
 
+// Segoe UI for non-Windows users (matches V1; loaded from OneNote CDN).
+@font-face {
+	font-family: 'Segoe UI';
+	src: url('segoeui.eot');
+	src: local("Segoe UI"), local("Segoe"), local("Segoe WP"),
+		 url('https://www.onenote.com/styles/segoeui.eot?#iefix') format('embedded-opentype'),
+		 url('https://www.onenote.com/styles/segoeui.woff') format('woff');
+	font-weight: normal;
+}
+
 // --- Fluent 2 neutral tokens (light theme) ---
 @colorNeutralBackground1: #ffffff;        // Sidebar / surface
 @colorNeutralBackground2: #fafafa;        // Subtle hover
@@ -239,10 +249,9 @@ iframe#preview-frame {
 	&::-webkit-scrollbar-track { background: transparent; }
 }
 
-// Sidebar groups — Fluent design uses 1px neutral dividers between sections.
-// 8px padding above + 8px padding below the divider matches Figma `py-[8px]`.
+// Sidebar groups — Fluent dividers; 12/12 padding keeps PDF mode within window height.
 .sidebar-group {
-	padding: 8px 0;
+	padding: 12px 0;
 	&:first-child { padding-top: 4px; }
 	& + .sidebar-group {
 		border-top: 1px solid @colorNeutralStroke2;
@@ -1167,6 +1176,25 @@ iframe#preview-frame {
 		text-align: center; padding: 20px; color: #666;
 		font-size: 13px;
 	}
+	// V1 .attachment-overlay parity: 84x96 box, 48px icon, filename below.
+	.pdf-attachment-indicator {
+		width: 84px; min-height: 96px;
+		margin-inline-start: 16px; margin-top: 16px; margin-bottom: 8px;
+		text-align: center; box-sizing: border-box;
+		img {
+			width: 48px; height: 48px;
+			margin: 5px 18px;
+			display: block;
+		}
+		.file-name {
+			overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
+			max-width: 84px;
+			padding: 0;
+			font-size: 13px; line-height: 1.5em;
+			text-align: center; word-wrap: normal;
+			color: @colorNeutralForeground2;
+		}
+	}
 }
 
 // --- Screen reader only (mirrors old .srOnly pattern) ---