/* shared/components/flip-card/flip.css — token-driven; structure only here */
.book-flip{aspect-ratio:1/1.6;perspective:1000px;border-radius:var(--radius-card);cursor:pointer;
  box-shadow:0 12px 24px -14px rgba(80,40,50,.45);position:relative}
.book-flip:focus-visible{outline:3px solid var(--color-plum);outline-offset:3px}
.seqnum{position:absolute;top:-8px;left:-8px;z-index:3;width:24px;height:24px;border-radius:50%;
  background:var(--color-plum);color:#fff;font:700 11px/24px Inter,sans-serif;text-align:center;
  box-shadow:0 4px 10px rgba(80,40,50,.4)}
.book-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:var(--motion-flip)}
@media(hover:hover){.book-flip:hover .book-inner{transform:rotateY(180deg)}}
.book-flip.is-flipped .book-inner{transform:rotateY(180deg)}
.book-front,.book-back{position:absolute;inset:0;overflow:hidden;-webkit-backface-visibility:hidden;
  backface-visibility:hidden;border-radius:var(--radius-card)}
.book-front img{width:100%;height:100%;object-fit:cover;display:block}
.book-back{transform:rotateY(180deg);background:linear-gradient(165deg,#fff8f4,var(--color-paper-2));
  border:1px solid #e7d2cb;padding:13px;display:flex;flex-direction:column;gap:6px}
.book-back .k{font:var(--type-label);letter-spacing:.13em;text-transform:uppercase;color:var(--color-plum);margin:0}
.book-back .t{font:var(--type-title);margin:0;color:var(--color-ink)}
.book-back .bl{flex:1;min-height:0;overflow:auto;margin:0;font:var(--type-body-sm);color:var(--color-ink-soft)}
.book-back .acts{display:flex;flex-direction:column;gap:5px}
.book-back .read{background:var(--color-plum);color:#fbeef0;text-align:center;border-radius:5px;padding:7px;
  font:var(--type-label);letter-spacing:.06em;text-transform:uppercase;text-decoration:none}
.book-back .buy{border:1.5px solid var(--color-plum);color:var(--color-plum);text-align:center;border-radius:5px;
  padding:7px;font:var(--type-label);letter-spacing:.06em;text-transform:uppercase;text-decoration:none}