/* Wikilink inline content — color is set via inline style per note type */ .wikilink { cursor: pointer; text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 2px; border-radius: 2px; padding: 0 1px; } .wikilink:hover { text-decoration-style: solid; opacity: 0.85; } /* Broken wikilink: dashed underline + lower opacity */ .wikilink--broken { text-decoration-style: dashed; opacity: 0.7; } .wikilink--broken:hover { opacity: 0.55; } /* BlockNote container */ .editor__blocknote-container { flex: 1; min-height: 0; overflow-y: auto; display: flex; justify-content: center; position: relative; } /* Drag-over state: subtle border highlight */ .editor__blocknote-container--drag-over { outline: 2px dashed var(--primary, #155DFF); outline-offset: -2px; } /* Drop overlay shown when dragging images over the editor */ .editor__drop-overlay { position: absolute; inset: 0; z-index: 100; display: flex; align-items: center; justify-content: center; background: rgba(21, 93, 255, 0.06); pointer-events: none; } .editor__drop-overlay-label { padding: 10px 20px; border-radius: 8px; background: var(--background, #fff); color: var(--primary, #155DFF); font-size: 14px; font-weight: 500; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); } .editor__blocknote-container .bn-container { width: 100%; height: 100%; background: var(--bg-primary); color: var(--text-primary); font-size: 15px; } .editor__blocknote-container .bn-editor { width: 100%; padding: 20px 40px; max-width: 760px; margin: 0 auto; } /* ============================================= Bear-style live preview: zero horizontal shift ============================================= */ /* FIX 1: Remove header underlines */ .cm-heading-line { border-bottom: none !important; text-decoration: none !important; } /* FIX 2: Heading markers in left gutter area The ## markers are absolutely positioned in the content's left padding (40px), so they never affect text flow — zero horizontal shift. */ .cm-heading-line { position: relative; } .cm-heading-line .cm-formatting-block { position: absolute !important; top: 50%; transform: translateY(-50%); right: 100%; padding-right: 4px; font-size: 0.75rem !important; line-height: 1; opacity: 0; transition: opacity 0.15s ease-out !important; white-space: nowrap; pointer-events: none; color: var(--text-faint); } .cm-heading-line .cm-formatting-block.cm-formatting-block-visible { font-size: 0.75rem !important; opacity: 0.5; pointer-events: auto; } /* FIX 3: List/block bullets — always visible, fixed width, zero shift Override the library's font-size animation so the marker always occupies the same space regardless of cursor position. */ .cm-line:not(.cm-heading-line) .cm-formatting-block { font-size: 1em !important; display: inline-block !important; min-width: 1.5em !important; vertical-align: baseline; transition: color 0.15s ease-out, opacity 0.15s ease-out !important; } /* Inactive state: hide source text, show bullet dot via ::before */ .cm-line:not(.cm-heading-line) .cm-formatting-block:not(.cm-formatting-block-visible) { color: transparent !important; opacity: 1 !important; position: relative; overflow: visible !important; } .cm-line:not(.cm-heading-line) .cm-formatting-block:not(.cm-formatting-block-visible)::before { content: '\2022'; position: absolute; left: 0; color: var(--text-tertiary); } /* Active state: show source marker (-, *, +, etc.) */ .cm-line:not(.cm-heading-line) .cm-formatting-block.cm-formatting-block-visible { color: var(--text-faint) !important; opacity: 1 !important; }