/* Desktop scrapbook marginalia — uses the wide chapter gutters without competing with copy. */
.scrapbook-margins{position:fixed;inset:0;z-index:4;pointer-events:none;display:block}
.scrap-note{position:absolute;width:112px;color:#17334d;font:500 10px/1.35 'DM Mono',monospace;letter-spacing:.08em;text-transform:uppercase;opacity:0;transition:opacity .35s ease}
.scrap-note:before{content:"";display:block;width:80px;height:62px;margin-bottom:12px;border:1px solid rgba(23,51,77,.48);background:linear-gradient(135deg,#f9f1e5,#e9d2c3);box-shadow:8px 9px 0 rgba(217,125,106,.22);transform:rotate(-6deg) translateY(18px);transition:transform .8s cubic-bezier(.16,1,.3,1)}
.scrap-note:after{content:"";position:absolute;width:46px;height:15px;background:rgba(217,125,106,.5);top:-9px;left:22px;transform:rotate(-11deg)}
.scrap-note.left{left:max(24px,calc((100vw - 1360px)/2));top:30vh}.scrap-note.right{right:max(22px,calc((100vw - 1360px)/2));top:56vh;text-align:right}.scrap-note.right:before{margin-left:auto;transform:rotate(6deg) translateY(18px)}
.scrapbook-margins.is-active .scrap-note{opacity:.85}.scrapbook-margins.is-active .scrap-note:before{transform:rotate(-6deg) translateY(0)}.scrapbook-margins.is-active .scrap-note.right:before{transform:rotate(6deg) translateY(0)}
.scrap-line{position:absolute;left:50%;top:13vh;bottom:11vh;width:1px;background:linear-gradient(transparent,#d97d6a 18%,#d97d6a 82%,transparent);transform:scaleY(0);transform-origin:top;transition:transform 1.15s cubic-bezier(.16,1,.3,1);opacity:.65}.scrapbook-margins.is-active .scrap-line{transform:scaleY(1)}
@media(max-width:1260px){.scrapbook-margins{display:none}}
@media(prefers-reduced-motion:reduce){.scrap-note,.scrap-note:before,.scrap-line{transition:none!important}.scrapbook-margins.is-active .scrap-note{opacity:.75}.scrapbook-margins.is-active .scrap-note:before{transform:rotate(-6deg)!important}.scrapbook-margins.is-active .scrap-note.right:before{transform:rotate(6deg)!important}.scrapbook-margins.is-active .scrap-line{transform:scaleY(1)}}