.notes-heading h3 { line-height: .95; }
.notes-shelf { padding-bottom: clamp(2rem, 4vw, 4rem); }
.notes-shelf-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0 var(--pad) .5rem; }
.notes-shelf-toolbar > p { margin: 0; font-size: .875rem; }
.notes-shelf-controls { display: flex; align-items: center; gap: .6rem; flex-shrink: 0; }
.notes-shelf-controls button { display: grid; place-items: center; width: 3rem; height: 3rem; padding: 0; border: var(--line); border-radius: 50%; background: var(--paper); color: var(--ink); font-size: 1.5rem; cursor: pointer; transition: background .18s ease, color .18s ease; }
.notes-shelf-controls button[aria-disabled="true"] { opacity: .35; cursor: default; }
.notes-shelf-controls button:not([aria-disabled="true"]):hover { background: var(--teal); color: #fff; }
.notes-shelf-controls button:focus-visible { outline: 3px solid var(--teal); outline-offset: 4px; }
.notes-shelf-counter { min-width: 6.5rem; text-align: center; font-size: .875rem; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: .06em; }
.notes-collection { --note-width: clamp(17rem, 28vw, 23rem); position: relative; display: flex; gap: 1.2rem; padding: 1rem var(--pad) 1.25rem; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: var(--pad); scrollbar-width: thin; scrollbar-color: var(--teal) transparent; }
.notes-collection .note-card { --note-tilt: -.65deg; flex: 0 0 var(--note-width); width: var(--note-width); min-width: 0; min-height: 21rem; padding: 1.35rem; text-align: left; cursor: pointer; border: var(--line); border-radius: 0; font: inherit; scroll-snap-align: start; transform: rotate(var(--note-tilt)); transition: transform .22s ease, box-shadow .22s ease; }
.notes-collection .note-card:nth-child(3n+2) { --note-tilt: .65deg; }
.notes-collection .note-card:nth-child(3n) { --note-tilt: -.3deg; }
.notes-collection .note-card strong { margin: 1.2rem 0 .9rem; padding: 0; font-size: clamp(1.85rem, 2.65vw, 2.65rem); line-height: 1.04; letter-spacing: -.055em; overflow-wrap: break-word; }
.notes-collection .note-card > span, .notes-collection .note-card em { font-size: .875rem; }
.notes-collection .note-card .note-excerpt { margin-bottom: 1rem; font: 400 1.125rem/1.5 Georgia, serif; text-transform: none; letter-spacing: 0; }
.notes-collection .note-card em { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: auto; padding-top: .5rem; }
.notes-collection .note-card em span { font-size: 1.5rem; }
.notes-collection .note-card:focus-visible { outline: 3px solid var(--ink); outline-offset: 5px; transform: translateY(-5px) rotate(0); box-shadow: .35rem .35rem 0 var(--ink); }
@media (hover: hover) and (pointer: fine) { .notes-collection .note-card:hover { transform: translateY(-5px) rotate(0); box-shadow: .35rem .35rem 0 var(--ink); } }
@media (hover: none) { .notes-collection .note-card:hover { transform: rotate(var(--note-tilt)); box-shadow: none; } }
.quiet-motion .notes-collection .note-card { transform: none; }
body.naked-note-open { overflow: hidden; }
.naked-note-reader { width: min(56rem, calc(100% - 2rem)); max-height: calc(100svh - 2rem); margin: auto; padding: 0; overflow-y: auto; overscroll-behavior: contain; border: var(--line); border-radius: 0; background: var(--paper); color: var(--ink); box-shadow: .7rem .7rem 0 rgba(0,0,0,.3); }
.naked-note-reader::backdrop { background: rgba(12,36,37,.88); }
.naked-note-toolbar { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .75rem clamp(1rem, 4vw, 2.5rem); border-bottom: var(--line); background: var(--teal); color: #fff; }
.naked-note-toolbar > span { font-size: .875rem; font-weight: 700; }
.naked-note-close, .naked-note-retry { min-height: 44px; padding: .55rem .9rem; border: 2px solid currentColor; background: transparent; color: inherit; font: 700 .875rem/1.4 Arial, sans-serif; cursor: pointer; }
.naked-note-close { display: inline-flex; gap: .8rem; align-items: center; flex-shrink: 0; }
.naked-note-close span { font-size: 1.5rem; line-height: 1; }
.naked-note-close:hover { background: #fff; color: var(--teal); }
.naked-note-reader :focus-visible { outline: 3px solid var(--rust); outline-offset: 4px; }
.naked-note-toolbar :focus-visible { outline-color: var(--gold); }
.naked-note-page { padding: clamp(1.5rem, 5vw, 4rem); }
.naked-note-kicker { margin: 0 0 1.2rem; font: 700 .875rem/1.4 Arial, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--teal); }
.naked-note-page h2 { margin: 0 0 2rem; font: 900 clamp(2.5rem, 6vw, 5.5rem)/1.02 'Arial Black', Arial, sans-serif; letter-spacing: -.06em; text-transform: uppercase; overflow-wrap: break-word; }
.naked-note-listening { margin-bottom: 2.5rem; padding-block: 1.2rem; border-block: 1px solid var(--teal); }
.naked-note-listening label { display: block; margin-bottom: .8rem; font-weight: 700; color: var(--teal); }
.naked-note-listening audio { display: block; width: 100%; min-width: 0; height: 54px; }
.naked-note-audio-detail { margin: .75rem 0 0; font-size: .875rem; color: var(--teal); }
.naked-note-listening a { display: inline-block; margin-top: .75rem; padding-block: .3rem; font-size: .875rem; text-underline-offset: .2em; color: var(--teal); }
.naked-note-audio-error { font-size: .9375rem; }
.naked-note-writing { font: 400 clamp(1.125rem, 1.5vw, 1.25rem)/1.8 Georgia, 'Times New Roman', serif; overflow-wrap: break-word; }
.naked-note-writing p { margin: 0 0 1.35em; white-space: pre-line; }
.naked-note-writing p:last-child { margin-bottom: 0; }
.naked-note-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 900px) { .notes-collection { --note-width: clamp(17rem, 43vw, 23rem); } }
@media (max-width: 540px) {
  .notes-shelf-toolbar { flex-wrap: wrap; }
  .notes-shelf-controls { margin-left: auto; }
  .notes-shelf-counter { min-width: 4.5rem; }
  .notes-collection { --note-width: 78vw; gap: 1rem; }
  .notes-collection .note-card { min-height: 21rem; }
  .notes-collection .note-card strong { font-size: clamp(1.85rem, 7vw, 2.35rem); }
  .naked-note-reader { width: calc(100% - 1rem); max-height: calc(100svh - 1rem); box-shadow: none; }
  .naked-note-toolbar { padding: .65rem 1rem; }
  .naked-note-toolbar > span { max-width: 12rem; }
}
@media (prefers-reduced-motion: reduce) { .notes-collection .note-card { transition: none; transform: none !important; } }