body.sketchbook-page{--page-aspect: .68;--sketchbook-ink: var(--color-ink);--sketchbook-paper: #fffaf0;color:var(--sketchbook-ink);background:var(--color-page)}.sketchbook-page nav{opacity:1;pointer-events:auto}.sketchbook-main{display:grid;min-height:100dvh;padding:clamp(82px,10vh,112px) clamp(20px,5vw,72px) clamp(58px,8vh,88px);place-items:center}.sketchbook-viewer{--caption-space: 76px;--spread-width: min( 76vw, 980px, calc((100dvh - 250px - var(--caption-space)) * 2 * var(--page-aspect)) );display:grid;gap:clamp(16px,2.5vh,26px);justify-items:center}.book-layout{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(16px,3.5vw,62px);align-items:center}.sketchbook{position:relative;z-index:1;display:grid;width:var(--spread-width);grid-template-columns:repeat(2,minmax(0,1fr));perspective:1600px;touch-action:pan-y;user-select:none;-webkit-user-select:none}.sketchbook.is-closed{cursor:pointer}.sketchbook.is-closed:not([aria-busy=true]){transform:translate(-25%)}.sketchbook.is-cover-turn .sketch-page,.sketchbook.is-cover-turn .book-gutter,.sketchbook.is-cover-turn:before{visibility:hidden}.sketchbook.is-closed:before{left:50%}.sketchbook.is-closed .sketch-page-left,.sketchbook.is-closed .book-gutter{visibility:hidden}.sketch-page.is-cover{border-radius:3px 6px 6px 3px}.sketchbook:before{position:absolute;z-index:-1;border-radius:3px;box-shadow:0 24px 24px #4d2a202e;content:"";top:0;right:0;bottom:0;left:0;pointer-events:none}.sketchbook[aria-busy=true] .sketch-page img{visibility:hidden}.sketch-page{position:relative;aspect-ratio:var(--page-aspect);overflow:hidden;background:var(--sketchbook-paper);backface-visibility:hidden;transform-style:preserve-3d}.sketch-page:after{position:absolute;z-index:2;border:1px solid rgba(26,26,26,.16);border-radius:inherit;content:"";top:0;right:0;bottom:0;left:0;pointer-events:none}.sketch-page img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}.sketch-page-left{border-radius:3px 0 0 3px}.sketch-page-right{border-radius:0 3px 3px 0}.sketch-page.is-blank img{display:none}.sketch-page.is-missing img{opacity:0}.book-gutter{position:absolute;top:0;bottom:0;left:50%;z-index:8;width:.01%;pointer-events:none;background:#000;transform:translate(-50%);opacity:.6;transition:opacity 45ms linear}.sketchbook[aria-busy=true] .book-gutter{opacity:.18}.book-gutter.is-page-crossing{opacity:0}.page-turn-canvas{position:absolute;z-index:7;display:block;pointer-events:none}.page-turn-canvas[hidden]{display:none}.spread-button{display:inline-grid;width:clamp(44px,4.5vw,64px);aspect-ratio:1;color:inherit;font:inherit;font-size:clamp(1rem,1.4vw,1.3rem);background:rgb(var(--color-surface-rgb) / .78);border:1px solid var(--sketchbook-ink);border-radius:50%;cursor:pointer;place-items:center;touch-action:manipulation;transition:color .18s ease,background-color .18s ease,opacity .18s ease}.spread-button:disabled{cursor:default;opacity:.22}@media (hover: hover){.spread-button:not(:disabled):hover{color:var(--color-on-ink-bright);background:var(--sketchbook-ink)}}.spread-titles,.spread-dates{position:relative;width:var(--spread-width);text-align:center}.caption-layer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.caption-layer.is-single-picture{grid-template-columns:minmax(0,1fr)}.caption-layer.is-incoming{position:absolute;top:0;right:0;bottom:0;left:0}.spread-title,.spread-date{min-height:1lh;margin:0;padding-inline:.5em}.spread-title{font-size:clamp(.95rem,1.2vw,1.2rem);font-weight:300;line-height:1.2;letter-spacing:.01em}.spread-date{color:rgb(var(--color-ink-rgb) / .62);font-size:clamp(.65rem,.72vw,.78rem);font-weight:500;line-height:1.4;letter-spacing:.14em}.page-counter{display:flex;gap:.9em;align-items:center;margin:0;padding:.7em 1em;color:inherit;font:inherit;font-size:clamp(.62rem,.68vw,.74rem);font-variant-numeric:tabular-nums;font-weight:500;letter-spacing:.12em;background:none;border:0;border-radius:999px;cursor:pointer;touch-action:manipulation}.page-counter.is-at-cover{visibility:hidden}@media (hover: hover){.page-counter:hover .page-counter-line{background:rgb(var(--color-ink-rgb) / .4)}}[data-counter-total]{color:rgb(var(--color-ink-rgb) / .5)}.page-counter-line{position:relative;width:clamp(72px,8vw,120px);height:1px;overflow:hidden;background:rgb(var(--color-ink-rgb) / .2)}.page-counter-line:after{position:absolute;top:0;right:0;bottom:0;left:0;content:"";background:currentColor;transform:scaleX(var(--progress, 0));transform-origin:left;transition:transform .45s ease}html[data-layout=single-column] .sketchbook-main{padding:calc(var(--mobile-utility-size) + 38px) 4vw max(58px,env(safe-area-inset-bottom))}html[data-layout=single-column] .book-layout{position:relative;display:block}html[data-layout=single-column] .sketchbook-viewer{--spread-width: min( 92vw, calc((100dvh - 225px - var(--caption-space)) * 2 * var(--page-aspect)) )}html[data-layout=single-column] .spread-button{position:absolute;top:50%;z-index:9;width:clamp(42px,12vw,56px);background:rgb(var(--color-surface-rgb) / .92);transform:translateY(-50%)}html[data-layout=single-column] .spread-button:first-child{left:7px}html[data-layout=single-column] .spread-button:last-child{right:7px}.spread-overview{width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:clamp(72px,9vh,104px) clamp(20px,5vw,72px) 48px;overflow-y:auto;color:var(--color-ink);background:var(--color-page);border:0;overscroll-behavior:contain}.spread-overview::backdrop{background:var(--color-page)}.spread-overview-close{top:max(clamp(12px,1.25vw,22px),env(safe-area-inset-top));right:max(clamp(12px,1.25vw,22px),env(safe-area-inset-right));width:clamp(42px,3.4vw,56px)}.spread-overview-title{margin:0 0 clamp(20px,3vh,36px);font-size:clamp(.7rem,.8vw,.85rem);font-weight:500;letter-spacing:.18em;text-align:center;text-transform:uppercase}.spread-overview-list{display:grid;max-width:1280px;margin:0 auto;padding:0;gap:clamp(20px,3vw,40px) clamp(14px,2vw,28px);grid-template-columns:repeat(auto-fill,minmax(clamp(140px,17vw,220px),1fr));list-style:none}.overview-spread{display:grid;width:100%;padding:0;gap:.5em;color:inherit;font:inherit;text-align:center;background:none;border:0;cursor:pointer;justify-items:center}.overview-pages{display:grid;width:100%;grid-template-columns:repeat(2,minmax(0,1fr));box-shadow:0 8px 14px #4d2a2029;transition:transform .2s ease}.overview-pages img{display:block;width:100%;aspect-ratio:var(--page-aspect);object-fit:cover;background:var(--sketchbook-paper)}.overview-number{font-size:.68rem;font-variant-numeric:tabular-nums;font-weight:500;letter-spacing:.12em}.overview-title{min-height:1lh;font-size:.85rem;font-weight:300;line-height:1.2}.overview-spread[aria-current=true] .overview-pages{outline:1px solid currentColor;outline-offset:5px}@media (hover: hover){.overview-spread:hover .overview-pages{transform:translateY(-3px)}}@media (prefers-reduced-motion: reduce){.spread-button,.page-counter-line:after,.overview-pages{transition:none}}.sketchbook-page #loading-screen{z-index:200}.sketchbook-page #loading-screen:not(.hidden){pointer-events:auto}.sketchbook-close{top:max(clamp(12px,1.25vw,22px),env(safe-area-inset-top));right:max(clamp(12px,1.25vw,22px),env(safe-area-inset-right));z-index:100;width:clamp(42px,3.4vw,56px)}html[data-layout=single-column] .sketchbook-close{top:max(var(--mobile-edge-inset),env(safe-area-inset-top));right:max(var(--mobile-edge-inset),env(safe-area-inset-right));width:var(--mobile-utility-size)}