.card { background: #fff; border: 1px solid #eef0f4; border-radius: 1rem; box-shadow: 0 1px 2px 0 rgba(23,27,36,0.04), 0 1px 3px 0 rgba(23,27,36,0.06); }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:.5rem; border-radius:.5rem; padding:.5rem 1rem; font-size:.875rem; font-weight:500; transition:background-color .15s; }
.btn:disabled { opacity:.5; cursor:not-allowed; }
.btn-primary { background:#3b6bff; color:#fff; }
.btn-primary:hover { background:#2450e6; }
.btn-secondary { background:#fff; color:#3b4354; border:1px solid #dde1e8; }
.btn-secondary:hover { background:#f7f8fa; }
.btn-ghost { color:#525c6e; }
.btn-ghost:hover { background:#eef0f4; }
.btn-danger { background:#ef4444; color:#fff; }
.btn-danger:hover { background:#dc2626; }
.input { width:100%; border-radius:.5rem; border:1px solid #dde1e8; background:#fff; padding:.5rem .75rem; font-size:.875rem; color:#262c38; }
.input:focus { outline:none; box-shadow:0 0 0 2px #9fb8ff; border-color:transparent; }
.label { font-size:.75rem; font-weight:500; color:#707a8c; text-transform:uppercase; letter-spacing:.05em; }
.badge { display:inline-flex; align-items:center; gap:.25rem; border-radius:9999px; padding:.125rem .625rem; font-size:.75rem; font-weight:500; }
.modal-overlay { position:fixed; inset:0; z-index:50; display:flex; align-items:center; justify-content:center; padding:1rem; }
.modal-backdrop { position:absolute; inset:0; background:rgba(23,27,36,0.4); backdrop-filter:blur(2px); }
.modal-box { position:relative; z-index:10; width:100%; max-width:32rem; max-height:90vh; overflow-y:auto; border-radius:1rem; background:#fff; box-shadow:0 8px 24px -4px rgba(23,27,36,0.12); }
.modal-box.wide { max-width:42rem; }
.prose-notes h1,.prose-notes h2,.prose-notes h3 { font-weight:700; margin-top:1em; margin-bottom:.4em; color:#262c38; }
.prose-notes h1{font-size:1.5em;} .prose-notes h2{font-size:1.25em;} .prose-notes h3{font-size:1.1em;}
.prose-notes p { margin-bottom: .75em; line-height:1.6; }
.prose-notes ul,.prose-notes ol { margin: .5em 0 .75em 1.5em; }
.prose-notes ul{list-style:disc;} .prose-notes ol{list-style:decimal;}
.prose-notes code { background:#eef0f4; padding:.1em .35em; border-radius:.25em; font-size:.9em; }
.prose-notes pre { background:#171b24; color:#eef0f4; padding:1em; border-radius:.5em; overflow-x:auto; margin-bottom:.75em; }
.prose-notes pre code { background:transparent; color:inherit; padding:0; }
.prose-notes strong { font-weight:700; }
.prose-notes blockquote { border-left:3px solid #dde1e8; padding-left:1em; color:#525c6e; margin-bottom:.75em; }
.prose-notes img { max-width:100%; height:auto; border-radius:.5em; margin:.5em 0; }
.prose-notes .ql-formula { display:inline-block; }

.shared-toolbar { position:sticky; top:0; z-index:20; background:#fff; border-bottom:1px solid #eef0f4; padding:.5rem .75rem; display:flex; align-items:center; gap:.25rem; flex-wrap:wrap; }
.shtb-btn { min-width:2rem; height:2rem; padding:0 .5rem; border-radius:.375rem; border:1px solid transparent; background:transparent; color:#262c38; font-size:.875rem; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
.shtb-btn:hover { background:#f7f8fa; }
.shtb-btn.active { background:#e6edff; color:#2450e6; border-color:#c3d3ff; }
.shtb-sep { width:1px; height:1.5rem; background:#eef0f4; margin:0 .25rem; }
#shtb-equation { width:auto; font-weight:500; }

/* Different bullet glyphs and extended numbering styles, selected via the list-style popover
   (reuses Quill's indent levels as a style selector rather than true nesting depth). */
.ql-editor li[data-list="bullet"].ql-indent-1 > .ql-ui::before { content: '○'; }
.ql-editor li[data-list="bullet"].ql-indent-2 > .ql-ui::before { content: '▪'; }
.ql-editor li[data-list="bullet"].ql-indent-3 > .ql-ui::before { content: '–'; }
.ql-editor li[data-list="ordered"].ql-indent-3 > .ql-ui::before { content: counter(list-3, upper-alpha) '. '; }
.ql-editor li[data-list="ordered"].ql-indent-4 > .ql-ui::before { content: counter(list-4, upper-roman) '. '; }

.ql-container.ql-snow { border:1.5px solid #dde1e8 !important; border-radius:.5rem; background:#fff; }
.ql-toolbar.ql-snow { border:1px solid #dde1e8 !important; border-radius:.5rem .5rem 0 0; background:#f7f8fa; }
.ql-editor { padding:.75rem 1rem !important; }
.ql-editor.ql-blank::before { color:#9aa3b2 !important; font-style:normal !important; content:'Start typing...'; }
.ql-editor img.img-selected { outline:2px solid #3b6bff; outline-offset:2px; }
#img-action-bar button { cursor:pointer; }