/* Course notes are a working surface, not another dashboard of cards. */
.notes-workspace { --notes-line:#dce4ef; --notes-muted:#66778e; --notes-blue:#2559d6; --notes-ink:#102747; min-width:0; }
.notes-workspace *, .notes-workspace *::before, .notes-workspace *::after { box-sizing:border-box; }
.notes-workspace-head { display:flex; align-items:center; justify-content:flex-end; gap:18px; margin-bottom:20px; }
.notes-workspace-head > p { color:var(--notes-muted); font-size:14px; line-height:1.6; max-width:55ch; }
.notes-workspace .button { white-space:normal; min-height:44px; }
.notes-sections { display:flex; gap:5px; flex-wrap:wrap; border-bottom:1px solid var(--notes-line); padding-bottom:12px; margin-bottom:20px; }
.notes-workspace .note-section { background:transparent; border:1px solid transparent; color:#526580; padding:9px 12px; gap:9px; font-size:13px; }
.note-section > span { font-size:11px; min-width:20px; padding:2px 5px; border-radius:4px; background:#e7edf6; color:#4d6280; }
.notes-workspace .note-section.active { background:#e9effd; border-color:#cedcf7; color:#1745ad; }
.note-section.active > span { background:#d6e2fc; color:#1745ad; }
.notes-layout { display:grid; grid-template-columns:minmax(240px, .7fr) minmax(0,1.6fr); min-width:0; align-items:stretch; border:1px solid var(--notes-line); border-radius:13px; overflow:hidden; background:#fff; }
.notes-index { min-width:0; background:#f9fbfe; border-right:1px solid var(--notes-line); }
.notes-search-wrap { display:flex; gap:5px; padding:19px 17px 12px; }
.notes-search-wrap > input { min-width:0; }
.notes-search-wrap > .button { padding-inline:7px; flex-shrink:0; }
.notes-filters { display:grid; grid-template-columns:1fr 1fr; gap:9px; padding:0 17px 14px; }
.notes-filters label { min-width:0; margin:0; font-size:11px; color:#526580; }
.notes-filters select { min-width:0; font-size:12px; padding:10px 7px; margin-top:6px; }
.notes-filter-reset { padding:0 17px 12px; }
.notes-filter-reset > .button { padding-inline:7px; }
.notes-results-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 18px; border-top:1px solid var(--notes-line); border-bottom:1px solid var(--notes-line); }
.notes-results-heading > h2 { font-size:12px; font-weight:650; }
.notes-results-heading > span { color:#66778e; font-size:12px; }
.notes-results { max-height:740px; overflow:auto; scrollbar-width:thin; }
.notes-results > .note-list-item { content-visibility:auto; contain-intrinsic-size:auto 142px; }
.notes-workspace .note-list-item { display:block; text-align:left; width:100%; min-width:0; border:0; border-bottom:1px solid #e4eaf3; border-radius:0; background:transparent; padding:18px; color:var(--notes-ink); cursor:pointer; font:inherit; border-left:3px solid transparent; }
.notes-workspace .note-list-item:hover { background:#eff4fc; }
.notes-workspace .note-list-item.selected { background:#eaf0fe; border-left-color:var(--notes-blue); }
.note-list-title { display:block; font-size:14px; font-weight:650; line-height:1.5; overflow-wrap:anywhere; }
.note-pin-mark { color:#2559d6; font-size:10px; vertical-align:2px; }
.note-list-preview { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; font-size:12px; line-height:1.6; color:#60728d; margin-top:7px; white-space:pre-line; overflow-wrap:anywhere; }
.note-list-context { display:flex; justify-content:space-between; flex-wrap:wrap; gap:5px 10px; color:#59708d; font-size:10px; margin-top:12px; line-height:1.5; overflow-wrap:anywhere; }
.note-list-context > span { color:#75869a; }
.notes-empty { padding:28px 20px 34px; }
.notes-empty h3 { font-size:15px; line-height:1.45; }
.notes-empty p { font-size:13px; line-height:1.7; color:var(--notes-muted); margin-top:9px; }
.notes-empty .button { margin-top:19px; }
.notes-editor { min-width:0; padding:24px 30px 0; }
.notes-editor-empty { min-height:560px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; padding:38px; }
.notes-editor-empty > h2 { font-size:24px; letter-spacing:-.6px; margin-top:22px; }
.notes-editor-empty > p { color:var(--notes-muted); font-size:14px; line-height:1.7; margin:10px 0 22px; max-width:35ch; }
.notes-paper-mark { width:58px; height:68px; color:#2559d6; }
.notes-paper-mark svg { width:100%; height:100%; }
.note-editor-top { display:flex; align-items:center; justify-content:space-between; gap:15px; min-width:0; }
.note-editor-location { display:flex; align-items:center; flex-wrap:wrap; gap:9px; font-size:12px; color:#687b94; min-width:0; }
.note-editor-location .note-mobile-back { display:none; }
.note-state-chip { color:#1c519e; background:#edf3ff; padding:4px 7px; font-size:10px; border-radius:4px; }
.note-more { position:relative; flex-shrink:0; }
.notes-workspace summary { min-height:44px; cursor:pointer; list-style-position:inside; }
.note-more > summary { display:flex; align-items:center; font-size:12px; color:#47617f; padding:10px 9px; border:1px solid var(--notes-line); border-radius:6px; background:white; }
.note-more > summary::after { content:'⌄'; font-size:15px; padding-left:9px; }
.note-more-panel { position:absolute; top:calc(100% + 7px); right:0; z-index:8; width:205px; max-width:calc(100vw - 44px); padding:7px; background:#fff; border:1px solid #d5dfed; border-radius:8px; box-shadow:0 12px 34px #1027471c; display:flex; flex-direction:column; align-items:stretch; }
.note-more-panel .button { justify-content:flex-start; text-align:left; border:0; font-size:12px; }
.notes-workspace .note-danger { color:#a83840; }
.notes-workspace .note-danger:hover { background:#fff1f2; }
.note-trash-notice { font-size:13px; line-height:1.65; color:#82561e; background:#fff7e9; padding:12px 14px; border:1px solid #f0dfbd; border-radius:6px; margin-top:17px; }
.notes-workspace #note-form { margin:15px 0 0; }
.notes-workspace .note-title-input { border-color:transparent; border-radius:0; padding:10px 0 15px; font-size:25px; line-height:1.4; font-weight:650; letter-spacing:-.6px; background:transparent; }
.notes-workspace .note-title-input::placeholder { color:#91a0b5; font-weight:550; }
.notes-workspace .note-title-input:hover { border-color:transparent; border-bottom-color:#d8e2f0; }
.note-context { margin-top:5px; border-bottom:1px solid var(--notes-line); padding-bottom:8px; }
.note-context > summary { display:flex; align-items:center; gap:10px; font-size:12px; color:#3b5577; }
.note-context > summary::before { content:'›'; font-size:18px; transition:transform .12s; }
.note-context[open] > summary::before { transform:rotate(90deg); }
.note-context > summary > span { color:#8997aa; font-size:11px; }
.note-context-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 14px; padding:9px 0; }
.note-context-grid label { margin-bottom:13px; font-size:12px; }
.note-context-full { grid-column:1/-1; }
.note-context-grid input, .note-context-grid select { min-width:0; font-size:14px; }
.note-source-link { display:inline-flex; align-items:center; min-height:44px; font-size:12px; margin-left:9px; text-decoration:underline; text-underline-offset:3px; }
.note-writing-tools { display:flex; align-items:center; gap:4px; padding:10px 0 0; }
.note-writing-tools .button { padding-inline:9px; }
.note-writing-tools > span { margin-left:auto; color:#8895a8; font-size:11px; }
.notes-workspace .note-body-input { min-height:300px; width:100%; max-width:100%; padding:16px 0; border:0; border-radius:0; line-height:1.85; font-size:15px; color:#263d59; resize:vertical; font-family:inherit; }
.notes-workspace .note-body-input::placeholder { color:#8c9bb1; }
.notes-workspace .note-body-input:focus-visible { outline-offset:5px; }
.note-text-meta { display:flex; justify-content:space-between; align-items:center; gap:8px 15px; flex-wrap:wrap; }
.note-text-meta > span { color:#8391a5; font-size:11px; }
.note-text-meta .button { font-size:12px; padding-inline:8px; }
.note-selection-help { color:#71829a; font-size:11px; line-height:1.65; margin:4px 0 20px; max-width:65ch; }
.note-checklist { border-top:1px solid var(--notes-line); padding-top:17px; }
.note-checklist-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:11px; }
.note-checklist-heading > h3 { font-size:13px; font-weight:650; }
.note-checklist-heading > span { color:#7a8ba0; font-size:11px; }
.note-checklist-row { display:grid; grid-template-columns:44px minmax(0,1fr) auto; gap:3px 8px; align-items:center; margin-bottom:7px; }
.note-checklist-tick { display:flex; align-items:center; justify-content:flex-start; margin:0; min-height:44px; width:44px; cursor:pointer; }
.notes-workspace .note-checklist-check { width:21px; height:21px; min-height:21px; margin:0; }
.notes-workspace .note-checklist-text { font-size:13px; padding:10px 11px; min-width:0; }
.note-checklist-row.is-done .note-checklist-text { color:#75869a; text-decoration:line-through; background:#f7f9fc; }
.note-checklist-row > .button { padding-inline:7px; font-size:11px; }
.note-checklist-add { display:flex; align-items:center; gap:10px; margin-top:10px; }
.note-checklist-add > input { min-width:0; font-size:13px; }
.note-checklist-add > .button { flex-shrink:0; font-size:12px; }
.notes-workspace #note-error { margin-top:18px; margin-bottom:0; }
.note-save-footer { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px 20px; padding:22px 0; margin-top:20px; border-top:1px solid var(--notes-line); }
.note-save-footer > div { min-width:0; }
.note-save-status { color:#137f74; font-size:12px; font-weight:600; line-height:1.6; }
.note-save-status.is-unsaved { color:#8c641e; }
.note-save-status.is-error { color:#aa343b; }
.note-storage-hint { font-size:11px; color:#7c8ca1; line-height:1.65; margin-top:4px; }
.quick-note-list { display:flex; flex-direction:column; margin-top:16px; }
.quick-note-item { display:block; min-width:0; min-height:44px; text-align:left; padding:13px 0; border:0; border-top:1px solid #e1e7f0; background:none; color:#102747; font:inherit; cursor:pointer; }
.quick-note-item:first-child { border-top:0; }
.quick-note-item strong { display:block; font-size:14px; font-weight:600; line-height:1.5; overflow-wrap:anywhere; }
.quick-note-item small { display:block; color:#66778e; font-size:12px; font-weight:400; line-height:1.6; margin-top:5px; overflow-wrap:anywhere; }
.quick-note-item:hover strong { color:#2559d6; }
.notes-workspace button:focus-visible, .notes-workspace input:focus-visible, .notes-workspace textarea:focus-visible, .notes-workspace select:focus-visible, .notes-workspace summary:focus-visible, .notes-workspace a:focus-visible { outline:3px solid #729eff; outline-offset:2px; }
.notes-workspace button:disabled, .notes-workspace input:disabled, .notes-workspace textarea:disabled, .notes-workspace select:disabled { opacity:.6; cursor:not-allowed; }
.notes-workspace .note-checklist-tick { min-width:44px; min-height:44px; }

@media (min-width:1600px) { .notes-layout { grid-template-columns:minmax(280px,.65fr) minmax(0,1.6fr); } .notes-editor { padding-inline:38px; } .notes-workspace .note-body-input { min-height:370px; } }
@media (max-width:1120px) and (min-width:761px) { .notes-layout { grid-template-columns:minmax(210px,.7fr) minmax(0,1fr); } .notes-editor { padding:20px 22px 0; } .notes-filters { grid-template-columns:1fr; } .note-checklist-add { align-items:stretch; flex-direction:column; } .note-checklist-add > .button { align-self:flex-end; } .note-checklist-row { grid-template-columns:44px minmax(0,1fr); } .note-checklist-row > .button { grid-column:2; justify-self:end; } }
@media (max-width:760px) {
  .notes-workspace-head { margin-bottom:16px; }
  .notes-workspace-head > p { font-size:13px; max-width:28ch; }
  .notes-workspace-head > .button { flex-shrink:0; }
  .notes-sections { gap:3px; margin-bottom:16px; }
  .notes-workspace .note-section { gap:7px; padding:9px 10px; font-size:12px; }
  .notes-layout { display:block; border-radius:10px; }
  .notes-index { border-right:0; }
  .notes-results { max-height:none; }
  .notes-filters { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px; }
  .notes-filters select { font-size:14px; }
  .notes-editor { display:none; padding:17px 22px 0; }
  .notes-is-editing .notes-editor { display:block; }
  .notes-is-editing .notes-index, .notes-is-editing .notes-sections, .notes-is-editing .notes-workspace-head { display:none; }
  .note-editor-location .note-mobile-back { display:inline-flex; padding-left:0; }
  .note-editor-location > span:not(.note-state-chip) { display:none; }
  .note-editor-top { gap:6px; }
  .note-more > summary { font-size:12px; }
  .notes-workspace .note-title-input { font-size:24px; }
  .notes-workspace input, .notes-workspace select, .notes-workspace textarea { font-size:16px; }
  .note-context-grid input, .note-context-grid select, .notes-filters select { font-size:16px; }
  .notes-workspace .note-body-input { font-size:16px; min-height:350px; line-height:1.8; }
  .notes-workspace .note-checklist-text, .note-checklist-add > input { font-size:16px; }
  .note-selection-help { font-size:12px; }
  .note-text-meta > span { font-size:11px; }
  .note-checklist-row { grid-template-columns:44px minmax(0,1fr) auto; gap:6px; }
  .note-save-footer { gap:13px; padding:20px 0 22px; }
  .note-save-footer > .primary { margin-left:auto; }
  .note-save-status, .note-storage-hint { font-size:12px; }
}
@media (max-width:520px) {
  .notes-workspace-head > p { font-size:12px; }
  .notes-workspace .note-section { padding-inline:8px; gap:6px; }
  .note-section > span { min-width:17px; padding:2px 4px; font-size:10px; }
  .notes-editor { padding-inline:17px; }
  .notes-workspace .note-title-input { font-size:23px; }
  .note-context-grid { grid-template-columns:minmax(0,1fr); }
  .note-context-full { grid-column:auto; }
  .note-text-meta .button { padding-inline:0; }
  .note-checklist-add { flex-direction:column; align-items:stretch; }
  .note-checklist-add > .button { align-self:flex-end; }
  .note-checklist-row { grid-template-columns:44px minmax(0,1fr); gap:3px 6px; }
  .note-checklist-row > .button { grid-column:2; justify-self:end; }
  .note-checklist-row + .note-checklist-row { border-top:1px solid #eef2f8; padding-top:7px; }
  .note-save-footer > div { flex-basis:100%; }
  .note-save-footer > .primary { flex:1; }
  .notes-list-title { font-size:15px; }
}
@media (max-width:359px) { .notes-editor { padding-inline:13px; } .notes-search-wrap, .notes-filters { padding-inline:13px; } .notes-workspace .note-section { font-size:11px; gap:4px; padding-inline:6px; } .note-more > summary { font-size:11px; padding-inline:7px; } .note-editor-location .button { font-size:11px; } }
@media (prefers-reduced-motion:reduce) { .note-context > summary::before { transition:none; } }