/*
 * DataLord Design System — calm, document-first interface inspired by Notion.
 * Component rules are documented in DESIGN_SYSTEM.md.
 */
:root {
  color-scheme: light;
  --color-canvas:#fff;--color-sidebar:#f7f7f5;--color-surface:#fff;
  --color-hover:rgba(55,53,47,.06);--color-active:rgba(55,53,47,.09);
  --color-selected:rgba(35,131,226,.10);--color-text:#37352f;
  --color-secondary:rgba(55,53,47,.65);--color-tertiary:rgba(55,53,47,.45);
  --color-border:rgba(55,53,47,.16);--color-border-soft:rgba(55,53,47,.09);
  --color-focus:#2383e2;--color-primary:#37352f;--color-primary-hover:#2f2d29;
  --color-danger:#d44c47;--color-danger-bg:rgba(212,76,71,.10);
  --bg:var(--color-canvas);--panel:var(--color-sidebar);--surface:var(--color-surface);
  --surface2:var(--color-hover);--text:var(--color-text);--muted:var(--color-secondary);
  --line:var(--color-border);--accent:var(--color-focus);--accent2:#1b6fbd;--danger:var(--color-danger);
  --font-sans:ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;
  --text-xs:11px;--text-sm:12px;--text-md:14px;--text-lg:16px;--text-xl:20px;
  --text-2xl:28px;--text-title:40px;--line-tight:1.25;--line-normal:1.5;--line-reading:1.7;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;
  --s8:32px;--s10:40px;--s12:48px;--s16:64px;
  --r-sm:4px;--r-md:6px;--r-lg:8px;--r-xl:12px;
  --shadow-popover:0 4px 18px rgba(15,15,15,.12),0 0 0 1px rgba(15,15,15,.04);
  --shadow-modal:0 14px 44px rgba(15,15,15,.20),0 0 0 1px rgba(15,15,15,.06);
  --control-sm:28px;--control-md:32px;--control-lg:36px;
  --sidebar-width:240px;--folder-picker-width:200px;--topbar-height:48px;--editor-tools-top:96px;
  font-family:var(--font-sans);font-size:var(--text-md);
}
@media(prefers-color-scheme:dark){:root{color-scheme:dark;--color-canvas:#1d1629;--color-sidebar:#251c35;--color-surface:#2d2240;--color-hover:rgba(224,213,255,.07);--color-active:rgba(224,213,255,.12);--color-selected:rgba(167,139,250,.22);--color-text:#f3effa;--color-secondary:rgba(243,239,250,.66);--color-tertiary:rgba(243,239,250,.43);--color-border:rgba(224,213,255,.16);--color-border-soft:rgba(224,213,255,.09);--color-focus:#a78bfa;--color-primary:#f3effa;--color-primary-hover:#fff;--color-danger:#ff8581;--color-danger-bg:rgba(255,133,129,.13);--shadow-popover:0 4px 20px rgba(8,4,16,.48),0 0 0 1px rgba(224,213,255,.09);--shadow-modal:0 16px 48px rgba(8,4,16,.62),0 0 0 1px rgba(224,213,255,.10)}}
:root[data-theme=light]{color-scheme:light;--color-canvas:#fff;--color-sidebar:#f7f7f5;--color-surface:#fff;--color-hover:rgba(55,53,47,.06);--color-active:rgba(55,53,47,.09);--color-selected:rgba(35,131,226,.10);--color-text:#37352f;--color-secondary:rgba(55,53,47,.65);--color-tertiary:rgba(55,53,47,.45);--color-border:rgba(55,53,47,.16);--color-border-soft:rgba(55,53,47,.09);--color-primary:#37352f;--color-primary-hover:#2f2d29;--shadow-popover:0 4px 18px rgba(15,15,15,.12),0 0 0 1px rgba(15,15,15,.04);--shadow-modal:0 14px 44px rgba(15,15,15,.20),0 0 0 1px rgba(15,15,15,.06)}
:root[data-theme=dark]{color-scheme:dark;--color-canvas:#1d1629;--color-sidebar:#251c35;--color-surface:#2d2240;--color-hover:rgba(224,213,255,.07);--color-active:rgba(224,213,255,.12);--color-selected:rgba(167,139,250,.22);--color-text:#f3effa;--color-secondary:rgba(243,239,250,.66);--color-tertiary:rgba(243,239,250,.43);--color-border:rgba(224,213,255,.16);--color-border-soft:rgba(224,213,255,.09);--color-focus:#a78bfa;--color-primary:#f3effa;--color-primary-hover:#fff;--color-danger:#ff8581;--color-danger-bg:rgba(255,133,129,.13);--shadow-popover:0 4px 20px rgba(8,4,16,.48),0 0 0 1px rgba(224,213,255,.09);--shadow-modal:0 16px 48px rgba(8,4,16,.62),0 0 0 1px rgba(224,213,255,.10)}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .brand-mark{color:var(--color-canvas);background:var(--color-primary)}}
*{box-sizing:border-box}html,body{min-height:100%}
body{margin:0;background:var(--color-canvas);color:var(--color-text);font-family:var(--font-sans);font-size:var(--text-md);line-height:var(--line-normal);-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit;color:inherit}button{border:0;background:transparent;cursor:pointer}
button,input,select,textarea,[contenteditable=true]{transition:background-color 120ms ease,border-color 120ms ease,color 120ms ease,box-shadow 120ms ease}
:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}::selection{background:color-mix(in srgb,var(--color-focus) 28%,transparent)}.hidden{display:none!important}

/* Shell */
.app{display:grid;grid-template-columns:var(--sidebar-width) minmax(0,1fr);min-height:100vh}main{min-width:0}
.sidebar{position:sticky;top:0;z-index:20;display:flex;flex-direction:column;width:var(--sidebar-width);height:100vh;padding:var(--s2);overflow-y:auto;background:var(--color-sidebar);border-right:1px solid var(--color-border-soft)}
.sidebar header{display:flex;align-items:center;gap:var(--s2);min-height:44px;padding:var(--s1) var(--s2);font-weight:600}
.brand-mark{display:grid;place-items:center;width:52px;height:52px;color:#fff;background:#37352f;border-radius:var(--r-lg);font-size:var(--text-lg);font-weight:700;letter-spacing:-.04em}
:root[data-theme=dark] .brand-mark{color:var(--color-canvas);background:var(--color-primary)}
.brand-mark.small{width:28px;height:28px;border-radius:var(--r-md);font-size:10px}.sidebar nav{display:flex;flex-direction:column}
.sidebar footer{margin-top:auto;padding-top:var(--s2);border-top:1px solid var(--color-border-soft)}
.section-title{display:flex;align-items:center;justify-content:space-between;min-height:30px;padding:var(--s3) var(--s2) var(--s1);color:var(--color-tertiary);font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.folder-row{display:flex;align-items:center}.folder-row>button:first-child{flex:1}.hamburger{display:none}

/* Controls */
.primary{min-height:var(--control-md);padding:6px 12px;color:var(--color-canvas)!important;background:var(--color-primary);border-radius:var(--r-md);font-size:var(--text-sm);font-weight:600}
.primary:hover{background:var(--color-primary-hover)}.full{width:100%;margin:var(--s1) 0 var(--s2);text-align:left}
.nav{display:flex;align-items:center;width:100%;min-height:var(--control-md);margin:1px 0;padding:5px 8px;color:var(--color-secondary);border-radius:var(--r-md);text-align:left;font-size:var(--text-sm)}
.nav:hover{color:var(--color-text);background:var(--color-hover)}.nav.active{color:var(--color-text);background:var(--color-active);font-weight:500}
.icon{display:inline-grid;place-items:center;min-width:var(--control-sm);height:var(--control-sm);padding:0 6px;color:var(--color-secondary);border-radius:var(--r-md)}
.icon:hover{color:var(--color-text);background:var(--color-hover)}
select,input:not([type=checkbox]):not([type=color]),textarea{min-height:var(--control-md);border:1px solid var(--color-border);border-radius:var(--r-md);background:var(--color-surface)}

/* Topbar and search */
.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:center;height:var(--topbar-height);padding:0 var(--s4);background:color-mix(in srgb,var(--color-canvas) 94%,transparent);border-bottom:1px solid var(--color-border-soft);backdrop-filter:blur(12px)}
.search{display:flex;align-items:center;gap:var(--s2);width:min(480px,60vw);height:var(--control-md);padding:0 9px;color:var(--color-secondary);background:var(--color-sidebar);border:1px solid transparent;border-radius:var(--r-md)}
.search:focus-within{background:var(--color-surface);border-color:var(--color-border);box-shadow:0 0 0 2px var(--color-selected)}
.search input{flex:1;min-width:0;min-height:0!important;padding:0;border:0!important;outline:0;background:transparent!important;font-size:var(--text-sm)}
.search kbd{padding:1px 5px;color:var(--color-tertiary);background:var(--color-canvas);border:1px solid var(--color-border);border-radius:var(--r-sm);font:10px/1.4 var(--font-sans)}

/* Gallery */
.content{width:min(1180px,100%);margin:0 auto;padding:var(--s12) var(--s8) var(--s16)}
.page-title{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:var(--s8)}.page-actions{display:flex;align-items:center;gap:var(--s2)}
.page-title h1{margin:var(--s1) 0 0;font-size:var(--text-2xl);line-height:var(--line-tight);font-weight:700;letter-spacing:-.025em}
.eyebrow{margin:0;color:var(--color-tertiary);font-size:10px;font-weight:600;letter-spacing:.08em}
.danger-action{min-height:var(--control-md);padding:6px 10px;color:var(--color-danger);border-radius:var(--r-md);font-size:var(--text-sm);font-weight:500}.danger-action:hover{background:var(--color-danger-bg)}
.folder-tiles,.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--s3);margin-bottom:var(--s8)}
.folder-tile,.note-tile{min-height:112px;padding:var(--s4);overflow:hidden;color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-lg);text-align:left}
.folder-tile{min-height:88px}.folder-tile:hover,.note-tile:hover{background:var(--color-hover);border-color:color-mix(in srgb,var(--color-border) 70%,var(--color-secondary))}
.folder-tile h3,.note-tile h3{margin:var(--s2) 0 var(--s1);overflow:hidden;font-size:var(--text-md);line-height:var(--line-tight);font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.folder-tile small,.note-tile p{display:-webkit-box;margin:var(--s2) 0 0;overflow:hidden;color:var(--color-secondary);font-size:var(--text-sm);line-height:1.55;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.tile-icon{color:var(--color-secondary);font-size:var(--text-lg)}
.chips{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s1)}
.chip{display:inline-flex;align-items:center;min-height:21px;padding:2px 7px;color:#fff;border-radius:999px;font-size:10px;line-height:1}
.empty{padding:88px var(--s5);color:var(--color-secondary);text-align:center}.empty span{color:var(--color-tertiary);font-size:var(--text-2xl)}
.empty h2{margin:var(--s3) 0 var(--s1);color:var(--color-text);font-size:var(--text-lg)}.empty p{margin:0;font-size:var(--text-sm)}

/* Editor */
.editor-top{position:sticky;top:var(--topbar-height);z-index:8;display:flex;align-items:center;height:var(--topbar-height);padding:0 var(--s4);background:color-mix(in srgb,var(--color-canvas) 96%,transparent);border-bottom:1px solid var(--color-border-soft);backdrop-filter:blur(12px)}
.back,.editor-actions button{min-height:var(--control-sm);padding:4px 8px;color:var(--color-secondary);border-radius:var(--r-md);font-size:var(--text-sm)}
.back:hover,.editor-actions button:hover{color:var(--color-text);background:var(--color-hover)}.save-state{margin:0 auto;color:var(--color-tertiary);font-size:var(--text-xs)}
.editor-actions{display:flex;align-items:center;gap:var(--s1)}.editor-actions .danger-text{color:var(--color-danger)}.editor-actions .danger-text:hover{background:var(--color-danger-bg)}
.editor-wrap{width:min(760px,calc(100% - 48px));margin:0 auto;padding:var(--s12) 0 160px}
.title-shell{position:relative}
.title-input{width:100%;min-height:0!important;margin:0;padding:0;color:var(--color-text);background:transparent!important;border:0!important;border-radius:0;outline:0;font-size:var(--text-title);line-height:1.15;font-weight:700;letter-spacing:-.04em}
.title-input::placeholder{color:var(--color-tertiary)}

/* Note metadata */
.note-meta-stack{display:grid;gap:2px;margin-top:var(--s3)}.note-meta-row{display:grid;grid-template-columns:88px minmax(0,1fr);align-items:start;gap:var(--s2);min-height:var(--control-md)}
.note-meta-trigger{display:flex;align-items:center;gap:6px;min-height:var(--control-sm);padding:4px 6px;color:var(--color-secondary);border-radius:var(--r-md);font-size:var(--text-sm);text-align:left}.note-meta-trigger:hover{color:var(--color-text);background:var(--color-hover)}
.note-meta-icon{width:18px;color:var(--color-tertiary);font-weight:600;text-align:center}.note-meta-value{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s1);min-width:0;min-height:var(--control-sm);padding:2px 0}
.folder-picker{position:relative;width:min(100%,var(--folder-picker-width))}.title-folder-picker{position:absolute;top:100%;left:0;z-index:30;width:var(--folder-picker-width);height:0}
.folder-picker-menu{position:absolute;top:4px;left:0;z-index:30;width:var(--folder-picker-width);max-width:calc(100vw - 48px);max-height:280px;padding:4px;overflow-y:auto;background:var(--color-surface);border:1px solid var(--color-border-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-popover)}
.folder-picker-heading{padding:6px 8px 4px;color:var(--color-tertiary);font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.folder-picker-option{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:center;gap:6px;width:100%;min-height:var(--control-md);padding:5px 8px;color:var(--color-secondary);border-radius:var(--r-md);font-size:var(--text-sm);text-align:left}
.folder-picker-option span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.folder-picker-option:hover,.folder-picker-option:focus-visible{color:var(--color-text);background:var(--color-hover);outline:0}
.folder-picker-option.selected{color:#fff;background:#7c6cf2}.folder-picker-option.selected:hover,.folder-picker-option.selected:focus-visible{background:#6d5bd7}
.tags-under .note-meta-value:empty::after{content:"Нет тегов";color:var(--color-tertiary);font-size:var(--text-sm)}.events-under .note-meta-value:empty::after{content:"Нет событий";color:var(--color-tertiary);font-size:var(--text-sm)}
.note-tag,.tag-input-pill{display:inline-flex;align-items:center;min-height:23px;border-radius:999px;font-size:var(--text-xs)}
.note-tag{gap:var(--s1);padding:2px 3px 2px 8px;color:#fff;background:var(--tag-color)}.note-tag button{display:grid;place-items:center;width:17px;height:17px;padding:0;color:rgba(255,255,255,.78);border-radius:50%;font-size:14px;line-height:1}
.note-tag button:hover{color:#fff;background:rgba(0,0,0,.16)}.tag-input-pill{padding:1px 7px;background:var(--color-selected);border:1px solid var(--color-focus)}
.tag-input-pill input{width:88px;min-width:40px;min-height:20px!important;padding:0;border:0!important;outline:0;background:transparent!important;font-size:var(--text-xs)}.tag-input-pill input::placeholder{color:var(--color-tertiary)}
.event-pill{display:inline-flex;align-items:center;max-width:100%;min-height:23px;color:var(--color-text);background:var(--color-selected);border-radius:999px;font-size:var(--text-xs);line-height:1.35}.event-pill:hover{box-shadow:inset 0 0 0 1px var(--color-focus)}
.event-pill-main{display:inline-flex;align-items:center;gap:6px;min-width:0;min-height:23px;padding:2px 4px 2px 7px;font:inherit;line-height:inherit;text-align:left}.event-pill-remove{display:grid;place-items:center;flex:0 0 auto;width:17px;height:17px;margin-right:3px;padding:0;color:var(--color-tertiary);border-radius:50%;font-size:14px;line-height:1}.event-pill-remove:hover{color:var(--color-danger);background:var(--color-danger-bg)}
.event-dot{flex:0 0 auto;width:6px;height:6px;border-radius:50%;background:var(--color-focus)}.event-pill-title{font-weight:500}.event-pill-date{color:var(--color-secondary)}

/* Formatting and document */
.toolbar{position:sticky;top:var(--editor-tools-top);z-index:7;display:flex;flex-wrap:nowrap;align-items:center;gap:1px;width:100%;margin:var(--s6) 0 var(--s2);padding:4px;overflow-x:auto;background:var(--color-surface);border:1px solid var(--color-border-soft);border-radius:var(--r-lg);scrollbar-width:none}
.toolbar::-webkit-scrollbar{display:none}.toolbar button{display:grid;place-items:center;flex:0 0 auto;width:var(--control-sm);min-width:var(--control-sm);height:var(--control-sm);padding:0;color:var(--color-secondary);border-radius:var(--r-sm);font-size:var(--text-md);white-space:nowrap}
.toolbar button:hover{color:var(--color-text);background:var(--color-hover)}.toolbar button:active,.toolbar button.active{color:var(--color-text);background:var(--color-active)}
.toolbar-block-picker{position:relative;flex:0 0 auto}.toolbar .toolbar-type{display:flex;align-items:center;justify-content:space-between;gap:var(--s1);width:auto;min-width:64px;padding:0 var(--s2);font-size:var(--text-sm);font-weight:500}.toolbar-caret{color:var(--color-tertiary);font-size:10px}.toolbar-separator{flex:0 0 auto;width:1px;height:20px;margin:0 3px;background:var(--color-border-soft)}
.toolbar-block-menu{position:absolute;top:calc(100% + 8px);left:-4px;z-index:40;width:var(--folder-picker-width);padding:4px;background:var(--color-surface);border:1px solid var(--color-border-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-popover)}.toolbar .toolbar-block-option{display:flex;align-items:center;justify-content:space-between;width:100%;height:var(--control-md);padding:0 var(--s2);font-size:var(--text-sm);text-align:left}.toolbar-block-option.selected::after{content:"✓";color:var(--color-secondary)}.toolbar.block-menu-open{overflow:visible}
.toolbar-glyph{position:relative;display:inline-grid;width:16px;height:16px}.glyph-list{grid-template-columns:4px 10px;grid-template-rows:repeat(3,4px);align-items:center;gap:1px 2px}.glyph-list i{display:block;width:3px;height:3px;background:currentColor;border-radius:50%}.glyph-list b{display:block;width:10px;height:1px;background:currentColor;border-radius:1px}.glyph-list-ordered i{width:4px;height:4px;background:none;border-radius:0;font:6px/4px var(--font-sans);text-align:center}.toolbar-quote{height:18px;font:600 24px/20px Georgia,serif}.toolbar-code{font:600 10px/1 var(--font-mono);letter-spacing:-.08em}.toolbar-link{font:600 12px/1 var(--font-mono);letter-spacing:-.12em}.glyph-table{border:1px solid currentColor;border-radius:1px;background:linear-gradient(to right,transparent 31%,currentColor 31%,currentColor 37%,transparent 37%,transparent 63%,currentColor 63%,currentColor 69%,transparent 69%),linear-gradient(to bottom,transparent 31%,currentColor 31%,currentColor 37%,transparent 37%,transparent 63%,currentColor 63%,currentColor 69%,transparent 69%)}.glyph-file{width:12px;height:15px;border:1px solid currentColor;border-radius:2px}.glyph-file::before,.glyph-file::after{content:"";position:absolute;left:2px;right:2px;height:1px;background:currentColor}.glyph-file::before{top:5px}.glyph-file::after{top:9px}.toolbar-clear{position:relative;font-weight:500}.toolbar-clear small{position:absolute;right:-5px;bottom:-2px;font-size:9px;font-weight:600}
.rich-editor{min-height:520px;padding:var(--s3) 2px 80px;outline:0;color:var(--color-text);caret-color:var(--color-focus);font-size:var(--text-lg);line-height:var(--line-reading)}
.rich-editor:empty::before{content:attr(data-placeholder);color:var(--color-tertiary);pointer-events:none}.rich-editor p{margin:.45em 0}
.rich-editor h1,.rich-editor h2,.rich-editor h3{margin:1.45em 0 .45em;line-height:var(--line-tight);letter-spacing:-.025em}.rich-editor h1{font-size:1.9em}.rich-editor h2{font-size:1.45em}.rich-editor h3{font-size:1.18em}
.rich-editor ul,.rich-editor ol{margin:.5em 0;padding-left:1.55em}.rich-editor blockquote{margin:1em 0;padding:2px 0 2px var(--s4);color:var(--color-secondary);border-left:3px solid var(--color-border)}
.rich-editor pre{margin:var(--s4) 0;padding:var(--s4);overflow:auto;background:var(--color-sidebar);border-radius:var(--r-lg);font:13px/1.6 var(--font-mono);white-space:pre-wrap}
.rich-editor code{padding:2px 4px;color:#eb5757;background:var(--color-sidebar);border-radius:var(--r-sm);font-family:var(--font-mono);font-size:.86em}
.rich-editor .table-block{position:relative;margin:var(--s5) 0}.rich-editor .table-scroll{width:100%;overflow-x:auto;border:1px solid var(--color-border);border-radius:var(--r-md);scrollbar-width:thin}.rich-editor table{width:100%;margin:var(--s5) 0;overflow:hidden;border:1px solid var(--color-border);border-collapse:separate;border-spacing:0;border-radius:var(--r-md)}.rich-editor .table-scroll table{width:max-content;min-width:100%;margin:0;border:0;border-radius:0}.rich-editor .table-block.table-active .table-scroll{border-color:var(--color-focus);box-shadow:0 0 0 1px var(--color-selected)}
.table-controls{position:absolute;inset:0;z-index:3;display:none;pointer-events:none}.table-active>.table-controls{display:block}.table-handle{position:absolute;display:grid;place-items:center;min-width:24px;height:18px;padding:0 5px;color:var(--color-tertiary);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--r-sm);box-shadow:var(--shadow-popover);font-size:10px;line-height:1;pointer-events:auto}.table-handle:hover{color:var(--color-text);background:var(--color-hover)}.table-handle:disabled{cursor:not-allowed;opacity:.4}.table-column-handle{top:-20px;transform:translateX(-50%)}.table-row-handle{left:-20px;transform:translateY(-50%);font-size:13px}.table-handle-menu{position:absolute;z-index:4;width:var(--folder-picker-width);padding:4px;background:var(--color-surface);border:1px solid var(--color-border-soft);border-radius:var(--r-lg);box-shadow:var(--shadow-popover);pointer-events:auto}.table-handle-menu button{display:block;width:100%;min-height:var(--control-md);padding:5px var(--s2);color:var(--color-secondary);border-radius:var(--r-md);font-size:var(--text-sm);text-align:left}.table-handle-menu button:hover{color:var(--color-text);background:var(--color-hover)}.table-menu-separator{height:1px;margin:4px 0;background:var(--color-border-soft)}.table-handle-menu .table-menu-danger{color:var(--color-danger)}.table-handle-menu .table-menu-danger:hover{color:var(--color-danger);background:var(--color-danger-bg)}.table-handle-menu button:disabled{cursor:not-allowed;opacity:.4}
.rich-editor th,.rich-editor td{min-width:88px;padding:7px 9px;border-right:1px solid var(--color-border);border-bottom:1px solid var(--color-border);outline:0;font-size:var(--text-md);text-align:left}
.rich-editor th{background:var(--color-sidebar);font-weight:600}.rich-editor tr:last-child td{border-bottom:0}.rich-editor th:last-child,.rich-editor td:last-child{border-right:0}
.rich-editor img{display:block;max-width:100%;height:auto;margin:var(--s5) 0;border-radius:var(--r-md)}.rich-editor a{color:inherit;text-decoration-color:var(--color-tertiary);text-underline-offset:2px}

/* Files and backlinks */
.attachment-list,.backlinks{display:grid;gap:var(--s2);margin-top:var(--s8)}.attachment-card{display:flex;align-items:center;gap:var(--s3);min-height:44px;padding:var(--s2);color:var(--color-text);background:var(--color-surface);border:1px solid var(--color-border-soft);border-radius:var(--r-md);text-decoration:none}
.attachment-card:hover{background:var(--color-hover)}.backlinks h3{margin:0 0 var(--s1);color:var(--color-secondary);font-size:var(--text-sm);font-weight:500}
.backlinks button{width:fit-content;padding:4px 6px;color:var(--color-secondary);border-radius:var(--r-md);font-size:var(--text-sm)}.backlinks button:hover{color:var(--color-text);background:var(--color-hover)}

/* Authentication */
.auth{display:grid;min-height:100vh;padding:var(--s6);place-items:center;background:var(--color-sidebar)}
.auth-card{width:min(360px,100%);padding:var(--s8);background:var(--color-surface);border:1px solid var(--color-border-soft);border-radius:var(--r-xl);box-shadow:var(--shadow-popover)}
.auth-card .brand-mark{margin:0 auto}.auth-card h1{margin:var(--s5) 0 var(--s1);font-size:var(--text-xl);line-height:var(--line-tight);text-align:center}
.auth-card>p{margin:0 0 var(--s6);color:var(--color-secondary);font-size:var(--text-sm);text-align:center}
.auth-card label{display:grid;gap:6px;margin:var(--s4) 0;color:var(--color-secondary);font-size:var(--text-sm)}
.auth-card input{width:100%;padding:6px 9px;outline:0}.auth-card input:focus{border-color:var(--color-focus);box-shadow:0 0 0 2px var(--color-selected)}
.auth-card form>button[type=submit]{width:100%;min-height:var(--control-lg);margin-top:var(--s2);color:var(--color-canvas);background:var(--color-primary);border-radius:var(--r-md);font-size:var(--text-sm);font-weight:600}
.auth-card img{display:block;max-width:220px;margin:var(--s4) auto;border-radius:var(--r-md)}
.auth-card code{display:block;padding:var(--s2);overflow-wrap:anywhere;color:var(--color-secondary);background:var(--color-sidebar);border-radius:var(--r-md);font-size:var(--text-xs);text-align:center}
.error{min-height:18px;color:var(--color-danger)!important;font-size:var(--text-sm)}

/* Dialogs */
dialog{width:min(440px,calc(100% - 32px));max-height:min(680px,calc(100vh - 48px));padding:var(--s6);overflow:auto;color:var(--color-text);background:var(--color-surface);border:0;border-radius:var(--r-xl);box-shadow:var(--shadow-modal)}
dialog::backdrop{background:rgba(15,15,15,.38);backdrop-filter:blur(1px)}dialog h2{margin:0 0 var(--s5);font-size:var(--text-xl);line-height:var(--line-tight);letter-spacing:-.02em}
dialog label{display:grid;gap:6px;margin:var(--s4) 0;color:var(--color-secondary);font-size:var(--text-sm)}
dialog input:not([type=checkbox]),dialog select{width:100%;padding:6px 9px;outline:0}dialog input:focus,dialog select:focus{border-color:var(--color-focus);box-shadow:0 0 0 2px var(--color-selected)}
.dialog-actions{display:flex;justify-content:flex-end;gap:var(--s2);margin-top:var(--s6)}.dialog-actions button{min-height:var(--control-md);padding:5px 11px;border-radius:var(--r-md);font-size:var(--text-sm)}
.dialog-actions button:not(.primary):hover{background:var(--color-hover)}.dialog-actions .danger-primary{color:#fff!important;background:var(--color-danger)}.dialog-actions .danger-primary:hover{background:var(--color-danger);filter:brightness(.92)}.dialog-copy{margin:0;color:var(--color-secondary);font-size:var(--text-sm);line-height:var(--line-normal)}.dialog-copy strong{color:var(--color-text)}.tag-option{display:flex;align-items:center;gap:var(--s2);padding:var(--s1)}.tag-option input{width:auto}
.date-fields,.table-size-fields{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}.dialog-hint{margin:var(--s2) 0 0;color:var(--color-tertiary);font-size:var(--text-xs)}
.history-list{max-height:360px;overflow:auto}.history-item{display:flex;align-items:center;justify-content:space-between;min-height:40px;padding:var(--s2) 0;border-bottom:1px solid var(--color-border-soft);font-size:var(--text-sm)}
.history-item button{padding:4px 7px;color:var(--color-focus);border-radius:var(--r-md)}.history-item button:hover{background:var(--color-selected)}

/* Responsive */
@media(max-width:760px){
  :root{--topbar-height:48px;--editor-tools-top:96px;--text-title:34px}
  .app{display:block}.sidebar{position:fixed;left:calc(-1 * var(--sidebar-width) - 16px);width:var(--sidebar-width);box-shadow:var(--shadow-modal);transition:left 160ms ease}.sidebar.open{left:0}
  .hamburger{display:inline-grid}.topbar{justify-content:flex-start;gap:var(--s2);padding:0 var(--s2)}.search{width:100%}.search kbd{display:none}
  .content{padding:var(--s8) var(--s4) var(--s12)}.page-title{align-items:flex-start;margin-bottom:var(--s6)}.page-title #newNoteTop{display:none}
  .folder-tiles,.tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}.folder-tile,.note-tile{min-height:104px;padding:var(--s3)}
  .editor-top{padding:0 var(--s2)}.editor-actions #historyBtn{display:none}.editor-wrap{width:calc(100% - 28px);padding-top:var(--s8)}
  .note-meta-row{gap:var(--s1)}
  .toolbar{margin-top:var(--s5)}.rich-editor{min-height:460px;padding-top:var(--s2)}
  .date-fields,.table-size-fields{grid-template-columns:1fr;gap:0}
}
@media(max-width:420px){.folder-tiles,.tiles{grid-template-columns:1fr}.auth{padding:var(--s4)}.auth-card{padding:var(--s6)}}