.explore-stage{border-bottom-color:#3a2419}
.display-books{position:absolute;z-index:4;inset:0;pointer-events:none}
.display-book.original-cover{background:transparent;box-shadow:none}
.display-picker{width:min(520px,90vw);padding:28px;background:#fff;color:#222;border:1px solid #ccc}.display-picker::backdrop{background:#0007}.display-picker button{display:block;min-height:44px;margin:12px 0;padding:12px;background:#fff;color:#222;border:1px solid #ccc;cursor:pointer}.display-picker img{display:block;max-height:180px;margin:0 auto 12px}.display-picker :focus-visible{outline:3px solid #26717b}
.display-book{position:absolute;pointer-events:auto;margin:0;padding:0;border:0;background:#efe9da;box-shadow:0 3px 8px rgba(34,30,28,.2);cursor:pointer;overflow:visible;transform-origin:bottom center;transition:filter .18s,transform .18s}
.display-book img{display:block;width:100%;height:100%;object-fit:cover}
.display-book span{display:flex;width:100%;height:100%;align-items:flex-end;padding:5px;box-sizing:border-box;color:#222;background:#eee;font:600 9px/1.2 var(--font-reading)}
.display-book b{position:absolute;left:50%;bottom:calc(100% + 9px);width:max-content;max-width:180px;padding:6px 8px;background:#fff;color:#222;border:1px solid #222;font:600 11px/1.3 var(--font-reading);box-shadow:3px 3px 0 #2223;opacity:0;transform:translate(-50%,5px);pointer-events:none;transition:.18s}
.display-book:hover,.display-book:focus-visible{filter:brightness(1.05);transform:translateY(-5px) rotate(var(--tilt,0deg));z-index:2}
.display-book:hover b,.display-book:focus-visible b{opacity:1;transform:translate(-50%,0)}
.display-book:focus-visible{outline:3px solid #1d6f78;outline-offset:3px}
.display-book.counter{top:41.8%;width:3.6%;height:7.05%}.display-book.counter-1{left:19.1%;--tilt:-1deg}.display-book.counter-2{left:23.25%;--tilt:1deg}
.display-book.upper{top:49.8%;height:6.8%;width:3.45%}.display-book.upper-1{left:45.1%}.display-book.upper-2{left:48.6%}.display-book.upper-3{left:52.1%}.display-book.upper-4{left:55.6%}
.display-book.lower{top:58.45%;height:6.75%;width:4.5%}.display-book.lower-1{left:37.4%}.display-book.lower-2{left:43.6%}.display-book.lower-3{left:49.5%}.display-book.lower-4{left:55.45%}.display-book.lower-5{left:61.8%}
@media(max-width:850px){.display-books{inset:auto 12px 62px;display:flex;gap:9px;overflow-x:auto;padding:13px;background:rgba(255,255,255,.88);backdrop-filter:blur(8px);pointer-events:auto;scroll-snap-type:x mandatory}.display-book.counter,.display-book.upper,.display-book.lower{position:relative;inset:auto;flex:0 0 58px;width:58px;height:86px;transform:none;scroll-snap-align:start}.display-book:hover,.display-book:focus-visible{transform:translateY(-3px)}.display-book b{bottom:8px;left:6px;width:46px;max-height:34px;overflow:hidden;padding:4px;box-sizing:border-box;background:rgba(255,255,255,.9);border:0;font-size:8px;opacity:1;transform:none}.display-book:hover b,.display-book:focus-visible b{transform:none}}
@media(prefers-reduced-motion:reduce){.display-book{transition:none}}
.book-admin-edit,.reading-note-open{width:100%;margin-top:12px;border:1px solid #243735;background:#fff;color:#243735;padding:12px}.book-admin-edit{background:#243735;color:#fff}.book-edit-dialog input,.book-edit-dialog textarea{box-sizing:border-box;width:100%;margin-top:6px;padding:11px;border:1px solid #b8c2bb;background:#fff;font:inherit}.book-edit-dialog label{display:block;margin:13px 0;font-weight:600}
/* 2026-10-24: 전시 책은 책 자리(%) 크기 그대로. 전역 button 최소 44px(typography.css)이 휴대폰에서 표지를 늘리던 문제.
   보이는 표지는 자리에 맞추고, 누르는 영역은 보이지 않는 :before로 위아래 최소 44px를 유지한다. */
.display-book{min-height:0;min-width:0}
.display-book:before{content:'';position:absolute;top:min(-7px,calc((100% - 44px)/2));bottom:min(-7px,calc((100% - 44px)/2));left:-4px;right:-4px}
#explore .display-books .display-book{min-height:0;min-width:0}
#explore .display-books .display-book:before{top:min(-7px,calc((100% - 44px)/2));bottom:min(-7px,calc((100% - 44px)/2))}
