/* Chapter notebook controls keep the existing reading surface unchanged. */
.notes-backup-settings { margin-top:18px; padding-top:16px; border-top:1px solid var(--line); }
.notes-backup-settings h3 { margin:0 0 10px; font:600 12px/1.5 "Segoe UI",Arial,sans-serif; color:var(--ink); }
.notes-backup-settings p { margin:8px 0 0; color:var(--muted); font:11px/1.6 "Segoe UI",Arial,sans-serif; }
.notes-backup-settings .section-note-error { color:#a24141; }
.tree-entry { display:flex; align-items:center; gap:2px; }
.tree-entry .tree-item { flex:1; min-width:0; }
.tree-part .part-link { flex:1; min-width:0; }
.section-note-button { display:flex; align-items:center; justify-content:center; flex-shrink:0; width:28px; height:30px; padding:5px; border-radius:5px; color:var(--ui-muted,var(--muted)); }
.section-note-button svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.section-note-button:hover { background:var(--accent-soft); color:var(--accent); }
.section-note-button[data-has-note="true"] { color:var(--accent); background:var(--accent-soft); }
.section-note-button[data-has-note="true"] svg { stroke-width:2.1; }
.section-note-button:focus-visible,.section-notes-dialog button:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.section-notes-dialog { width:min(780px,calc(100vw - 32px)); height:min(720px,calc(100dvh - 48px)); }
.section-notes-dialog .dialog-heading { padding-bottom:20px; }
.section-notes-dialog .dialog-heading h2 { font-size:26px; overflow-wrap:anywhere; }
.section-note-formatting { display:flex; flex-wrap:wrap; align-items:center; gap:10px; flex-shrink:0; padding:10px 28px; border-block:1px solid var(--line); background:var(--surface-soft,var(--canvas)); }
.section-note-bold { width:36px; height:34px; border:1px solid var(--control-border,var(--line)); border-radius:5px; color:var(--ink); font:bold 18px Georgia,serif; background:var(--paper); }
.section-note-bold[aria-pressed="true"],.section-note-bold[aria-pressed="mixed"] { background:var(--accent-soft); border-color:var(--accent); color:var(--accent); }
.section-note-formatting label { font-size:12px; color:var(--muted); margin-left:8px; }
.section-note-formatting select { padding:8px 10px; border:1px solid var(--control-border,var(--line)); border-radius:5px; background:var(--paper); color:var(--ink); font:13px "Segoe UI",Arial,sans-serif; }
.section-note-formatting select:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.section-note-editor { flex:1; min-height:120px; margin:0; padding:24px 28px; overflow:auto; overscroll-behavior:contain; white-space:pre-wrap; overflow-wrap:anywhere; color:var(--ink); font:16px/1.8 "Segoe UI",Arial,sans-serif; outline:none; }
.section-note-editor:focus { box-shadow:inset 0 0 0 2px var(--accent-soft); }
.section-note-editor:empty::before { content:attr(data-placeholder); color:var(--muted); pointer-events:none; }
.section-note-editor p,.section-note-editor div { margin:0; }
.section-note-status { flex-shrink:0; margin:0; padding:9px 28px; font:11px/1.6 "Segoe UI",Arial,sans-serif; color:var(--muted); overflow-wrap:anywhere; }
.section-note-status.section-note-error { color:#a24141; }
.section-note-footer { flex-shrink:0; display:flex; justify-content:space-between; align-items:center; gap:12px; padding:14px 28px 20px; border-top:1px solid var(--line); }
.section-note-backups { display:flex; flex-wrap:wrap; gap:8px 16px; }
.section-note-backups button { padding:7px 0; font-size:12px; color:var(--accent); text-decoration:underline; text-underline-offset:3px; }
.section-note-done { flex-shrink:0; padding:10px 16px; border-radius:6px; background:var(--accent); color:var(--paper); font:600 12px/1.5 "Segoe UI",Arial,sans-serif; }
.section-note-discard { color:#a24141; padding:8px 0; font-size:11px; }
@media (max-width:760px) {
  .section-notes-dialog { width:calc(100vw - 20px); height:calc(100dvh - 24px); max-height:calc(100dvh - 24px); }
  .section-notes-dialog .dialog-heading { padding:21px; }
  .section-notes-dialog .dialog-heading h2 { font-size:23px; }
  .section-note-formatting { padding-inline:21px; }
  .section-note-editor { padding:20px 21px; }
  .section-note-status { padding-inline:21px; }
  .section-note-footer { padding:12px 21px 18px; }
}
@media (pointer:coarse) {
  .section-note-button { width:36px; min-height:40px; }
  .section-note-formatting button,.section-note-formatting select,.section-note-footer button { min-height:44px; }
}
@media print { .section-note-button,.section-notes-dialog { display:none!important; } }
