/* A bounded, navigable sketchbook and a consistently framed collection. */
.gallery-section { padding:0; background:#f3f0e8; }
.gallery-heading { max-width:1240px; margin:0 auto; padding:76px 6% 46px; }
.gallery-intro .quiet-link { color:#62506d; border-color:#b9aabf; margin-top:6px; min-height:44px; }
.gallery-intro .sample-note { margin:0 0 10px; }
.sketchbook-track { scroll-margin-top:-36px; height:var(--page-travel,310svh); position:relative; }
.sketchbook-stage { position:sticky; top:0; height:100svh; min-height:660px; display:grid; grid-template-rows:auto 1fr auto; align-items:center; padding:28px 6% 30px; overflow:clip; background:radial-gradient(ellipse at 50% 48%,#eee8f3 0%,#d9d1e0 58%,#c9bed3 100%); isolation:isolate; }
.sketchbook-stage:before { content:'✧'; position:absolute; left:9%; top:46%; font:80px Georgia,serif; color:#87759255; transform:rotate(-12deg); }
.sketchbook-stage:after { content:'a world between the pages'; position:absolute; right:6%; top:50%; writing-mode:vertical-rl; font:italic 17px Georgia,serif; color:#584362; letter-spacing:.03em; }
.book-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; width:min(100%,1080px); margin:auto; }
.book-toolbar .eyebrow { margin:0; font-size:10px; color:#584362; }
.book-toolbar a { font-size:11px; padding:14px 0; min-height:44px; color:#55425e; }
.book-toolbar a span { margin-left:12px; }
.book { width:min(78vw,480px,calc((100svh - 330px) * .76)); aspect-ratio:.76; position:relative; margin:14px auto; perspective:1400px; touch-action:pan-y; }
.book:before { content:''; position:absolute; inset:-7px -9px -12px -12px; background:#675571; border-radius:5px 10px 10px 5px; transform:rotate(-1.2deg); box-shadow:5px 30px 45px #3e294838; }
.book:after { content:''; position:absolute; inset:0; box-shadow:inset 10px 0 15px -14px #392c3c; pointer-events:none; z-index:8; }
.book-pages { position:absolute; inset:0; perspective:1400px; }
.book-page { position:absolute; inset:0; background:#f7f1e5; border:1px solid #e1d7c5; border-radius:2px 7px 7px 2px; transform-origin:0 50%; backface-visibility:hidden; box-shadow:3px 2px 0 #d8cebc,6px 4px 0 #eee5d5,8px 5px 12px #46384b19; }
.book-page:after { content:''; pointer-events:none; position:absolute; inset:0; background:linear-gradient(90deg,#49354c,transparent); opacity:var(--page-shade,0); border-radius:inherit; }
.book-page>button { display:flex; flex-direction:column; width:100%; height:100%; background:transparent; border:0; padding:24px 24px 18px 30px; color:#594b60; }
.book-page-top { display:flex; justify-content:space-between; align-items:center; font-size:9px; letter-spacing:.14em; gap:10px; width:100%; padding-bottom:18px; }
.book-page-top>span { font-size:24px; color:#9b7c9b; line-height:1; }
.book-page .art-mat { flex:1; min-height:0; width:100%; background:#f7f1e5; }
.book-page-bottom { display:flex; width:100%; align-items:center; justify-content:space-between; padding-top:16px; font-size:10px; }
.book-page-bottom>span:first-child { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.book-page-bottom>span:last-child { font-size:19px; flex:none; margin-left:8px; }
.book-binding { position:absolute; z-index:10; left:-17px; top:9%; bottom:9%; display:flex; flex-direction:column; justify-content:space-between; pointer-events:none; }
.book-binding i { width:28px; height:10px; border:2px solid #a499aa; background:linear-gradient(#eee6ed,#938598 55%,#dbd3dc); border-radius:7px; box-shadow:0 2px 2px #4b34572b; }
.book-footer { width:min(100%,480px); margin:auto; }
.book-pagination { display:grid; grid-template-columns:44px 1fr 44px; gap:16px; align-items:center; }
.book-pagination button { height:44px; width:44px; border:1px solid #89739466; border-radius:50%; background:#f5eff866; color:#55415f; font-size:19px; }
.book-pagination button[aria-disabled=true] { opacity:.45; cursor:default; }
.book-caption { text-align:center; min-width:0; }
#book-title { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font:24px/1.15 var(--serif); letter-spacing:-.025em; margin:0 0 7px; overflow-wrap:anywhere; }
#book-counter { display:block; font-size:11px; letter-spacing:.15em; color:#584362; }
.book-progress { margin:12px auto 10px; height:2px; background:#ab98b33b; width:100%; overflow:hidden; }
.book-progress>span { display:block; width:100%; height:100%; background:#80668c; transform-origin:left; transform:scaleX(0); }
.book-hint { text-align:center; color:#584362; font-size:11px; line-height:1.5; margin:10px 0 0; min-height:2.8em; }
.book-jump { display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; align-items:center; font-size:11px; color:#55415f; }
.book-jump select { width:100%; min-width:0; min-height:44px; font:inherit; font-size:16px; background:#f7f2f8; color:#493651; border:1px solid #8b7494; border-radius:7px; padding:10px 28px 10px 10px; text-overflow:ellipsis; }
.book-jump select:focus-visible,.book-pagination button:focus-visible,.book-toolbar a:focus-visible,.book-page button:focus-visible { outline:3px solid #734451; outline-offset:3px; }
.sketchbook-track[data-static=true] { height:auto; }
.sketchbook-track[data-static=true] .sketchbook-stage { position:relative; height:auto; min-height:0; padding-bottom:40px; }
.sketchbook-track[data-static=true] .book { width:min(78vw,400px); margin:28px auto; }
.exhibition { max-width:1240px; margin:auto; padding:70px 6% 0; scroll-margin-top:24px; }
.exhibition-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:30px; }
.exhibition-heading .eyebrow { color:#6e566e; margin:0 0 12px; }
.exhibition-heading h2 { font-size:clamp(34px,4.5vw,56px); }
.exhibition-heading h2 em { color:#83708d; }
.exhibition-heading>p { font-size:11px; line-height:1.8; color:#645669; margin:0; white-space:nowrap; }
.art-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px 24px; align-items:start; }
.art-card:nth-child(even) { margin-top:0; }
.art-card>button { border:1px solid #ded7d7; background:#faf7f0; padding:12px 12px 0; border-radius:3px; transition:transform .25s,box-shadow .25s; }
.art-card>button:hover { transform:translateY(-4px); box-shadow:0 12px 25px #3c234412; }
.art-card .art-mat { aspect-ratio:4/5; background:#e9e2d5; }
.art-mat { display:flex; align-items:center; justify-content:center; container-type:size; position:relative; }
.art-mat .art-frame, .art-card:nth-child(even) .art-mat .art-frame { width:min(100cqw,calc(100cqh * var(--art-ratio,.75))); height:auto; aspect-ratio:var(--art-ratio,.75); flex:none; background:transparent; }
.art-mat .art-frame img { object-fit:contain; width:100%; height:100%; transition:none; }
.art-card button:hover .art-frame img { transform:none; }
.art-mat .view-art { top:8px; right:8px; width:28px; height:28px; font-size:17px; }
.art-meta { padding:16px 0; border:0; gap:10px; height:84px; align-items:start; }
.art-meta h3 { font-size:23px; line-height:1.1; overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.art-meta>span { display:block; font-size:8px; letter-spacing:.07em; }
.gallery-ending { padding:64px 0 70px; }
.gallery-ending>span { font-size:30px; }
.gallery-ending p { font-size:40px; margin:18px 0 20px; }
.motion-off .sketchbook-track { height:auto; }
.motion-off .sketchbook-stage { position:relative; height:auto; min-height:0; }
@media(max-width:700px) {
  .gallery-heading { padding:52px 6% 32px; }
  .gallery-heading h2 { font-size:46px; }
  .gallery-intro { grid-template-columns:1fr 1fr; align-items:center; gap:12px; padding-top:20px; }
  .gallery-intro .quiet-link { margin:0; font-size:11px; justify-self:end; }
  .gallery-intro .sample-note { display:none; }
  .sketchbook-stage { padding:16px 6% 70px; }
  .book { width:min(78vw,calc((100svh - 350px) * .76)); }
  .sketchbook-stage:before { left:2%; font-size:40px; top:21%; }
  .sketchbook-stage:after { display:none; }
  .book-toolbar .eyebrow { font-size:9px; letter-spacing:.13em; }
  .book-toolbar a { font-size:10px; }
  .book-page>button { padding:20px 18px 16px 24px; }
  .book-page-top { font-size:8px; padding-bottom:12px; }
  .book-page-bottom { padding-top:12px; }
  #book-title { font-size:22px; }
  .exhibition { padding:48px 5% 0; }
  .exhibition-heading { display:block; margin-bottom:22px; }
  .exhibition-heading h2 { font-size:39px; }
  .exhibition-heading>p { margin-top:14px; font-size:10px; }
  .art-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 12px; }
  .art-card>button { padding:7px 7px 0; }
  .art-meta { padding:12px 0; height:64px; }
  .art-meta h3 { font-size:18px; }
  .art-meta>span { display:none; }
  .art-mat .view-art { width:25px; height:25px; top:5px; right:5px; font-size:15px; }
  .gallery-ending { padding:45px 0 52px; }
  .gallery-ending p { font-size:34px; }
}
@media(prefers-reduced-motion:reduce) { .sketchbook-track { height:auto; } .sketchbook-stage { position:relative; height:auto; min-height:0; } .art-card>button { transition:none; } }
@media(max-height:660px) { .sketchbook-track { height:auto; } .sketchbook-stage { position:relative; height:auto; min-height:0; padding-bottom:40px; } .book { width:min(78vw,340px); margin:28px auto; } }