diff --git a/apps/roam/src/components/LeftSidebarView.tsx b/apps/roam/src/components/LeftSidebarView.tsx
index 4647d3238..8cdfa0de4 100644
--- a/apps/roam/src/components/LeftSidebarView.tsx
+++ b/apps/roam/src/components/LeftSidebarView.tsx
@@ -30,6 +30,16 @@ import type {
   LeftSidebarConfig,
   LeftSidebarPersonalSectionConfig,
 } from "~/utils/getLeftSidebarSettings";
+import {
+  getGlobalSetting,
+  getPersonalSetting,
+  setGlobalSetting,
+  setPersonalSetting,
+} from "~/components/settings/utils/accessors";
+import type {
+  LeftSidebarGlobalSettings,
+  PersonalSection,
+} from "~/components/settings/utils/zodSchema";
 import { createBlock } from "roamjs-components/writes";
 import deleteBlock from "roamjs-components/writes/deleteBlock";
 import getTextByBlockUid from "roamjs-components/queries/getTextByBlockUid";
@@ -95,12 +105,18 @@ const toggleFoldedState = ({
   setIsOpen,
   folded,
   parentUid,
+  isGlobal,
+  sectionIndex,
 }: {
   isOpen: boolean;
   setIsOpen: Dispatch<SetStateAction<boolean>>;
   folded: { uid?: string; value: boolean };
   parentUid: string;
+  isGlobal?: boolean;
+  sectionIndex?: number;
 }) => {
+  const newFolded = !isOpen;
+
   if (isOpen) {
     setIsOpen(false);
     if (folded.uid) {
@@ -118,6 +134,18 @@ const toggleFoldedState = ({
     folded.uid = newUid;
     folded.value = true;
   }
+
+  // Dual-write to block props
+  if (isGlobal) {
+    setGlobalSetting(["Left sidebar", "Settings", "Folded"], newFolded);
+  } else if (sectionIndex !== undefined) {
+    const sections =
+      getPersonalSetting<PersonalSection[]>(["Left sidebar"]) || [];
+    if (sections[sectionIndex]) {
+      sections[sectionIndex].Settings.Folded = newFolded;
+      setPersonalSetting(["Left sidebar"], sections);
+    }
+  }
 };
 
 const SectionChildren = ({
@@ -160,8 +188,10 @@ const SectionChildren = ({
 
 const PersonalSectionItem = ({
   section,
+  sectionIndex,
 }: {
   section: LeftSidebarPersonalSectionConfig;
+  sectionIndex: number;
 }) => {
   const titleRef = parseReference(section.text);
   const blockText = useMemo(
@@ -182,6 +212,7 @@ const PersonalSectionItem = ({
       setIsOpen,
       folded: section.settings.folded,
       parentUid: section.settings.uid || "",
+      sectionIndex,
     });
   };
 
@@ -226,9 +257,9 @@ const PersonalSections = ({ config }: { config: LeftSidebarConfig }) => {
 
   return (
     <div className="personal-left-sidebar-sections">
-      {sections.map((section) => (
+      {sections.map((section, index) => (
         <div key={section.uid}>
-          <PersonalSectionItem section={section} />
+          <PersonalSectionItem section={section} sectionIndex={index} />
         </div>
       ))}
     </div>
@@ -253,6 +284,7 @@ const GlobalSection = ({ config }: { config: LeftSidebarConfig["global"] }) => {
             setIsOpen,
             folded: config.settings.folded,
             parentUid: config.settings.uid,
+            isGlobal: true,
           });
         }}
       >
@@ -276,13 +308,80 @@ const GlobalSection = ({ config }: { config: LeftSidebarConfig["global"] }) => {
   );
 };
 
+const buildConfig = (): LeftSidebarConfig => {
+  // Read VALUES from accessor (handles flag routing + mismatch detection)
+  const globalValues = getGlobalSetting<LeftSidebarGlobalSettings>([
+    "Left sidebar",
+  ]);
+  const personalValues = getPersonalSetting<PersonalSection[]>([
+    "Left sidebar",
+  ]);
+
+  // Read UIDs from old system (needed for fold CRUD during dual-write)
+  const oldConfig = getFormattedConfigTree().leftSidebar;
+
+  // Merge: accessor values + old-system UIDs
+  return {
+    uid: oldConfig.uid,
+    favoritesMigrated: oldConfig.favoritesMigrated,
+    sidebarMigrated: oldConfig.sidebarMigrated,
+    global: {
+      uid: oldConfig.global.uid,
+      childrenUid: oldConfig.global.childrenUid,
+      children: oldConfig.global.children,
+      settings: oldConfig.global.settings
+        ? {
+            uid: oldConfig.global.settings.uid,
+            collapsable: {
+              uid: oldConfig.global.settings.collapsable.uid,
+              value:
+                globalValues?.Settings?.Collapsable ??
+                oldConfig.global.settings.collapsable.value,
+            },
+            folded: {
+              uid: oldConfig.global.settings.folded.uid,
+              value:
+                globalValues?.Settings?.Folded ??
+                oldConfig.global.settings.folded.value,
+            },
+          }
+        : undefined,
+    },
+    personal: {
+      uid: oldConfig.personal.uid,
+      sections: oldConfig.personal.sections.map((oldSection, i) => {
+        const newSection = personalValues?.[i];
+        return {
+          ...oldSection,
+          settings: oldSection.settings
+            ? {
+                ...oldSection.settings,
+                truncateResult: {
+                  ...oldSection.settings.truncateResult,
+                  value:
+                    newSection?.Settings?.["Truncate-result?"] ??
+                    oldSection.settings.truncateResult.value,
+                },
+                folded: {
+                  ...oldSection.settings.folded,
+                  value:
+                    newSection?.Settings?.Folded ??
+                    oldSection.settings.folded.value,
+                },
+              }
+            : oldSection.settings,
+        };
+      }),
+    },
+    allPersonalSections: oldConfig.allPersonalSections,
+  };
+};
+
 export const useConfig = () => {
-  const [config, setConfig] = useState(
-    () => getFormattedConfigTree().leftSidebar,
-  );
+  const [config, setConfig] = useState(() => buildConfig());
   useEffect(() => {
     const handleUpdate = () => {
-      setConfig(getFormattedConfigTree().leftSidebar);
+      setConfig(buildConfig());
     };
     const unsubscribe = subscribe(handleUpdate);
     return () => {
diff --git a/apps/roam/src/components/settings/AdminPanel.tsx b/apps/roam/src/components/settings/AdminPanel.tsx
index e9ad85d87..481e13259 100644
--- a/apps/roam/src/components/settings/AdminPanel.tsx
+++ b/apps/roam/src/components/settings/AdminPanel.tsx
@@ -40,7 +40,6 @@ import { USE_REIFIED_RELATIONS } from "~/data/userSettings";
 import posthog from "posthog-js";
 import { setFeatureFlag } from "~/components/settings/utils/accessors";
 import { FeatureFlagPanel } from "./components/BlockPropSettingPanels";
-import { getFeatureFlag } from "./utils/accessors";
 
 const NodeRow = ({ node }: { node: PConceptFull }) => {
   return (
@@ -473,7 +472,6 @@ const FeatureFlagsTab = (): React.ReactElement => {
         title="Use new settings store"
         description="When enabled, accessor getters read from block props instead of the old system. Surfaces dual-write gaps during development."
         featureKey="Use new settings store"
-        initialValue={getFeatureFlag("Use new settings store")}
       />
 
       <Button
diff --git a/apps/roam/src/components/settings/GeneralSettings.tsx b/apps/roam/src/components/settings/GeneralSettings.tsx
index f28631ba8..7792d0b77 100644
--- a/apps/roam/src/components/settings/GeneralSettings.tsx
+++ b/apps/roam/src/components/settings/GeneralSettings.tsx
@@ -43,7 +43,6 @@ const DiscourseGraphHome = () => {
       <FeatureFlagPanel
         title="(BETA) Left Sidebar"
         description="Whether or not to enable the left sidebar."
-        initialValue={settings.leftSidebarEnabled.value}
         featureKey="Enable left sidebar"
         order={2}
         uid={settings.leftSidebarEnabled.uid}
diff --git a/apps/roam/src/components/settings/LeftSidebarGlobalSettings.tsx b/apps/roam/src/components/settings/LeftSidebarGlobalSettings.tsx
index 838346ab5..645f6cdf7 100644
--- a/apps/roam/src/components/settings/LeftSidebarGlobalSettings.tsx
+++ b/apps/roam/src/components/settings/LeftSidebarGlobalSettings.tsx
@@ -1,7 +1,11 @@
 import React, { useCallback, useEffect, useMemo, useState, memo } from "react";
 import { Button, ButtonGroup, Collapse } from "@blueprintjs/core";
 import { GlobalFlagPanel } from "~/components/settings/components/BlockPropSettingPanels";
-import { setGlobalSetting } from "~/components/settings/utils/accessors";
+import {
+  setGlobalSetting,
+  getGlobalSetting,
+} from "~/components/settings/utils/accessors";
+import type { LeftSidebarGlobalSettings } from "~/components/settings/utils/zodSchema";
 import AutocompleteInput from "roamjs-components/components/AutocompleteInput";
 import getAllPageNames from "roamjs-components/queries/getAllPageNames";
 import createBlock from "roamjs-components/writes/createBlock";
@@ -98,6 +102,10 @@ const LeftSidebarGlobalSectionsContent = ({
     const initialize = async () => {
       setIsInitializing(true);
       const globalSectionText = "Global-Section";
+      // Dual-read: accessor validates values and logs mismatches when flag ON
+      getGlobalSetting<LeftSidebarGlobalSettings>(["Left sidebar"]);
+
+      // Use old system data (has UIDs needed for CRUD operations)
       const config = getLeftSidebarGlobalSectionConfig(leftSidebar.children);
 
       const existingGlobalSection = leftSidebar.children.find(
diff --git a/apps/roam/src/components/settings/LeftSidebarPersonalSettings.tsx b/apps/roam/src/components/settings/LeftSidebarPersonalSettings.tsx
index ab4eeb61a..d36032a78 100644
--- a/apps/roam/src/components/settings/LeftSidebarPersonalSettings.tsx
+++ b/apps/roam/src/components/settings/LeftSidebarPersonalSettings.tsx
@@ -19,7 +19,11 @@ import createBlock from "roamjs-components/writes/createBlock";
 import deleteBlock from "roamjs-components/writes/deleteBlock";
 import updateBlock from "roamjs-components/writes/updateBlock";
 import type { RoamBasicNode } from "roamjs-components/types";
-import { setPersonalSetting } from "~/components/settings/utils/accessors";
+import {
+  setPersonalSetting,
+  getPersonalSetting,
+} from "~/components/settings/utils/accessors";
+import type { PersonalSection } from "~/components/settings/utils/zodSchema";
 import {
   PersonalNumberPanel,
   PersonalTextPanel,
@@ -599,6 +603,11 @@ const LeftSidebarPersonalSectionsContent = ({
         setSections([]);
       } else {
         setPersonalSectionUid(personalSection.uid);
+
+        // Dual-read: accessor validates values and logs mismatches when flag ON
+        getPersonalSetting<PersonalSection[]>(["Left sidebar"]);
+
+        // Use old system data (has UIDs needed for CRUD operations)
         const loadedSections = getLeftSidebarPersonalSectionConfig(
           leftSidebar.children,
         ).sections;
diff --git a/apps/roam/src/components/settings/components/BlockPropSettingPanels.tsx b/apps/roam/src/components/settings/components/BlockPropSettingPanels.tsx
index 65d5225f5..81f8fc62f 100644
--- a/apps/roam/src/components/settings/components/BlockPropSettingPanels.tsx
+++ b/apps/roam/src/components/settings/components/BlockPropSettingPanels.tsx
@@ -19,6 +19,10 @@ import Description from "roamjs-components/components/Description";
 import useSingleChildValue from "roamjs-components/components/ConfigPanels/useSingleChildValue";
 import getShallowTreeByParentUid from "roamjs-components/queries/getShallowTreeByParentUid";
 import {
+  getGlobalSetting,
+  getPersonalSetting,
+  getFeatureFlag,
+  getDiscourseNodeSetting,
   setGlobalSetting,
   setPersonalSetting,
   setFeatureFlag,
@@ -500,7 +504,6 @@ export const FeatureFlagPanel = ({
   title,
   description,
   featureKey,
-  initialValue,
   onBeforeEnable,
   onAfterChange,
   parentUid,
@@ -510,7 +513,6 @@ export const FeatureFlagPanel = ({
   title: string;
   description: string;
   featureKey: keyof FeatureFlags;
-  initialValue?: boolean;
   onBeforeEnable?: () => Promise<boolean>;
   onAfterChange?: (checked: boolean) => void;
 } & RoamBlockSyncProps) => {
@@ -531,7 +533,7 @@ export const FeatureFlagPanel = ({
       description={description}
       settingKeys={[featureKey as string]}
       setter={featureFlagSetter}
-      initialValue={initialValue}
+      initialValue={getFeatureFlag(featureKey)}
       onBeforeChange={handleBeforeChange}
       onChange={onAfterChange}
       parentUid={parentUid}
@@ -542,31 +544,73 @@ export const FeatureFlagPanel = ({
 };
 
 export const GlobalTextPanel = (props: TextWrapperProps) => (
-  <BaseTextPanel {...props} {...globalAccessors.text} />
+  <BaseTextPanel
+    {...props}
+    initialValue={
+      getGlobalSetting<string>(props.settingKeys) ?? props.initialValue
+    }
+    {...globalAccessors.text}
+  />
 );
 
 export const GlobalFlagPanel = (props: FlagWrapperProps) => (
-  <BaseFlagPanel {...props} {...globalAccessors.flag} />
+  <BaseFlagPanel
+    {...props}
+    initialValue={
+      getGlobalSetting<boolean>(props.settingKeys) ?? props.initialValue
+    }
+    {...globalAccessors.flag}
+  />
 );
 
 export const GlobalNumberPanel = (props: NumberWrapperProps) => (
-  <BaseNumberPanel {...props} {...globalAccessors.number} />
+  <BaseNumberPanel
+    {...props}
+    initialValue={
+      getGlobalSetting<number>(props.settingKeys) ?? props.initialValue
+    }
+    {...globalAccessors.number}
+  />
 );
 
 export const GlobalSelectPanel = (props: SelectWrapperProps) => (
-  <BaseSelectPanel {...props} {...globalAccessors.text} />
+  <BaseSelectPanel
+    {...props}
+    initialValue={
+      getGlobalSetting<string>(props.settingKeys) ?? props.initialValue
+    }
+    {...globalAccessors.text}
+  />
 );
 
 export const GlobalMultiTextPanel = (props: MultiTextWrapperProps) => (
-  <BaseMultiTextPanel {...props} {...globalAccessors.multiText} />
+  <BaseMultiTextPanel
+    {...props}
+    initialValue={
+      getGlobalSetting<string[]>(props.settingKeys) ?? props.initialValue
+    }
+    {...globalAccessors.multiText}
+  />
 );
 
 export const PersonalTextPanel = ({ setter, ...props }: TextWrapperProps) => (
-  <BaseTextPanel {...props} setter={setter ?? personalAccessors.text.setter} />
+  <BaseTextPanel
+    {...props}
+    initialValue={
+      getPersonalSetting<string>(props.settingKeys) ?? props.initialValue
+    }
+    setter={setter ?? personalAccessors.text.setter}
+  />
 );
 
 export const PersonalFlagPanel = (props: FlagWrapperProps) => (
-  <BaseFlagPanel {...props} {...personalAccessors.flag} />
+  <BaseFlagPanel
+    {...props}
+    initialValue={
+      getPersonalSetting<boolean>(props.settingKeys) ?? props.initialValue
+    }
+    {...personalAccessors.flag}
+  />
 );
 
 export const PersonalNumberPanel = ({
@@ -575,16 +619,31 @@ export const PersonalNumberPanel = ({
 }: NumberWrapperProps) => (
   <BaseNumberPanel
     {...props}
+    initialValue={
+      getPersonalSetting<number>(props.settingKeys) ?? props.initialValue
+    }
     setter={setter ?? personalAccessors.number.setter}
   />
 );
 
 export const PersonalSelectPanel = (props: SelectWrapperProps) => (
-  <BaseSelectPanel {...props} {...personalAccessors.text} />
+  <BaseSelectPanel
+    {...props}
+    initialValue={
+      getPersonalSetting<string>(props.settingKeys) ?? props.initialValue
+    }
+    {...personalAccessors.text}
+  />
 );
 
 export const PersonalMultiTextPanel = (props: MultiTextWrapperProps) => (
-  <BaseMultiTextPanel {...props} {...personalAccessors.multiText} />
+  <BaseMultiTextPanel
+    {...props}
+    initialValue={
+      getPersonalSetting<string[]>(props.settingKeys) ?? props.initialValue
+    }
+    {...personalAccessors.multiText}
+  />
 );
 
 const createDiscourseNodeSetter =
@@ -610,7 +669,14 @@ export const DiscourseNodeTextPanel = ({
     error?: string;
     onChange?: (value: string) => void;
   }) => (
-  <BaseTextPanel {...props} setter={createDiscourseNodeSetter(nodeType)} />
+  <BaseTextPanel
+    {...props}
+    initialValue={
+      getDiscourseNodeSetting<string>(nodeType, props.settingKeys) ??
+      props.initialValue
+    }
+    setter={createDiscourseNodeSetter(nodeType)}
+  />
 );
 
 export const DiscourseNodeFlagPanel = ({
@@ -623,7 +689,14 @@ export const DiscourseNodeFlagPanel = ({
     onBeforeChange?: (checked: boolean) => Promise<boolean>;
     onChange?: (checked: boolean) => void;
   }) => (
-  <BaseFlagPanel {...props} setter={createDiscourseNodeSetter(nodeType)} />
+  <BaseFlagPanel
+    {...props}
+    initialValue={
+      getDiscourseNodeSetting<boolean>(nodeType, props.settingKeys) ??
+      props.initialValue
+    }
+    setter={createDiscourseNodeSetter(nodeType)}
+  />
 );
 
 export const DiscourseNodeSelectPanel = ({
@@ -631,7 +704,14 @@ export const DiscourseNodeSelectPanel = ({
   ...props
 }: DiscourseNodeBaseProps &
   RoamBlockSyncProps & { options: string[]; initialValue?: string }) => (
-  <BaseSelectPanel {...props} setter={createDiscourseNodeSetter(nodeType)} />
+  <BaseSelectPanel
+    {...props}
+    initialValue={
+      getDiscourseNodeSetting<string>(nodeType, props.settingKeys) ??
+      props.initialValue
+    }
+    setter={createDiscourseNodeSetter(nodeType)}
+  />
 );
 
 export const DiscourseNodeNumberPanel = ({
@@ -643,5 +723,12 @@ export const DiscourseNodeNumberPanel = ({
     min?: number;
     max?: number;
   }) => (
-  <BaseNumberPanel {...props} setter={createDiscourseNodeSetter(nodeType)} />
+  <BaseNumberPanel
+    {...props}
+    initialValue={
+      getDiscourseNodeSetting<number>(nodeType, props.settingKeys) ??
+      props.initialValue
+    }
+    setter={createDiscourseNodeSetter(nodeType)}
+  />
 );
diff --git a/apps/roam/src/components/settings/utils/accessors.ts b/apps/roam/src/components/settings/utils/accessors.ts
index cc5a0844f..ed5b116d3 100644
--- a/apps/roam/src/components/settings/utils/accessors.ts
+++ b/apps/roam/src/components/settings/utils/accessors.ts
@@ -3,9 +3,15 @@ import getBlockProps, {
   type json,
 } from "~/utils/getBlockProps";
 import setBlockProps from "~/utils/setBlockProps";
+import getBasicTreeByParentUid from "roamjs-components/queries/getBasicTreeByParentUid";
 import getBlockUidByTextOnPage from "roamjs-components/queries/getBlockUidByTextOnPage";
 import getPageUidByPageTitle from "roamjs-components/queries/getPageUidByPageTitle";
+import { getSubTree } from "roamjs-components/util";
+import getSettingValueFromTree from "roamjs-components/util/getSettingValueFromTree";
 import internalError from "~/utils/internalError";
+import { getSetting } from "~/utils/extensionSettings";
+import { getFormattedConfigTree } from "~/utils/discourseConfigRef";
+import { roamNodeToCondition } from "~/utils/parseQuery";
 import { z } from "zod";
 
 import {
@@ -106,6 +112,20 @@ const getSchemaAtPath = (
 const formatSettingPath = (keys: string[]): string =>
   keys.length === 0 ? "(root)" : keys.join(" > ");
 
+const readPathValue = (root: unknown, keys: string[]): unknown =>
+  keys.reduce<unknown>((current, key) => {
+    if (Array.isArray(current)) {
+      const index = Number(key);
+      return Number.isInteger(index) && index >= 0 && index < current.length
+        ? current[index]
+        : undefined;
+    }
+    if (!isRecord(current) || !(key in current)) return undefined;
+    return current[key];
+  }, root);
+
+const pathKey = (keys: string[]): string => keys.join("::");
+
 const validateSettingValue = ({
   schema,
   keys,
@@ -142,6 +162,367 @@ const validateSettingValue = ({
   return true;
 };
 
+const DEFAULT_PERSONAL_SETTINGS = PersonalSettingsSchema.parse({});
+const DEFAULT_GLOBAL_SETTINGS = GlobalSettingsSchema.parse({});
+const DEFAULT_LEGACY_QUERY = {
+  conditions: [],
+  selections: [],
+  custom: "",
+  returnNode: "node",
+};
+
+const PERSONAL_SCHEMA_PATH_TO_LEGACY_KEY = new Map<string, string>([
+  [pathKey(["Discourse context overlay"]), "discourse-context-overlay"],
+  [pathKey(["Suggestive mode overlay"]), "suggestive-mode-overlay"],
+  [pathKey(["Text selection popup"]), "text-selection-popup"],
+  [pathKey(["Disable sidebar open"]), "disable-sidebar-open"],
+  [pathKey(["Page preview"]), "page-preview"],
+  [pathKey(["Hide feedback button"]), "hide-feedback-button"],
+  [pathKey(["Auto canvas relations"]), "auto-canvas-relations"],
+  [pathKey(["Overlay in canvas"]), "discourse-context-overlay-in-canvas"],
+  [pathKey(["Streamline styling"]), "streamline-styling"],
+  [pathKey(["Disable product diagnostics"]), "disallow-diagnostics"],
+  [pathKey(["Discourse tool shortcut"]), "discourse-tool-shortcut"],
+  [pathKey(["Personal node menu trigger"]), "personal-node-menu-trigger"],
+  [pathKey(["Node search menu trigger"]), "node-search-trigger"],
+  [pathKey(["Query", "Hide query metadata"]), "hide-metadata"],
+  [pathKey(["Query", "Default page size"]), "default-page-size"],
+  [pathKey(["Query", "Query pages"]), "query-pages"],
+  [pathKey(["Query", "Default filters"]), "default-filters"],
+]);
+
+const getLegacyPersonalLeftSidebarSetting = (): unknown[] => {
+  const settings = getFormattedConfigTree();
+
+  /* eslint-disable @typescript-eslint/naming-convention */
+  return settings.leftSidebar.personal.sections.map((section) => ({
+    name: section.text,
+    Children: (section.children || []).map((child) => ({
+      uid: child.uid,
+      Alias: child.alias?.value || "",
+    })),
+    Settings: {
+      "Truncate-result?": section.settings?.truncateResult.value ?? 75,
+      Folded: section.settings?.folded.value ?? false,
+    },
+  }));
+  /* eslint-enable @typescript-eslint/naming-convention */
+};
+
+const getLegacyPersonalSetting = (keys: string[]): unknown => {
+  if (keys.length === 0) return undefined;
+
+  const mappedOldKey = PERSONAL_SCHEMA_PATH_TO_LEGACY_KEY.get(pathKey(keys));
+  if (mappedOldKey) {
+    return getSetting<unknown>(
+      mappedOldKey,
+      readPathValue(DEFAULT_PERSONAL_SETTINGS, keys),
+    );
+  }
+
+  if (keys.length === 1 && keys[0] === "Query") {
+    const querySettings: Record<string, unknown> = {};
+    querySettings["Hide query metadata"] = getLegacyPersonalSetting([
+      "Query",
+      "Hide query metadata",
+    ]);
+    querySettings["Default page size"] = getLegacyPersonalSetting([
+      "Query",
+      "Default page size",
+    ]);
+    querySettings["Query pages"] = getLegacyPersonalSetting([
+      "Query",
+      "Query pages",
+    ]);
+    querySettings["Default filters"] = getLegacyPersonalSetting([
+      "Query",
+      "Default filters",
+    ]);
+    return querySettings;
+  }
+
+  if (keys[0] === "Left sidebar") {
+    const leftSidebarSettings = getLegacyPersonalLeftSidebarSetting();
+    if (keys.length === 1) return leftSidebarSettings;
+    return readPathValue(leftSidebarSettings, keys.slice(1));
+  }
+
+  return undefined;
+};
+
+// NOTE(ENG-1469): This returns the block props schema shape (Record<uid, {label, source,
+// destination, complement, ifConditions}>). Runtime consumers use getDiscourseRelations()
+// which returns a flat DiscourseRelation[] with a different structure (one entry per
+// if-block, triples at top level, no nodePositions). When migrating getDiscourseRelations()
+// to read from block props, it will need a conversion from this shape to the flat array.
+const getLegacyRelationsSetting = (): Record<string, unknown> => {
+  const settingsUid = getPageUidByPageTitle(DG_BLOCK_PROP_SETTINGS_PAGE_TITLE);
+  if (!settingsUid) return DEFAULT_GLOBAL_SETTINGS.Relations;
+
+  const configTree = getBasicTreeByParentUid(settingsUid);
+  const grammarChildren = getSubTree({
+    tree: configTree,
+    key: "grammar",
+  }).children;
+  const relationNodes = getSubTree({
+    tree: grammarChildren,
+    key: "relations",
+  }).children;
+  if (relationNodes.length === 0) return DEFAULT_GLOBAL_SETTINGS.Relations;
+
+  return Object.fromEntries(
+    relationNodes.map((relationNode) => {
+      const relationTree = relationNode.children;
+      const ifBlocks = getSubTree({ tree: relationTree, key: "If" }).children;
+      const ifConditions = ifBlocks.map((ifBlock) => {
+        const blockChildren = ifBlock.children;
+        const nodePositionsNode = blockChildren.find((c) =>
+          /node positions/i.test(c.text),
+        );
+        const triples = blockChildren
+          .filter((c) => !/node positions/i.test(c.text))
+          .map(
+            (c) =>
+              [
+                c.text,
+                c.children[0]?.text || "",
+                c.children[0]?.children[0]?.text || "",
+              ] as [string, string, string],
+          );
+        const nodePositions = Object.fromEntries(
+          (nodePositionsNode?.children || []).map((c) => [
+            c.text,
+            c.children[0]?.text || "",
+          ]),
+        );
+        return { triples, nodePositions };
+      });
+
+      return [
+        relationNode.uid || relationNode.text,
+        {
+          label: relationNode.text,
+          source: getSettingValueFromTree({
+            tree: relationTree,
+            key: "Source",
+          }),
+          destination: getSettingValueFromTree({
+            tree: relationTree,
+            key: "Destination",
+          }),
+          complement: getSettingValueFromTree({
+            tree: relationTree,
+            key: "Complement",
+          }),
+          ifConditions,
+        },
+      ];
+    }),
+  );
+};
+
+// Reconstructs global settings from getFormattedConfigTree() shape to match block-props schema shape
+const getLegacyGlobalSetting = (keys: string[]): unknown => {
+  if (keys.length === 0) return undefined;
+
+  const settings = getFormattedConfigTree();
+  const firstKey = keys[0];
+
+  if (firstKey === "Trigger") {
+    return settings.trigger.value || DEFAULT_GLOBAL_SETTINGS.Trigger;
+  }
+
+  if (firstKey === "Canvas page format") {
+    return (
+      settings.canvasPageFormat.value ||
+      DEFAULT_GLOBAL_SETTINGS["Canvas page format"]
+    );
+  }
+
+  if (firstKey === "Left sidebar") {
+    const leftSidebarSettings: Record<string, unknown> = {};
+    leftSidebarSettings["Children"] = settings.leftSidebar.global.children.map(
+      (c) => c.text,
+    );
+    const sidebarSettingValues: Record<string, unknown> = {};
+    sidebarSettingValues["Collapsable"] =
+      settings.leftSidebar.global.settings?.collapsable.value ??
+      DEFAULT_GLOBAL_SETTINGS["Left sidebar"].Settings.Collapsable;
+    sidebarSettingValues["Folded"] =
+      settings.leftSidebar.global.settings?.folded.value ??
+      DEFAULT_GLOBAL_SETTINGS["Left sidebar"].Settings.Folded;
+    leftSidebarSettings["Settings"] = sidebarSettingValues;
+    if (keys.length === 1) return leftSidebarSettings;
+    return readPathValue(leftSidebarSettings, keys.slice(1));
+  }
+
+  if (firstKey === "Export") {
+    const exportSettings: Record<string, unknown> = {};
+    exportSettings["Remove special characters"] =
+      settings.export.removeSpecialCharacters.value ??
+      DEFAULT_GLOBAL_SETTINGS.Export["Remove special characters"];
+    exportSettings["Resolve block references"] =
+      settings.export.optsRefs.value ??
+      DEFAULT_GLOBAL_SETTINGS.Export["Resolve block references"];
+    exportSettings["Resolve block embeds"] =
+      settings.export.optsEmbeds.value ??
+      DEFAULT_GLOBAL_SETTINGS.Export["Resolve block embeds"];
+    exportSettings["Append referenced node"] =
+      settings.export.appendRefNodeContext.value ??
+      DEFAULT_GLOBAL_SETTINGS.Export["Append referenced node"];
+    exportSettings["Link type"] =
+      settings.export.linkType.value ||
+      DEFAULT_GLOBAL_SETTINGS.Export["Link type"];
+    exportSettings["Max filename length"] =
+      settings.export.maxFilenameLength.value ??
+      DEFAULT_GLOBAL_SETTINGS.Export["Max filename length"];
+    exportSettings["Frontmatter"] =
+      settings.export.frontmatter.values ??
+      DEFAULT_GLOBAL_SETTINGS.Export.Frontmatter;
+    if (keys.length === 1) return exportSettings;
+    return readPathValue(exportSettings, keys.slice(1));
+  }
+
+  if (firstKey === "Suggestive mode") {
+    const suggestiveModeSettings: Record<string, unknown> = {};
+    suggestiveModeSettings["Include current page relations"] =
+      settings.suggestiveMode.includePageRelations.value ??
+      DEFAULT_GLOBAL_SETTINGS["Suggestive mode"][
+        "Include current page relations"
+      ];
+    suggestiveModeSettings["Include parent and child blocks"] =
+      settings.suggestiveMode.includeParentAndChildren.value ??
+      DEFAULT_GLOBAL_SETTINGS["Suggestive mode"][
+        "Include parent and child blocks"
+      ];
+    suggestiveModeSettings["Page groups"] =
+      settings.suggestiveMode.pageGroups.groups.map((group) => ({
+        name: group.name,
+        pages: group.pages.map((page) => page.name),
+      }));
+    if (keys.length === 1) return suggestiveModeSettings;
+    return readPathValue(suggestiveModeSettings, keys.slice(1));
+  }
+
+  if (firstKey === "Relations") {
+    const relationsSettings = getLegacyRelationsSetting();
+    if (keys.length === 1) return relationsSettings;
+    return readPathValue(relationsSettings, keys.slice(1));
+  }
+
+  return undefined;
+};
+
+const getLegacyQuerySettingByParentUid = (parentUid: string) => {
+  const scratchNode = getSubTree({ parentUid, key: "scratch" });
+  const conditionsNode = getSubTree({
+    tree: scratchNode.children,
+    key: "conditions",
+  });
+  const selectionsNode = getSubTree({
+    tree: scratchNode.children,
+    key: "selections",
+  });
+  const customNode = getSubTree({ tree: scratchNode.children, key: "custom" });
+
+  return {
+    conditions: conditionsNode.children.map(roamNodeToCondition),
+    selections: selectionsNode.children.map((s) => ({
+      text: s.text,
+      label: s.children[0]?.text || "",
+    })),
+    custom: customNode.children[0]?.text || "",
+    returnNode: "node",
+  };
+};
+
+// Reconstructs per-node settings from Roam tree structure to match block-props schema shape
+const getLegacyDiscourseNodeSetting = (
+  nodeType: string,
+  keys: string[],
+): unknown => {
+  let nodeUid = nodeType;
+  let tree = getBasicTreeByParentUid(nodeUid);
+
+  if (tree.length === 0) {
+    const lookedUpUid = getPageUidByPageTitle(
+      `${DISCOURSE_NODE_PAGE_PREFIX}${nodeType}`,
+    );
+    if (lookedUpUid) {
+      nodeUid = lookedUpUid;
+      tree = getBasicTreeByParentUid(nodeUid);
+    }
+  }
+
+  if (tree.length === 0) return undefined;
+
+  const rawCanvas = Object.fromEntries(
+    getSubTree({ tree, key: "canvas" }).children.map((c) => [
+      c.text,
+      c.children[0]?.text || "",
+    ]),
+  );
+  /* eslint-disable @typescript-eslint/naming-convention */
+  const canvasSettings = {
+    color: rawCanvas["color"] || "",
+    alias: rawCanvas["alias"] || "",
+    "key-image": rawCanvas["key-image"] === "true",
+    "key-image-option": rawCanvas["key-image-option"] || "first-image",
+    "query-builder-alias": rawCanvas["query-builder-alias"] || "",
+  };
+  /* eslint-enable @typescript-eslint/naming-convention */
+  const attributes = Object.fromEntries(
+    getSubTree({ tree, key: "Attributes" }).children.map((c) => [
+      c.text,
+      c.children[0]?.text || "",
+    ]),
+  );
+  const overlayUid = getSubTree({ tree, key: "Overlay" }).uid;
+  const suggestiveRulesTree = getSubTree({
+    tree,
+    key: "Suggestive Rules",
+  }).children;
+  const indexUid = getSubTree({ tree, key: "Index" }).uid;
+  const specificationUid = getSubTree({ tree, key: "Specification" }).uid;
+
+  const legacySettings = {
+    type: nodeUid,
+    format: getSettingValueFromTree({ tree, key: "format" }),
+    shortcut: getSettingValueFromTree({ tree, key: "shortcut" }),
+    tag: getSettingValueFromTree({ tree, key: "tag" }),
+    graphOverview: tree.some((c) => c.text === "Graph Overview"),
+    description: getSettingValueFromTree({ tree, key: "description" }),
+    overlay: overlayUid
+      ? getBasicTreeByParentUid(overlayUid)[0]?.text || ""
+      : "",
+    attributes,
+    template: getSubTree({ tree, key: "template" }).children,
+    canvasSettings,
+    suggestiveRules: {
+      embeddingRef:
+        getSubTree({ tree: suggestiveRulesTree, key: "Embedding Block Ref" })
+          .children[0]?.text || "",
+      isFirstChild: !!getSubTree({
+        tree: suggestiveRulesTree,
+        key: "First Child",
+      }).uid,
+    },
+    index: indexUid
+      ? getLegacyQuerySettingByParentUid(indexUid)
+      : DEFAULT_LEGACY_QUERY,
+    specification: {
+      enabled: specificationUid
+        ? !!getSubTree({ parentUid: specificationUid, key: "enabled" }).uid
+        : false,
+      query: specificationUid
+        ? getLegacyQuerySettingByParentUid(specificationUid)
+        : DEFAULT_LEGACY_QUERY,
+    },
+  };
+
+  return readPathValue(legacySettings, keys);
+};
+
 const getBlockPropsByUid = (
   blockUid: string,
   keys: string[],
@@ -312,12 +693,20 @@ export const getGlobalSettings = (): GlobalSettings => {
 export const getGlobalSetting = <T = unknown>(
   keys: string[],
 ): T | undefined => {
-  const settings = getGlobalSettings();
+  if (!isNewSettingsStoreEnabled()) {
+    return getLegacyGlobalSetting(keys) as T | undefined;
+  }
 
-  return keys.reduce<unknown>((current, key) => {
-    if (!isRecord(current) || !(key in current)) return undefined;
-    return current[key];
-  }, settings) as T | undefined;
+  const settings = getGlobalSettings();
+  const blockPropsValue = readPathValue(settings, keys);
+  const legacyValue = getLegacyGlobalSetting(keys);
+  if (JSON.stringify(blockPropsValue) !== JSON.stringify(legacyValue)) {
+    console.warn(
+      `[DG Dual-Read] Mismatch at Global > ${formatSettingPath(keys)}`,
+      { blockProps: blockPropsValue, legacy: legacyValue },
+    );
+  }
+  return blockPropsValue as T | undefined;
 };
 
 export const setGlobalSetting = (keys: string[], value: json): void => {
@@ -368,12 +757,20 @@ export const getPersonalSettings = (): PersonalSettings => {
 export const getPersonalSetting = <T = unknown>(
   keys: string[],
 ): T | undefined => {
-  const settings = getPersonalSettings();
+  if (!isNewSettingsStoreEnabled()) {
+    return getLegacyPersonalSetting(keys) as T | undefined;
+  }
 
-  return keys.reduce<unknown>((current, key) => {
-    if (!isRecord(current) || !(key in current)) return undefined;
-    return current[key];
-  }, settings) as T | undefined;
+  const settings = getPersonalSettings();
+  const blockPropsValue = readPathValue(settings, keys);
+  const legacyValue = getLegacyPersonalSetting(keys);
+  if (JSON.stringify(blockPropsValue) !== JSON.stringify(legacyValue)) {
+    console.warn(
+      `[DG Dual-Read] Mismatch at Personal > ${formatSettingPath(keys)}`,
+      { blockProps: blockPropsValue, legacy: legacyValue },
+    );
+  }
+  return blockPropsValue as T | undefined;
 };
 
 export const setPersonalSetting = (keys: string[], value: json): void => {
@@ -404,9 +801,7 @@ export const setPersonalSetting = (keys: string[], value: json): void => {
   });
 };
 
-export const getDiscourseNodeSettings = (
-  nodeType: string,
-): DiscourseNodeSettings | undefined => {
+const getRawDiscourseNodeBlockProps = (nodeType: string): json | undefined => {
   let pageUid = nodeType;
   let blockProps = getBlockPropsByUid(pageUid, []);
 
@@ -420,6 +815,13 @@ export const getDiscourseNodeSettings = (
     }
   }
 
+  return blockProps;
+};
+
+export const getDiscourseNodeSettings = (
+  nodeType: string,
+): DiscourseNodeSettings | undefined => {
+  const blockProps = getRawDiscourseNodeBlockProps(nodeType);
   if (!blockProps) return undefined;
 
   const result = DiscourseNodeSchema.safeParse(blockProps);
@@ -439,14 +841,20 @@ export const getDiscourseNodeSetting = <T = unknown>(
   nodeType: string,
   keys: string[],
 ): T | undefined => {
-  const settings = getDiscourseNodeSettings(nodeType);
-
-  if (!settings) return undefined;
+  if (!isNewSettingsStoreEnabled()) {
+    return getLegacyDiscourseNodeSetting(nodeType, keys) as T | undefined;
+  }
 
-  return keys.reduce<unknown>((current, key) => {
-    if (!isRecord(current) || !(key in current)) return undefined;
-    return current[key];
-  }, settings) as T | undefined;
+  const settings = getDiscourseNodeSettings(nodeType);
+  const blockPropsValue = settings ? readPathValue(settings, keys) : undefined;
+  const legacyValue = getLegacyDiscourseNodeSetting(nodeType, keys);
+  if (JSON.stringify(blockPropsValue) !== JSON.stringify(legacyValue)) {
+    console.warn(
+      `[DG Dual-Read] Mismatch at Discourse Node (${nodeType}) > ${formatSettingPath(keys)}`,
+      { blockProps: blockPropsValue, legacy: legacyValue },
+    );
+  }
+  return blockPropsValue as T | undefined;
 };
 
 export const setDiscourseNodeSetting = (
diff --git a/apps/roam/src/components/settings/utils/pullWatchers.ts b/apps/roam/src/components/settings/utils/pullWatchers.ts
index 81026957c..1b20c113a 100644
--- a/apps/roam/src/components/settings/utils/pullWatchers.ts
+++ b/apps/roam/src/components/settings/utils/pullWatchers.ts
@@ -84,16 +84,25 @@ const addPullWatch = (
   watches.push([pattern, entityId, callback]);
 };
 
+let leftSidebarFlagHandler: ((newValue: boolean) => void) | null = null;
+export const setLeftSidebarFlagHandler = (
+  handler: (newValue: boolean) => void,
+) => {
+  leftSidebarFlagHandler = handler;
+};
+
 export const featureFlagHandlers: Partial<
   Record<
     keyof FeatureFlags,
     (newValue: boolean, oldValue: boolean, allFlags: FeatureFlags) => void
   >
 > = {
-  // Add handlers as needed:
-  // "Enable Left Sidebar": (newValue) => { ... },
-  // "Suggestive Mode Enabled": (newValue) => { ... },
-  // "Reified Relation Triples": (newValue) => { ... },
+  /* eslint-disable @typescript-eslint/naming-convention */
+  "Enable left sidebar": (newValue, oldValue) => {
+    if (newValue === oldValue) return;
+    leftSidebarFlagHandler?.(newValue);
+  },
+  /* eslint-enable @typescript-eslint/naming-convention */
 };
 
 type GlobalSettingsHandlers = {
@@ -122,30 +131,8 @@ type PersonalSettingsHandlers = {
 };
 
 export const personalSettingsHandlers: PersonalSettingsHandlers = {
-  // "Left Sidebar" stub for testing with stubSetLeftSidebarPersonalSections() in accessors.ts
-  /* eslint-disable @typescript-eslint/naming-convention */
-  "Left sidebar": (newValue, oldValue) => {
-    const oldSections = Object.keys(oldValue || {});
-    const newSections = Object.keys(newValue || {});
-
-    if (newSections.length === 0 && oldSections.length === 0) return;
-
-    console.group("👤 [PullWatch] Personal Settings Changed: Left Sidebar");
-    console.log("Old value:", JSON.stringify(oldValue, null, 2));
-    console.log("New value:", JSON.stringify(newValue, null, 2));
-
-    const addedSections = newSections.filter((s) => !oldSections.includes(s));
-    const removedSections = oldSections.filter((s) => !newSections.includes(s));
-
-    if (addedSections.length > 0) {
-      console.log("  → Sections added:", addedSections);
-    }
-    if (removedSections.length > 0) {
-      console.log("  → Sections removed:", removedSections);
-    }
-    console.groupEnd();
-  },
-  /* eslint-enable @typescript-eslint/naming-convention */
+  // Add handlers as needed:
+  // "Left sidebar": (newValue) => { ... },
 };
 
 export const discourseNodeHandlers: Array<
diff --git a/apps/roam/src/components/settings/utils/zodSchema.example.ts b/apps/roam/src/components/settings/utils/zodSchema.example.ts
index 2e6bfa960..7a9041666 100644
--- a/apps/roam/src/components/settings/utils/zodSchema.example.ts
+++ b/apps/roam/src/components/settings/utils/zodSchema.example.ts
@@ -404,9 +404,9 @@ const defaultPersonalSettings: PersonalSettings = {
   "Auto canvas relations": false,
   "Disable product diagnostics": false,
   Query: {
-    "Hide query metadata": false,
+    "Hide query metadata": true,
     "Default page size": 10,
-    "Query pages": [],
+    "Query pages": ["discourse-graph/queries/*"],
     "Default filters": {},
   },
 };
diff --git a/apps/roam/src/components/settings/utils/zodSchema.ts b/apps/roam/src/components/settings/utils/zodSchema.ts
index 8c8486ed7..212c09e21 100644
--- a/apps/roam/src/components/settings/utils/zodSchema.ts
+++ b/apps/roam/src/components/settings/utils/zodSchema.ts
@@ -95,6 +95,19 @@ const booleanWithDefault = (defaultVal: boolean) =>
     .optional()
     .transform((val) => val ?? defaultVal);
 
+const defaultNodeIndex = () => ({
+  conditions: [] as {
+    type: string;
+    relation: string;
+    source: string;
+    uid: string;
+    not: boolean;
+  }[],
+  selections: [] as { text: string; label: string }[],
+  custom: "",
+  returnNode: "node",
+});
+
 export const DiscourseNodeSchema = z.object({
   text: z.string(),
   type: z.string(),
@@ -109,13 +122,7 @@ export const DiscourseNodeSchema = z.object({
     })
     .nullable()
     .optional()
-    .transform(
-      (val) =>
-        val ?? {
-          enabled: false,
-          query: { conditions: [], selections: [], custom: "", returnNode: "" },
-        },
-    ),
+    .transform((val) => val ?? { enabled: false, query: defaultNodeIndex() }),
   template: z
     .array(RoamNodeSchema)
     .nullable()
@@ -129,7 +136,9 @@ export const DiscourseNodeSchema = z.object({
     .optional()
     .transform((val) => val ?? {}),
   overlay: stringWithDefault(""),
-  index: IndexSchema.nullable().optional(),
+  index: IndexSchema.nullable()
+    .optional()
+    .transform((val) => val ?? defaultNodeIndex()),
   suggestiveRules: SuggestiveRulesSchema.default({}),
   backedBy: z
     .enum(["user", "default", "relation"])
@@ -230,9 +239,9 @@ export const StoredFiltersSchema = z.object({
 });
 
 export const QuerySettingsSchema = z.object({
-  "Hide query metadata": z.boolean().default(false),
+  "Hide query metadata": z.boolean().default(true),
   "Default page size": z.number().default(10),
-  "Query pages": z.array(z.string()).default([]),
+  "Query pages": z.array(z.string()).default(["discourse-graph/queries/*"]),
   "Default filters": z.record(z.string(), StoredFiltersSchema).default({}),
 });
 
diff --git a/apps/roam/src/index.ts b/apps/roam/src/index.ts
index 0579784c3..a6d0e813e 100644
--- a/apps/roam/src/index.ts
+++ b/apps/roam/src/index.ts
@@ -1,3 +1,4 @@
+import ReactDOM from "react-dom";
 import { addStyle } from "roamjs-components/dom";
 import { render as renderToast } from "roamjs-components/components/Toast";
 import { runExtension } from "roamjs-components/util";
@@ -42,6 +43,12 @@ import {
   DISALLOW_DIAGNOSTICS,
 } from "./data/userSettings";
 import { initSchema } from "./components/settings/utils/init";
+import {
+  setupPullWatchOnSettingsPage,
+  setLeftSidebarFlagHandler,
+} from "./components/settings/utils/pullWatchers";
+import { mountLeftSidebar } from "./components/LeftSidebarView";
+
 export const DEFAULT_CANVAS_PAGE_FORMAT = "Canvas/*";
 
 export default runExtension(async (onloadArgs) => {
@@ -154,7 +161,28 @@ export default runExtension(async (onloadArgs) => {
     });
   }
 
-  await initSchema();
+  // Register left sidebar flag handler before pull watchers start
+  setLeftSidebarFlagHandler((enabled) => {
+    const wrapper = document.querySelector<HTMLDivElement>(
+      ".starred-pages-wrapper",
+    );
+    if (!wrapper) return;
+    if (enabled) {
+      wrapper.style.padding = "0";
+      void mountLeftSidebar(wrapper, onloadArgs);
+    } else {
+      const root = wrapper.querySelector("#dg-left-sidebar-root");
+      if (root) {
+        // eslint-disable-next-line react/no-deprecated
+        ReactDOM.unmountComponentAtNode(root);
+        root.remove();
+      }
+      wrapper.style.padding = "";
+    }
+  });
+
+  const { blockUids } = await initSchema();
+  const cleanupPullWatchers = setupPullWatchOnSettingsPage(blockUids);
 
   return {
     elements: [
@@ -166,6 +194,7 @@ export default runExtension(async (onloadArgs) => {
     ],
     observers: observers,
     unload: () => {
+      cleanupPullWatchers();
       setSyncActivity(false);
       window.roamjs.extension?.smartblocks?.unregisterCommand("QUERYBUILDER");
       // @ts-expect-error - tldraw throws a warning on multiple loads
diff --git a/apps/roam/src/utils/initializeObserversAndListeners.ts b/apps/roam/src/utils/initializeObserversAndListeners.ts
index 4f2a3fa68..54feb24ff 100644
--- a/apps/roam/src/utils/initializeObserversAndListeners.ts
+++ b/apps/roam/src/utils/initializeObserversAndListeners.ts
@@ -54,6 +54,7 @@ import { formatHexColor } from "~/components/settings/DiscourseNodeCanvasSetting
 import { getSetting } from "./extensionSettings";
 import { mountLeftSidebar } from "~/components/LeftSidebarView";
 import { getUidAndBooleanSetting } from "./getExportSettings";
+import { getFeatureFlag } from "~/components/settings/utils/accessors";
 import { getCleanTagText } from "~/components/settings/NodeConfig";
 import getPleasingColors from "@repo/utils/getPleasingColors";
 import { colord } from "colord";
@@ -275,10 +276,7 @@ export const initObservers = async ({
     className: "starred-pages-wrapper",
     callback: (el) => {
       void (async () => {
-        const isLeftSidebarEnabled = getUidAndBooleanSetting({
-          tree: configTree,
-          text: "(BETA) Left Sidebar",
-        }).value;
+        const isLeftSidebarEnabled = getFeatureFlag("Enable left sidebar");
         const container = el as HTMLDivElement;
         if (isLeftSidebarEnabled) {
           container.style.padding = "0";