/* Portable reading styles: no shell tokens, external artwork or motion required.
   Theme, type and paper rules below set only --note-* tokens and the page background; every block and view reads those
   tokens alone, so a look (appearance.js) restyles everything together. Keep per-theme rules out of component CSS. */
.reading-surface {
  --note-paper: #fff9ea;
  --note-ink: #292723;
  --note-muted: #6c655d;
  --note-line: #d9d1bf;
  --note-accent: #42634f;
  --note-code: #f3eddf;
  --note-marker: #f5db81;
  --note-marker-ink: #292723;
  --note-card-radius: 9px 7px 10px 8px;
  --note-font: Georgia, 'Times New Roman', serif;
  --note-heading: 'Instrument Serif', Georgia, serif;
  --note-heading-weight: 400;
  --note-h1: 2.75em;
  --note-size: 16px;
  --note-width: 66ch;
  --note-rule: #789ab52e;
  --note-dot: #657f9652;
  --note-margin: #bb78783b;
  /* Chart series (NF-044): >= 4:1 against this theme's paper, told apart by more than color (legend, markers, labels). */
  --note-series-1: #2a6fc4;
  --note-series-2: #c4531f;
  --note-series-3: #12856a;
  --note-series-4: #7a52c8;
  --note-gutter: 24px;
  --note-rule-gap: calc(var(--note-size) * 1.85);
  background: var(--note-paper);
  color: var(--note-ink);
  color-scheme: light;
}
.reading-surface[data-theme=linen] {
  --note-paper: #f4ebdd;
  --note-ink: #3d3027;
  --note-muted: #6f5a49;
  --note-line: #d9c8b5;
  --note-accent: #8b4429;
  --note-code: #e9ddcc;
  --note-marker: #ecd6b3;
  --note-marker-ink: #3d3027;
  --note-rule: #96734d30;
  --note-dot: #896b4852;
  --note-margin: #b16e513b;
  --note-series-1: #b04a1e;
  --note-series-2: #2f6aa6;
  --note-series-3: #4f7d12;
  --note-series-4: #8a4fb8;
}
.reading-surface[data-theme=midnight] {
  --note-paper: #20272c;
  --note-ink: #e4e9e7;
  --note-muted: #a8b9b1;
  --note-line: #43504f;
  --note-accent: #b7d7bd;
  --note-code: #2d373b;
  --note-marker: #344a3e;
  --note-marker-ink: #b7d7bd;
  --note-rule: #a8b9b129;
  --note-dot: #b7d7bd42;
  --note-margin: #c59b953b;
  --note-series-1: #4f95e6;
  --note-series-2: #e07040;
  --note-series-3: #21a67c;
  --note-series-4: #9a7ee2;
  color-scheme: dark;
}
.reading-surface[data-theme=airmail] {
  --note-paper: #eef3f8;
  --note-ink: #1f2a37;
  --note-muted: #556273;
  --note-line: #c9d5e2;
  --note-accent: #2b5d9a;
  --note-code: #e1e9f2;
  --note-marker: #cfe0f3;
  --note-marker-ink: #1f2a37;
  --note-rule: #5a82ad33;
  --note-dot: #4f72994d;
  --note-margin: #c050503b;
  --note-series-1: #2a62b0;
  --note-series-2: #b5481b;
  --note-series-3: #12775f;
  --note-series-4: #7048b8;
}
.reading-surface[data-theme=blush] {
  --note-paper: #fbefee;
  --note-ink: #3a2a2c;
  --note-muted: #6e5457;
  --note-line: #e8cfcd;
  --note-accent: #a03549;
  --note-code: #f3e0de;
  --note-marker: #f2c9cf;
  --note-marker-ink: #3a2a2c;
  --note-rule: #a0606a2e;
  --note-dot: #a0606a4d;
  --note-margin: #a035493b;
  --note-series-1: #2c64ae;
  --note-series-2: #b23d1c;
  --note-series-3: #1d7a5e;
  --note-series-4: #8443a8;
}
.reading-surface[data-theme=meadow] {
  --note-paper: #eef2e6;
  --note-ink: #26302a;
  --note-muted: #56625a;
  --note-line: #cdd6c4;
  --note-accent: #3b6636;
  --note-code: #e0e7d5;
  --note-marker: #d6e6b3;
  --note-marker-ink: #26302a;
  --note-rule: #5f7a5530;
  --note-dot: #4f6a464d;
  --note-margin: #b06e513b;
  --note-series-1: #2b63ab;
  --note-series-2: #b4481d;
  --note-series-3: #3b6f14;
  --note-series-4: #7a49b0;
}
.reading-surface[data-theme=kraft] {
  --note-paper: #e6d6ba;
  --note-ink: #2b2116;
  --note-muted: #54432f;
  --note-line: #c7b28f;
  --note-accent: #76340f;
  --note-code: #dac7a6;
  --note-marker: #f1dfa6;
  --note-marker-ink: #2b2116;
  --note-rule: #6b4f2e33;
  --note-dot: #6b4f2e52;
  --note-margin: #9c3a123b;
  --note-series-1: #2a5794;
  --note-series-2: #9c3a12;
  --note-series-3: #3c6510;
  --note-series-4: #6c3c9c;
}
.reading-surface[data-theme=chalkboard] {
  --note-paper: #1f3029;
  --note-ink: #e8efe9;
  --note-muted: #aebfb4;
  --note-line: #3d5248;
  --note-accent: #f0d68a;
  --note-code: #2a3d35;
  --note-marker: #4b5a35;
  --note-marker-ink: #f0d68a;
  --note-rule: #e8efe924;
  --note-dot: #e8efe93d;
  --note-margin: #f0a0903b;
  --note-series-1: #7fb6f0;
  --note-series-2: #f09a6a;
  --note-series-3: #7fd6a8;
  --note-series-4: #c4a8f0;
  color-scheme: dark;
}
.reading-surface[data-theme=blueprint] {
  --note-paper: #173356;
  --note-ink: #e6eef8;
  --note-muted: #a9bfd9;
  --note-line: #36547a;
  --note-accent: #9fd0ff;
  --note-code: #21416a;
  --note-marker: #30598a;
  --note-marker-ink: #e6eef8;
  --note-rule: #9fd0ff2e;
  --note-dot: #9fd0ff4d;
  --note-margin: #ffb07a3b;
  --note-series-1: #9fd0ff;
  --note-series-2: #ffb07a;
  --note-series-3: #8fe0b4;
  --note-series-4: #d0b4ff;
  color-scheme: dark;
}
.reading-surface[data-typography=clean] {
  --note-font: Haskoy, Arial, sans-serif;
  --note-heading: Haskoy, Arial, sans-serif;
  --note-heading-weight: 600;
  --note-h1: 2.1em;
}
.reading-surface[data-typography=mono] {
  --note-font: ui-monospace, SFMono-Regular, Consolas, monospace;
  --note-heading: ui-monospace, SFMono-Regular, Consolas, monospace;
  --note-heading-weight: 600;
  --note-h1: 2.1em;
}
.reading-surface[data-width=wide] { --note-width: 88ch; }
.reading-surface[data-size=large] { --note-size: 19px; }
.reading-surface[data-background=lined] {
  background-image:
    linear-gradient(90deg, transparent calc(var(--note-gutter) - 1px), var(--note-margin) calc(var(--note-gutter) - 1px), var(--note-margin) var(--note-gutter), transparent var(--note-gutter)),
    repeating-linear-gradient(180deg, transparent 0, transparent calc(var(--note-rule-gap) - 1px), var(--note-rule) calc(var(--note-rule-gap) - 1px), var(--note-rule) var(--note-rule-gap));
}
.reading-surface[data-background=dotted] {
  background-image: radial-gradient(circle, var(--note-dot) .8px, transparent .9px);
  background-size: 20px 20px;
  background-position: 0 0;
}
.reading-surface[data-background=textured] {
  /* Original embedded grain: no image download or remote dependency in exports. */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='grain' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' seed='8' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23grain)' opacity='.14'/%3E%3C/svg%3E");
  background-size: 160px 160px;
}
.reading-surface .pane-label { color: var(--note-muted); }
.prose, .prose *, .prose *::before, .prose *::after {
  /* Standalone exports must not depend on the app shell's box-sizing reset. */
  box-sizing: border-box;
}
.prose {
  width: 100%;
  max-width: calc(var(--note-width) + 76px);
  margin: 0 auto;
  padding: 8px 38px 48px;
  font: var(--note-size)/1.85 var(--note-font);
  overflow-wrap: anywhere;
}
.prose > :first-child { margin-top: 12px; }
.prose h1, .prose h2, .prose h3, .prose h4, .prose h5, .prose h6 {
  color: var(--note-ink);
  font-family: var(--note-heading);
  font-weight: var(--note-heading-weight);
  line-height: 1.2;
  letter-spacing: -.015em;
  margin: 1.6em 0 .65em;
  text-wrap: balance;
}
.prose h1 { font-size: var(--note-h1); margin-bottom: .7em; }
.prose h2 { font-size: 1.85em; }
.prose h3 { font-size: 1.4em; }
.prose h4 { font-size: 1.15em; }
.prose h5, .prose h6 { font-size: 1em; }
.prose p { margin: 1em 0; }
.prose a { color: var(--note-accent); text-underline-offset: 3px; }
.prose a:focus-visible { outline: 2px solid var(--note-accent); outline-offset: 3px; }
.prose :is(pre, table, .table-scroll):focus-visible { outline: 2px solid var(--note-accent); outline-offset: 3px; }
.prose blockquote {
  margin: 1.5em 0;
  padding: 1px 20px;
  border-left: 2px solid var(--note-accent);
  color: var(--note-muted);
  font-style: italic;
}
.prose ul, .prose ol { padding-left: 1.5em; }
.prose li { margin: .35em 0; }
.prose input { accent-color: var(--note-accent); }
.prose pre {
  background: var(--note-code);
  padding: 18px;
  overflow: auto;
  border: 1px solid var(--note-line);
  border-radius: var(--note-card-radius);
  line-height: 1.65;
}
.prose code {
  font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: .82em;
  background: var(--note-code);
  padding: .15em .3em;
  border-radius: 3px;
}
.prose pre code { font-size: .82em; padding: 0; border-radius: 0; }
.prose table { width: 100%; border-collapse: collapse; display: block; overflow: auto; font-size: .9em; }
/* A table inside .table-scroll keeps real table layout; the wrapper scrolls instead. */
.prose .table-scroll { overflow: auto; }
.prose .table-scroll > table { display: table; overflow: visible; }
/* Scroll cue: a table wider than the page fades at the edge that has more to read. Driven by the table's own scroll position,
   so no script is needed, a table that fits shows nothing, and browsers without scroll-driven animations simply show no cue. */
