/* A restrained palette based on ink, blue and sage. */
:root {
  color: #1e1e24;
  background: #f1f3f2;
  --side: #e8eeeb;
  --list: #f4f6f5;
  --paper: #fff;
  --line: #dce4e0;
  --text: #1e1e24;
  --muted: #52645c;
  --accent: #6a8e7f;
  --selected: #d7e4dd;
  --soft: #edf2ef;
  --input: #dfe9e3;
}
.brand-mark,.mobile-symbol{background:#2e4052;color:#fff}
.brand-dot,.empty-icon{color:#6a8e7f}
.preview-tag{background:#d6e2db;color:#2e4052}
.icon-button,.folder-row,.settings-button,.format-toolbar button{color:#405950}
.folder-row.active{color:#1e1e24}
.folder-row .count,.note-item-preview,.format-hint,.editor-footer{color:#52645c}
.new-note{border-color:#cad8d0;color:#2e4052}
.demo-dot,.saved span{background:#6a8e7f}
.toolbar-slash{color:#8ba396}
.note-title::placeholder,.note-body:empty:before{color:#697f74}
button:focus-visible,input:focus-visible,select:focus-visible,[contenteditable]:focus-visible{outline-color:#6a8e7f}
::selection{background:#b8d2c3;color:#1e1e24}
.note-body,.note-title{caret-color:#6a8e7f}
.mobile-notice p{color:#52645c}
html[data-theme=dark]{
  background:#1e1e24;
  --side:#1e1e24;
  --list:#252f37;
  --paper:#2e4052;
  --line:#485c62;
  --text:#f1f5f2;
  --muted:#c3d6cc;
  --accent:#6a8e7f;
  --selected:#465f59;
  --soft:#3a5058;
  --input:#4b625d;
}
html[data-theme=dark] .brand-mark,html[data-theme=dark] .mobile-symbol{background:#6a8e7f;color:#1e1e24}
html[data-theme=dark] .preview-tag{background:#384c48;color:#e4eee8}
html[data-theme=dark] .icon-button,html[data-theme=dark] .folder-row,html[data-theme=dark] .settings-button,html[data-theme=dark] .format-toolbar button,html[data-theme=dark] .folder-row .count,html[data-theme=dark] .note-item-preview,html[data-theme=dark] .format-hint,html[data-theme=dark] .editor-footer{color:#c3d6cc}
html[data-theme=dark] .folder-row.active{color:#fff}
html[data-theme=dark] .new-note{border-color:#607c70;color:#d8e6df}
html[data-theme=dark] .note-title::placeholder,html[data-theme=dark] .note-body:empty:before{color:#b4c9bd}
html[data-theme=dark] .mobile-notice p{color:#c3d6cc}

/* User palette: deep navy, blue and light blue. */
:root {
  color: #000d17;
  background: #eaf2f8;
  --side: #dcebf5;
  --list: #f0f6fa;
  --paper: #fff;
  --line: #cbddea;
  --text: #000d17;
  --muted: #325c7d;
  --accent: #325c7d;
  --selected: #b6cfe3;
  --soft: #e2eef6;
  --input: #cbdfea;
}
.brand-mark,.mobile-symbol{background:#0f304a;color:#fff}
.brand-dot,.empty-icon{color:#325c7d}
.preview-tag{background:#b6cfe3;color:#0f304a}
.icon-button,.folder-row,.settings-button,.format-toolbar button{color:#325c7d}
.folder-row.active{color:#000d17}
.folder-row .count,.note-item-preview,.format-hint,.editor-footer{color:#325c7d}
.new-note{border-color:#b6cfe3;color:#0f304a}
.demo-dot,.saved span{background:#325c7d}
.toolbar-slash{color:#6a91b0}
.note-title::placeholder,.note-body:empty:before{color:#547894}
button:focus-visible,input:focus-visible,select:focus-visible,[contenteditable]:focus-visible{outline-color:#325c7d}
::selection{background:#b6cfe3;color:#000d17}
.note-body,.note-title{caret-color:#325c7d}
.mobile-notice p{color:#325c7d}
html[data-theme=dark]{
  background:#000d17;
  --side:#000d17;
  --list:#0f304a;
  --paper:#173b56;
  --line:#325c7d;
  --text:#f1f7fb;
  --muted:#b6cfe3;
  --accent:#6a91b0;
  --selected:#325c7d;
  --soft:#244c69;
  --input:#325c7d;
}
html[data-theme=dark] .brand-mark,html[data-theme=dark] .mobile-symbol{background:#6a91b0;color:#000d17}
html[data-theme=dark] .brand-dot,html[data-theme=dark] .empty-icon{color:#b6cfe3}
html[data-theme=dark] .preview-tag{background:#325c7d;color:#f1f7fb}
html[data-theme=dark] .icon-button,html[data-theme=dark] .folder-row,html[data-theme=dark] .settings-button,html[data-theme=dark] .format-toolbar button,html[data-theme=dark] .folder-row .count,html[data-theme=dark] .note-item-preview,html[data-theme=dark] .format-hint,html[data-theme=dark] .editor-footer{color:#b6cfe3}
html[data-theme=dark] .folder-row.active{color:#fff}
html[data-theme=dark] .new-note{border-color:#6a91b0;color:#f1f7fb}
html[data-theme=dark] .note-title::placeholder,html[data-theme=dark] .note-body:empty:before{color:#b6cfe3}
html[data-theme=dark] .mobile-notice p{color:#b6cfe3}

html[data-theme=dark]{--side:#000d17;--list:#081b29;--paper:#0c2232;--line:#274359;--soft:#153247;--input:#24465d;--selected:#284c66}
html[data-theme=dark]{--side:#000a12;--list:#00101a;--paper:#041522;--line:#1b3548;--soft:#102a3b;--input:#1b3a4f;--selected:#23445d}
html[data-theme=dark]{--side:#00070d;--list:#06131f;--paper:#0f1c26;background:#00070d}

html[data-theme="light"] { color-scheme:light; }
html[data-theme="dark"] { color-scheme:dark; }
dialog select, dialog select option { background-color:var(--paper); color:var(--text); }
html[data-theme="dark"] { --text:#e8e3d8; }
html[data-theme="dark"] .folder-row.active,
html[data-theme="dark"] .preview-tag,
html[data-theme="dark"] .new-note { color:var(--text); }