/* Nana V's Books: the STARLINIA stand (her approved picture, unchanged) with tap-to-open covers. */
#books-screen{position:absolute;inset:0;overflow:hidden;background:radial-gradient(120% 90% at 50% 0%,#fff6fb 0%,#eaf6ff 45%,#fff3d9 100%)}
.bk-stars{position:absolute;inset:0;pointer-events:none}
.bk-stars i{position:absolute;width:14px;height:14px;background:currentColor;clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);opacity:.5;animation:bk-twinkle 3.6s ease-in-out infinite}
@keyframes bk-twinkle{0%,100%{opacity:.2;transform:scale(.8)}50%{opacity:.75;transform:scale(1.1)}}
.bk-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:max(64px,env(safe-area-inset-top)) 12px 12px}
.bk-stand{position:relative;aspect-ratio:1312/1199;height:min(100%,calc((100vw - 24px)*1199/1312));max-width:100%;touch-action:pan-y;cursor:grab}
.bk-stand img.bk-img{display:block;width:100%;height:100%;user-select:none;-webkit-user-drag:none;pointer-events:none}
.bk-slot{position:absolute;border:0;background:transparent;padding:0;cursor:pointer;border-radius:8px}
.bk-slot:focus-visible{outline:4px solid #1f6dff;outline-offset:2px}
.bk-slot:hover,.bk-slot:focus-visible{background:rgba(255,255,255,.14);box-shadow:0 0 22px 6px rgba(255,255,255,.7)}
.bk-top{position:absolute;left:12px;top:max(10px,env(safe-area-inset-top));z-index:5}
.bk-btn{min-width:48px;min-height:48px;padding:10px 20px;border:3px solid #fff;border-radius:999px;background:linear-gradient(180deg,#ff6fae,#e83a8c);color:#fff;font:700 18px/1.1 "Baloo 2","Trebuchet MS",system-ui,sans-serif;box-shadow:0 6px 16px rgba(180,40,110,.35);cursor:pointer}
.bk-btn:focus-visible{outline:4px solid #1f6dff;outline-offset:3px}
.bk-btn.alt{background:linear-gradient(180deg,#44b8ff,#1f78e6)}
.bk-detail{position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;background:rgba(255,250,245,.94);padding:16px;overflow:auto}
.bk-detail[hidden]{display:none}
.bk-card{display:flex;gap:28px;align-items:center;max-width:960px;width:100%;justify-content:center;flex-wrap:wrap}
.bk-cover{width:min(380px,70vw);max-height:66vh;height:auto;object-fit:contain;image-rendering:auto;border-radius:16px;background:#fff;box-shadow:0 10px 30px rgba(60,40,110,.18)}
.bk-info{flex:1 1 280px;max-width:440px;text-align:left}
.bk-info h2{margin:0 0 8px;font:800 clamp(24px,4vw,38px)/1.1 "Baloo 2","Trebuchet MS",system-ui,sans-serif;color:#7a2bd0}
.bk-info p{margin:0 0 14px;font:600 clamp(16px,2.2vw,20px)/1.4 "Nunito","Trebuchet MS",system-ui,sans-serif;color:#3c2f55}
.bk-date{display:inline-block;margin:0 0 16px;padding:8px 16px;border-radius:999px;background:#fff;border:3px solid #ff6fae;color:#d0206f;font:800 18px/1 "Baloo 2","Trebuchet MS",system-ui,sans-serif}
.bk-note{position:absolute;left:50%;bottom:max(14px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:6;padding:10px 18px;border-radius:999px;background:#fff;border:3px solid #44b8ff;color:#2a5fb0;font:800 17px/1.1 "Baloo 2","Trebuchet MS",system-ui,sans-serif;box-shadow:0 6px 16px rgba(30,90,180,.25)}
.bk-note[hidden]{display:none}
#books-screen .starli-wrap{z-index:7}
html.calm .bk-stars i{animation:none;opacity:.4}
@media (max-width:640px){.bk-card{gap:12px}.bk-info{text-align:center}}
.bk-side{display:flex;flex-direction:column;align-items:center;gap:14px}
.bk-book{position:relative;perspective:1600px;display:inline-block;line-height:0}
.bk-book>.bk-cover{backface-visibility:hidden;-webkit-backface-visibility:hidden;transition:transform .7s cubic-bezier(.4,.1,.3,1)}
.bk-book>.bk-back{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:contain;transform:rotateY(180deg)}
.bk-book.flipped>.bk-cover:not(.bk-back){transform:rotateY(-180deg)}
.bk-book.flipped>.bk-back{transform:rotateY(0deg)}
html.calm .bk-book>.bk-cover{transition:none}
/* The books room: her whole picture on wide screens; on tall phones it fills the height and drags sideways. */
#books-screen{background:#ab6e82}
#books-screen.bk-panning{cursor:grab;touch-action:none}
.bk-room{position:absolute;left:0;top:0;width:1536px;height:1024px;transform-origin:0 0}
.bk-room-img{display:block;width:100%;height:100%;user-select:none;-webkit-user-drag:none;pointer-events:none}
/* Each row of the stand is its own four-sided holder made from her picture of that row. It turns; the sign, rings and base do not. */
.bk-row{position:absolute;perspective:1100px;perspective-origin:50% 50%;overflow:hidden}
.bk-cube{position:absolute;top:0;bottom:0;transform-style:preserve-3d}
.bk-panel{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background-image:url(../../../assets/web/books/books-room.webp);background-size:1536px 1024px;background-repeat:no-repeat}
.bk-slot{position:absolute;display:flex;align-items:flex-end;justify-content:center}
.bk-book-img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;pointer-events:none;user-select:none;-webkit-user-drag:none;filter:drop-shadow(0 4px 5px rgba(60,20,80,.4))}
.bk-book-img{object-fit:fill}
.bk-book-img.real{border-radius:4px}
.bk-face{position:absolute;top:0;bottom:0;z-index:2;border:0;padding:0;background:transparent;cursor:grab;touch-action:pan-y}
.bk-face:focus-visible{outline:4px solid #1f6dff;outline-offset:-4px}
.bk-room{z-index:1}
/* Cute little arrows beside each row: small candy-pink buttons with a white chevron, a soft white rim and a gentle bob */
.bk-arrow{position:absolute;z-index:3;width:38px;height:38px;margin:-19px 0 0 -19px;border:3px solid #fff;border-radius:50%;padding:0;display:grid;place-items:center;cursor:pointer;
  background:radial-gradient(circle at 35% 30%,#ff9cc4 0,#ff4f8b 55%,#e2306f 100%);box-shadow:0 3px 8px rgba(120,20,70,.35);animation:bk-bob 2.6s ease-in-out infinite;-webkit-tap-highlight-color:transparent}
.bk-arrow svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:3.6;stroke-linecap:round;stroke-linejoin:round}
.bk-arrow.r{animation-delay:1.3s}
.bk-arrow:hover{filter:brightness(1.08)}
.bk-arrow.pop{animation:bk-pop .35s ease-out}
.bk-arrow:focus-visible{outline:3px solid #1f6dff;outline-offset:2px}
@keyframes bk-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes bk-pop{0%{transform:scale(1)}40%{transform:scale(.82)}100%{transform:scale(1)}}
html.calm .bk-arrow{animation:none}
/* no phone text-select box or long-press menu on the stand */
#books-screen,#books-screen *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.bk-face{-webkit-tap-highlight-color:transparent}
.bk-face:focus:not(:focus-visible){outline:none;box-shadow:none}