@property --fade-start { syntax: '<length>'; inherits: false; initial-value: 0px; }
@property --fade-end { syntax: '<length>'; inherits: false; initial-value: 0px; }
@keyframes table-scroll-cue {
  0% { --fade-start: 0px; --fade-end: 32px; }
  6% { --fade-start: 0px; --fade-end: 32px; }
  12% { --fade-start: 32px; --fade-end: 32px; }
  88% { --fade-start: 32px; --fade-end: 32px; }
  94% { --fade-start: 32px; --fade-end: 0px; }
  100% { --fade-start: 32px; --fade-end: 0px; }
}
@supports (animation-timeline: scroll()) {
  .prose :is(table, .table-scroll) {
    animation: table-scroll-cue linear both;
    animation-timeline: scroll(self inline);
    -webkit-mask-image: linear-gradient(to right, transparent, #000 var(--fade-start), #000 calc(100% - var(--fade-end)), transparent);
    mask-image: linear-gradient(to right, transparent, #000 var(--fade-start), #000 calc(100% - var(--fade-end)), transparent);
  }
  .prose .table-scroll > table { animation: none; -webkit-mask-image: none; mask-image: none; }
}
.prose th, .prose td {
  border-bottom: 1px solid var(--note-line);
  padding: 9px 14px;
  /* Keep dense tables readable; scroll the table instead of crushing each word. */
  min-width: 12ch;
  overflow-wrap: normal;
}
.prose th { background: var(--note-code); }
.prose th:not([align]), .prose td:not([align]) { text-align: left; }
.prose hr { border: 0; border-top: 1px solid var(--note-line); margin: 2em 0; }
.prose img { max-width: 100%; height: auto; border-radius: 6px; }
.prose .image-placeholder { color: var(--note-muted); font-size: .9em; }
/* NF-087: a link to a project file that is not available to this viewer. The notice is generated, so editing never saves it. */
.prose a.nf-file-missing { color: var(--note-muted); text-decoration: line-through; }
.prose a.nf-file-missing::after { content: " (file not available)"; display: inline-block; margin-left: .25em; text-decoration: none; font-size: .9em; }
/* NF-085: a remote image waits for a click; the button is the only control. */
.prose .nf-remote { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 6px 10px; border: 1px solid var(--note-line); border-radius: var(--note-card-radius, 6px); background: var(--note-code); overflow-wrap: anywhere; }
.prose .nf-load { min-height: 44px; padding: 4px 14px; border: 1px solid var(--note-line); border-radius: var(--note-card-radius, 6px); background: var(--note-paper); color: var(--note-ink); font: inherit; font-size: .95em; cursor: pointer; }
.prose .nf-load:hover { border-color: var(--note-accent); }
.prose .nf-load:focus-visible { outline: 2px solid var(--note-accent); outline-offset: 2px; }
/* NF-035: an attachment waiting for its URL. */
.prose .nf-attachment-wait { display: inline-block; padding: 6px 10px; border: 1px dashed var(--note-line); border-radius: var(--note-card-radius, 6px); }
@media (max-width: 750px) {
  .reading-surface { --note-gutter: 12px; --note-h1: 2.3em; }
  .prose { padding: 8px 24px 32px; }
}
@media print {
  .reading-surface[data-theme] {
    --note-paper: white;
    --note-ink: #222;
    --note-muted: #555;
    --note-line: #ccc;
    --note-accent: #333;
    --note-code: #f4f4f4;
    --note-marker: #f4f4f4;
    --note-marker-ink: #333;
    --note-series-1: #2a6fc4;
    --note-series-2: #c4531f;
    --note-series-3: #12856a;
    --note-series-4: #7a52c8;
    /* Keep print output ink-friendly; paper effects remain in HTML exports. */
    background: white !important;
    color: #222;
    color-scheme: light;
  }
  .prose { padding: 0; }
  .prose h1, .prose h2, .prose h3 { break-after: avoid; }
  .prose pre, .prose blockquote, .prose tr { break-inside: avoid; }
  .prose pre { white-space: pre-wrap; overflow: visible; }
  .prose .table-scroll { overflow: visible; animation: none; -webkit-mask-image: none; mask-image: none; }
  .prose table { display: table; table-layout: fixed; overflow: visible; animation: none; -webkit-mask-image: none; mask-image: none; }
  .prose th, .prose td { min-width: 0; padding: 6px 8px; overflow-wrap: anywhere; }
}

/* Visual Markdown blocks share the note's colors, fonts and export styles. */
.prose .checklist,.prose .progress-block{margin:1.5em 0;padding:20px 22px;border:1px solid var(--note-line);border-radius:var(--note-card-radius);background:var(--note-paper);line-height:1.6}
.prose .checklist-summary,.prose .progress-label{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;font:500 .8em/1.5 var(--note-font)}
.prose .checklist-summary{margin-bottom:10px;color:var(--note-muted)}
.prose .checklist-summary span:first-child{text-transform:uppercase;letter-spacing:.09em;font-size:.85em}
.prose .completion-bar{display:block;width:100%;height:5px;border:0;border-radius:6px;overflow:hidden;background:var(--note-code);color:var(--note-accent);accent-color:var(--note-accent);appearance:none}
.prose .completion-bar::-webkit-progress-bar{background:var(--note-code);border-radius:6px}
.prose .completion-bar::-webkit-progress-value{background:var(--note-accent);border-radius:6px}
.prose .completion-bar::-moz-progress-bar{background:var(--note-accent);border-radius:6px}
.prose .task-list{padding-left:0;list-style:none;margin:16px 0 0}
.prose .task-list .task-list{margin:10px 0 0;padding:2px 0 2px 14px;border-left:1px solid var(--note-line)}
.prose .task-list>li:not(.task-item){list-style:disc;margin-left:24px}
.prose .task-item{display:flex;align-items:flex-start;gap:12px;margin:0;padding:9px 0;line-height:1.65}
.prose .task-content{flex:1;min-width:0}
.prose .task-line p{margin:0}
.prose .task-check{display:block;position:relative;flex:none;width:20px;height:20px;border:1px solid var(--note-muted);border-radius:5px 6px 4px 5px;margin-top:3px;color:var(--note-paper)}
.prose .task-check input{position:absolute;width:100%;height:100%;margin:0;opacity:0}
.prose .task-check:has(input:not(:disabled)){cursor:pointer}.prose .task-check:has(input:not(:disabled)):hover{border-color:var(--note-accent)}.prose .task-check:focus-within{outline:2px solid var(--note-accent);outline-offset:2px}.prose .task-check svg{display:block;pointer-events:none;width:100%;height:100%;stroke:currentColor;stroke-width:2;opacity:0}
.prose .is-complete>.task-check{border-color:var(--note-accent);background:var(--note-accent)}
.prose .is-complete>.task-check svg{opacity:1}
.prose .is-complete>.task-content>.task-line{color:var(--note-muted);text-decoration:line-through;text-decoration-color:var(--note-line)}
.prose .progress-row+.progress-row{margin-top:22px}
.prose .progress-label{margin-bottom:10px;font-size:.9em}
.prose .progress-label>span:first-child{min-width:0}
.prose .progress-detail{flex:none;color:var(--note-muted);font-size:.85em;font-variant-numeric:tabular-nums;white-space:nowrap}
.prose .timeline{list-style:none;padding:0;margin:2em 0}
.prose .timeline-entry{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr);gap:18px;margin:0;padding:0 0 26px}
.prose .timeline-entry:not(:last-child)::before{content:'';position:absolute;left:16px;top:34px;bottom:0;border-left:1px solid var(--note-line)}
.prose .timeline-entry:last-child{padding-bottom:0}
.prose .timeline-marker{display:flex;align-items:center;justify-content:center;position:relative;width:34px;height:34px;border:1px solid var(--note-muted);border-radius:48% 52% 47% 53%;background:var(--note-marker);color:var(--note-marker-ink);font:500 11px/1 var(--note-font);font-variant-numeric:tabular-nums}
.prose .timeline-content{min-width:0;padding-top:3px}
.prose .timeline-content>h3{margin:0 0 .6em;font-size:1.4em}
.prose .timeline-content>p{margin:.5em 0;color:var(--note-muted);font-size:.95em}
.prose .timeline-content>.checklist{margin:16px 0 0}
.prose .timeline-content>:last-child{margin-bottom:0}
@media(max-width:750px){.prose .checklist,.prose .progress-block{padding:16px}.prose .timeline-entry{grid-template-columns:30px minmax(0,1fr);gap:12px}.prose .timeline-marker{width:30px;height:30px}.prose .timeline-entry:not(:last-child)::before{left:14px;top:30px}.prose .task-item{gap:10px}}
@media print{.prose .progress-row,.prose .timeline-entry,.prose .task-item{break-inside:avoid}.prose .completion-bar,.prose .task-check{print-color-adjust:exact;-webkit-print-color-adjust:exact}}

/* Read-only board view (NF-021): lanes of cards over a table. Stacks on phones; scrolls sideways on wide screens. */
.prose .nf-view{margin:1.5em 0}
/* Board, calendar and chart views may grow past the text measure, up to 60rem inside the reading surface, so a
   three-lane board or a full week fits on a desktop. Never narrower than the text; no change in Split view or print. */
.preview-pane.reading-surface,body.reading-surface{container-type:inline-size}
@media screen{.prose .nf-view{--nf-view-width:max(100%,min(60rem,100cqi - 4rem));width:var(--nf-view-width);margin-left:calc((100% - var(--nf-view-width)) / 2)}}
.prose .nf-view-switch{display:inline-flex;margin:0 0 12px;border:1px solid var(--note-line);border-radius:var(--note-card-radius);overflow:hidden}
.prose .nf-view-switch button{min-height:44px;min-width:44px;padding:6px 16px;border:0;background:transparent;color:var(--note-ink);font:inherit;font-size:.85em;cursor:pointer}
.prose .nf-view-switch button+button{border-left:1px solid var(--note-line)}
.prose .nf-view-switch button[aria-pressed=true]{background:var(--note-marker);color:var(--note-marker-ink);font-weight:600}
.prose .nf-view-switch button:focus-visible,.prose .nf-board:focus-visible{outline:2px solid var(--note-accent);outline-offset:2px}
.prose .nf-view-note{margin:.5em 0;color:var(--note-muted);font-size:.9em}
.prose .nf-board{display:flex;gap:14px;align-items:flex-start;overflow-x:auto;padding-bottom:8px}
.prose .nf-lane{flex:0 0 17rem;min-width:0;border:1px solid var(--note-line);border-radius:var(--note-card-radius);background:var(--note-code);padding:10px}
.prose .nf-lane-head{display:flex;justify-content:space-between;gap:8px;margin-bottom:8px;font-size:.85em;font-weight:600;overflow-wrap:anywhere}
.prose .nf-lane-count{flex:none;color:var(--note-muted);font-weight:400}
.prose .nf-lane-empty{margin:0;color:var(--note-muted);font-size:.85em}
.prose .nf-cards{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.prose .nf-card{min-width:0;border:1px solid var(--note-line);border-radius:var(--note-card-radius);background:var(--note-paper);padding:10px 12px;font-size:.88em;line-height:1.5;overflow-wrap:anywhere}
.prose .nf-card-id{display:block;color:var(--note-muted);font-size:.8em;letter-spacing:.04em}
.prose .nf-card p{margin:.2em 0}
.prose .nf-card-title{font-weight:600}
.prose .nf-untitled{color:var(--note-muted);font-style:italic;font-weight:400}
.prose .nf-card-text{color:var(--note-muted)}
.prose .nf-card-fields{margin:.4em 0 0;display:grid;gap:2px}
.prose .nf-card-fields div{display:flex;gap:6px;flex-wrap:wrap}
.prose .nf-card-fields dt{color:var(--note-muted)}
.prose .nf-card-fields dt::after{content:':'}
.prose .nf-card-fields dd{margin:0}
.prose .nf-card-note{color:var(--note-muted);font-size:.85em;border-left:2px solid var(--note-accent);padding-left:8px}
.prose .nf-not-shown{margin-top:12px;font-size:.88em;color:var(--note-muted)}
.prose .nf-not-shown-title{margin:0 0 .3em;font-weight:600;color:var(--note-ink)}
.prose .nf-not-shown ul{margin:0;padding-left:1.2em}
@media(max-width:750px){.prose .nf-board{display:grid;overflow:visible}.prose .nf-lane{flex:none}}
@media print{.prose .nf-view-switch{display:none}.prose .nf-board{display:grid;overflow:visible}.prose .nf-lane,.prose .nf-card{break-inside:avoid}}

/* Calendar and agenda (NF-023): a month grid per month with events; on phones each day with events becomes a row. */
.prose .nf-calendar{overflow-x:auto}
.prose .nf-view-switch button:focus-visible,.prose .nf-event:focus-visible,.prose .nf-calendar:focus-visible,.prose .nf-located:focus-visible{outline:2px solid var(--note-accent);outline-offset:2px}
.prose .nf-cal{width:100%;table-layout:fixed;border-collapse:collapse;margin:0 0 16px;font-size:.85em}
.prose .nf-cal caption{caption-side:top;text-align:left;font-weight:600;padding:0 0 6px}
.prose .nf-cal th,.prose .nf-cal td{border:1px solid var(--note-line);padding:4px 6px;vertical-align:top;overflow-wrap:anywhere}
.prose .nf-cal th{color:var(--note-muted);font-weight:400;text-align:left}
.prose .nf-cal abbr{text-decoration:none}
.prose .nf-cal-pad{background:var(--note-code)}
.prose .nf-cal-num{display:block;color:var(--note-muted);font-size:.85em}
.prose .nf-cal-weekday{display:none}
.prose .nf-events{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.prose .nf-event{display:block;width:100%;min-height:44px;margin:0;padding:4px 8px;border:1px solid var(--note-line);border-radius:var(--note-card-radius);background:var(--note-paper);color:var(--note-ink);font:inherit;font-size:.95em;line-height:1.4;text-align:left;cursor:pointer;overflow-wrap:anywhere}
.prose .nf-event-time{color:var(--note-muted);font-size:.85em}
.prose .nf-event-title{font-weight:600}
.prose .nf-event-text,.prose .nf-event-note{display:block;color:var(--note-muted);font-size:.9em}
.prose .nf-event-note{border-left:2px solid var(--note-accent);padding-left:8px;margin-top:2px}
.prose .nf-agenda-day{margin:0 0 14px}
.prose .nf-agenda-head{margin:0 0 6px;font-size:1em}
.prose .nf-located{background:var(--note-marker);color:var(--note-marker-ink)}
@media(max-width:750px){
  .prose .nf-cal,.prose .nf-cal tbody,.prose .nf-cal tr,.prose .nf-cal td{display:block;width:auto}
  .prose .nf-cal caption{display:block}
  .prose .nf-cal thead,.prose .nf-cal td.nf-cal-pad,.prose .nf-cal td.nf-cal-quiet{display:none}
  .prose .nf-cal td{border:0;border-top:1px solid var(--note-line)}
  .prose .nf-cal-weekday{display:inline}
}
@media print{.prose .nf-event{break-inside:avoid}}

/* Sandboxed example embeds (NF-104): the frame on screen; print and exports show the path instead. */
.prose .nf-embed{margin:1.5em 0}
.prose .nf-embed iframe{display:block;box-sizing:border-box;width:100%;height:420px;max-height:70vh;border:1px solid var(--note-line);border-radius:var(--note-card-radius);background:var(--note-paper)}
.prose .nf-embed-fallback{color:var(--note-muted);font-size:.9em}
.prose .nf-embed-print{display:none}
/* NF-090: a project CSV shown as a read-only table; the caption names and downloads the source file. */
.prose .nf-csv .table-scroll{margin:0}
.prose .nf-csv-source{margin:6px 0 0;color:var(--note-muted);font-size:.85em;overflow-wrap:anywhere}
@media print{.prose .nf-embed iframe{display:none}.prose .nf-embed-print{display:block;margin:0}}

/* Charts and counters (NF-044): static SVG that scales with the page; series colors are the --note-series-* tokens. */
.prose .nf-chart{margin:0;max-width:28rem}
.prose .nf-chart-plot{display:block;width:100%;height:auto;overflow:visible;font:11px var(--note-font);print-color-adjust:exact;-webkit-print-color-adjust:exact}
.prose .nf-chart-grid{stroke:var(--note-line);stroke-width:1}
.prose .nf-chart-base{stroke:var(--note-muted);stroke-width:1}
.prose .nf-chart-axis{fill:var(--note-muted)}
.prose .nf-chart-value{fill:var(--note-ink);font-weight:600}
.prose .nf-chart-line{fill:none;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.prose .nf-chart-mark{stroke:var(--note-paper);stroke-width:1.5}
.prose .nf-s1{fill:var(--note-series-1);stroke:var(--note-series-1)}
.prose .nf-s2{fill:var(--note-series-2);stroke:var(--note-series-2)}
.prose .nf-s3{fill:var(--note-series-3);stroke:var(--note-series-3)}
.prose .nf-s4{fill:var(--note-series-4);stroke:var(--note-series-4)}
.prose .nf-chart-bar{stroke:none}
.prose .nf-chart-line.nf-s1,.prose .nf-chart-line.nf-s2,.prose .nf-chart-line.nf-s3,.prose .nf-chart-line.nf-s4{fill:none}
.prose .nf-chart-mark.nf-s1,.prose .nf-chart-mark.nf-s2,.prose .nf-chart-mark.nf-s3,.prose .nf-chart-mark.nf-s4{stroke:var(--note-paper)}
.prose .nf-chart-legend{display:flex;flex-wrap:wrap;gap:4px 16px;list-style:none;margin:8px 0 0;padding:0;font-size:.85em;line-height:1.5}
.prose .nf-chart-legend li{display:flex;align-items:center;gap:6px;margin:0}
.prose .nf-chart-key{flex:none;width:18px;height:10px;overflow:visible;print-color-adjust:exact;-webkit-print-color-adjust:exact}
.prose .nf-counters{display:flex;flex-wrap:wrap;gap:12px;margin:0}
.prose .nf-counter{flex:1 1 9rem;min-width:0;border:1px solid var(--note-line);border-radius:var(--note-card-radius);background:var(--note-paper);padding:12px 16px;line-height:1.3}
.prose .nf-counter dt{color:var(--note-muted);font-size:.85em}
.prose .nf-counter dd{margin:0}
.prose .nf-counter-value{display:block;font:var(--note-heading-weight) 2em/1.2 var(--note-heading);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.prose .nf-counter-note{display:block;color:var(--note-muted);font-size:.8em}
@media print{.prose .nf-chart,.prose .nf-counter{break-inside:avoid}}
/* NF-118: a web embed waits for Load, then shows a framed page (16:9 for video hosts, 166px for audio players) with an Open in new tab link. */
.prose .nf-embed-web iframe{height:480px;max-height:none}
.prose .nf-embed-web.nf-embed-video iframe{height:auto;aspect-ratio:16/9}
.prose .nf-embed-web.nf-embed-audio iframe{height:166px}
.prose .nf-embed-open{margin:6px 0 0;font-size:.9em}
.prose .nf-embed-print a{overflow-wrap:anywhere}
@media (max-width:750px){.prose .nf-embed-web iframe{height:360px}.prose .nf-embed-web.nf-embed-video iframe{height:auto}.prose .nf-embed-web.nf-embed-audio iframe{height:166px}}
@media print{.prose .nf-embed-open,.prose .nf-embed-web .nf-remote{display:none}}
/* Image grid and gallery (NF-117): a list of images from one paragraph. No animation, so reduced motion is respected by having none. */
.prose .nf-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:12px}
.prose .nf-tile,.prose .nf-slide{position:relative;margin:0}
.prose .nf-tile img,.prose .nf-tile .image-placeholder{display:block;width:100%;aspect-ratio:1;object-fit:cover}
.prose .nf-tile .image-placeholder{box-sizing:border-box;padding:12px;border:1px solid var(--note-line);border-radius:6px;overflow:hidden;overflow-wrap:anywhere}
.prose .nf-images figcaption{margin-top:6px;color:var(--note-muted);font-size:.85em;overflow-wrap:anywhere}
.prose .nf-view.nf-gallery{width:auto;margin-left:0}
.prose .nf-slides{display:grid;gap:20px;border-radius:6px}
.prose .nf-slide img{display:block;width:auto;max-width:100%;max-height:min(70vh,32rem);margin:0 auto;object-fit:contain}
.prose .nf-slide figcaption{text-align:center}
.prose .nf-slide[hidden]{display:none}
.prose .nf-gallery-bar{display:flex;align-items:center;justify-content:center;gap:12px;margin:10px 0}
.prose .nf-gallery-count{min-width:5em;text-align:center;color:var(--note-muted);font-size:.9em;font-variant-numeric:tabular-nums}
.prose .nf-gallery-step,.prose .nf-image-add,.prose .nf-image-edit{min-height:44px;min-width:44px;padding:6px 16px;border:1px solid var(--note-line);border-radius:var(--note-card-radius);background:transparent;color:var(--note-ink);font:inherit;font-size:.85em;cursor:pointer}
.prose .nf-thumbs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.prose .nf-thumb{box-sizing:border-box;width:4.5rem;height:4.5rem;min-width:44px;min-height:44px;padding:2px;border:2px solid var(--note-line);border-radius:6px;background:transparent;color:var(--note-muted);font:inherit;font-size:.7em;overflow:hidden;cursor:pointer}
.prose .nf-thumb[aria-pressed=true]{border-color:var(--note-accent)}
.prose .nf-thumb img,.prose .nf-thumb .image-placeholder{display:block;width:100%;height:100%;object-fit:cover;border-radius:3px}
.prose .nf-image-add{margin-top:12px}
.prose .nf-image-edit{position:absolute;top:6px;right:6px;background:var(--note-paper)}
.prose .nf-gallery-step:focus-visible,.prose .nf-thumb:focus-visible,.prose .nf-slides:focus-visible,.prose .nf-image-add:focus-visible,.prose .nf-image-edit:focus-visible{outline:2px solid var(--note-accent);outline-offset:2px}
@media print{
  .prose .nf-gallery-bar,.prose .nf-thumbs,.prose .nf-image-add,.prose .nf-image-edit{display:none}
  .prose .nf-slide[hidden]{display:block}
  .prose .nf-tile,.prose .nf-slide{break-inside:avoid}
}
/* Callouts and expandable sections (NF-018). Colors come from the look's series tokens; the label tells kinds apart, not color alone. */
.prose .nf-callout{--callout:var(--note-series-1);margin:1.5em 0;padding:10px 18px;border:1px solid color-mix(in srgb,var(--callout) 35%,var(--note-line));border-left:4px solid var(--callout);border-radius:var(--note-card-radius);background:color-mix(in srgb,var(--callout) 9%,var(--note-paper))}
.prose .nf-callout-tip{--callout:var(--note-series-3)}
.prose .nf-callout-important{--callout:var(--note-series-4)}
.prose .nf-callout-warning,.prose .nf-callout-caution{--callout:var(--note-series-2)}
.prose .nf-callout-caution{border-left-width:7px}
.prose .nf-callout .nf-callout-label{margin:0 0 .2em;color:color-mix(in srgb,var(--callout) 65%,var(--note-ink));font-size:.8em;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.prose .nf-callout>p:not(.nf-callout-label){margin:.5em 0}
.prose .nf-callout>:last-child{margin-bottom:.2em}
.prose .nf-section{margin:1.2em 0;border:1px solid var(--note-line);border-radius:var(--note-card-radius)}
.prose .nf-section-head{display:flex;align-items:center}
.prose .nf-section-head>:last-child{flex:1;min-width:0}
.prose .nf-section-toggle{display:flex;align-items:center;gap:8px;min-height:44px;min-width:44px;padding:6px 12px;border:0;background:transparent;color:var(--note-ink);font:inherit;text-align:left;cursor:pointer}
.prose .nf-section-toggle svg{flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.prose .nf-section-toggle[aria-expanded=true] svg{transform:rotate(90deg)}
@media (prefers-reduced-motion:no-preference){.prose .nf-section-toggle svg{transition:transform .12s}}
.prose .nf-section-title{font-weight:600;overflow-wrap:anywhere}
.prose .nf-section-toggle:focus-visible{outline:2px solid var(--note-accent);outline-offset:-2px;border-radius:var(--note-card-radius)}
.prose .nf-section-body{padding:2px 18px 6px;border-top:1px solid var(--note-line)}
.prose .nf-section-body>:first-child{margin-top:.6em}
.prose .nf-section-body>:last-child{margin-bottom:.4em}
.prose details.nf-section>summary{padding:10px 16px;font-weight:600;cursor:pointer}
.prose details.nf-section>:not(summary){margin-left:18px;margin-right:18px}
@media print{
  .prose .nf-callout,.prose .nf-section{break-inside:avoid;print-color-adjust:exact;-webkit-print-color-adjust:exact}
  .prose .nf-section-body[hidden]{display:block}
  .prose .nf-section-toggle svg{display:none}
}
/* Table sort and filter (NF-019): controls under a table; the choices are view state and hide on print (the status line stays). */
.prose .nf-sf{margin:.2em 0 1.4em;font-size:.85em}
.prose .nf-sf-toggle,.prose .nf-sf-button{min-height:44px;min-width:44px;padding:6px 14px;border:1px solid var(--note-line);border-radius:var(--note-card-radius);background:transparent;color:var(--note-ink);font:inherit;cursor:pointer}
.prose .nf-sf-toggle{border-color:transparent;color:var(--note-muted);text-decoration:underline;text-underline-offset:3px}
.prose .nf-sf-controls{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px 14px}
.prose .nf-sf-field{display:flex;flex-direction:column;gap:2px;color:var(--note-muted)}
.prose .nf-sf-field select,.prose .nf-sf-field input{min-height:44px;box-sizing:border-box;padding:6px 10px;border:1px solid var(--note-line);border-radius:6px;background:var(--note-paper);color:var(--note-ink);font:inherit}
.prose .nf-sf-field input{min-width:12rem}
.prose .nf-sf-button:disabled{opacity:.5;cursor:default}
.prose .nf-sf-status{margin:.5em 0 0;color:var(--note-muted)}
.prose .nf-sf-status:empty{display:none}
.prose .nf-sf-toggle:focus-visible,.prose .nf-sf-button:focus-visible,.prose .nf-sf-field select:focus-visible,.prose .nf-sf-field input:focus-visible{outline:2px solid var(--note-accent);outline-offset:2px}
@media (max-width:750px){.prose .nf-sf-field{flex:1 1 100%}.prose .nf-sf-field input{min-width:0}}
@media print{.prose .nf-sf-toggle,.prose .nf-sf-controls{display:none}}
/* Record cards over a table (NF-024): a flat CSS cover from the look's colors, so no image is fetched or needed. */
.prose .nf-gcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:14px;margin:0;padding:0;list-style:none}
.prose .nf-gcard{margin:0}
.prose .nf-gcard-open{display:flex;flex-direction:column;width:100%;height:100%;min-height:44px;padding:0;border:1px solid var(--note-line);border-radius:var(--note-card-radius);background:var(--note-paper);color:var(--note-ink);font:inherit;text-align:left;cursor:pointer;overflow:hidden}
.prose .nf-gcard-open:hover{border-color:var(--note-accent)}
.prose .nf-gcard-open:focus-visible{outline:2px solid var(--note-accent);outline-offset:2px}
.prose .nf-cover{--tone:var(--note-series-1);display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;aspect-ratio:16/6;border-bottom:1px solid var(--note-line);background:color-mix(in srgb,var(--tone) 22%,var(--note-paper));color:color-mix(in srgb,var(--tone) 70%,var(--note-ink));font-family:var(--note-heading);font-size:2.4em;line-height:1}
.prose .nf-cover[data-tone="1"]{--tone:var(--note-series-2)}
.prose .nf-cover[data-tone="2"]{--tone:var(--note-series-3)}
.prose .nf-cover[data-tone="3"]{--tone:var(--note-series-4)}
.prose .nf-cover[data-tone="4"]{--tone:var(--note-accent)}
.prose .nf-cover[data-tone="5"]{--tone:var(--note-marker)}
.prose .nf-gcard-body{display:flex;flex-direction:column;gap:6px;box-sizing:border-box;width:100%;padding:12px 14px}
.prose .nf-gcard-title{font-weight:600;overflow-wrap:anywhere}
.prose .nf-gcard-text{color:var(--note-muted);font-size:.9em;overflow-wrap:anywhere}
.prose .nf-gcard-fields{display:flex;flex-wrap:wrap;gap:4px 12px;color:var(--note-muted);font-size:.85em}
.prose .nf-gcard-label{margin-right:.2em;font-size:.8em;letter-spacing:.05em;text-transform:uppercase}
@media print{.prose .nf-gcard{break-inside:avoid}.prose .nf-cover{print-color-adjust:exact;-webkit-print-color-adjust:exact}}
