/* Shared by all three standalone page shells (layout.html, landing.html,
   public_note.html): base body styling, code/table rendering, and Mermaid
   diagram/error boxes. Anything shell-specific (header layout, main's own
   padding/max-width) stays in each shell's own <style> block. */
body { font-family: sans-serif; margin: 0; background: var(--bg); color: var(--fg); }
/* Form controls don't inherit the page's font by default in any browser —
   they use their own separate (and smaller than 16px) user-agent default
   unless told otherwise. Below 16px, iOS Safari auto-zooms the whole page
   on focus, which is jarring in an installed app with no browser chrome
   to show you what just happened. 16px also happens to fix a second,
   unrelated cosmetic issue: without this, every input/button/select here
   was rendering in the browser's generic system font instead of this
   page's own sans-serif. A few elements (the note title, the quick-
   switcher box) already set their own larger, more specific font-size for
   layout reasons and are unaffected by this — this only fills in the gap
   for everything that had no explicit size at all. */
input, button, textarea, select { font-family: inherit; font-size: 16px; }
pre { background: var(--bg-secondary); padding: 0.8em; border-radius: 4px; overflow-x: auto; }
code { background: var(--bg-secondary); padding: 0.15em 0.35em; border-radius: 3px; font-family: monospace; }
pre code { background: none; padding: 0; border-radius: 0; }
table { border-collapse: collapse; margin: 0.5em 0; display: block; max-width: 100%; overflow-x: auto; }
th, td { border: 1px solid var(--border); padding: 0.3em 0.6em; text-align: left; }
th { background: var(--bg-secondary); }
.mermaid-diagram { background: var(--bg-secondary); border-radius: 4px; padding: 1em; text-align: center; overflow-x: auto; }
.mermaid-error { background: var(--bg-secondary); border-left: 3px solid var(--accent); padding: 0.6em 1em; color: var(--muted); font-family: monospace; font-size: 0.9em; }
/* A [[wikilink]] that didn't resolve to a note renders as a link to
   /search?q=... instead (see ExpandWikilinks) rather than failing or
   showing as plain text — this just makes that fallback visually distinct
   from a real note link, wherever rendered note content appears. */
a[href^="/search?q="] { text-decoration: underline dashed; color: var(--muted); }
/* The "Root › Ideas › Genius Ideas" trail on note.html/folder.html (see
   the shared "breadcrumb" template in layout.html) — muted like other
   secondary metadata (.meta, .tagline), with the final, unlinked segment
   (the current page itself) in the normal text color so it's clearly
   distinct from the clickable ancestors before it. */
.breadcrumb { color: var(--muted); font-size: 0.9em; margin-bottom: 0.5em; }
.breadcrumb a { color: var(--muted); }
.breadcrumb-current { color: var(--fg); }