/* Motion treatments are local implementations. Licensed prompt adaptations are recorded in MOTIONSITES.md. */
.hero-card { isolation:isolate; }
.hero-card::before { content:""; position:absolute; z-index:-1; inset:-25%; background:radial-gradient(ellipse at 80% 10%,#b9d4ff66,transparent 45%),radial-gradient(ellipse at 85% 90%,#c5e1cf66,transparent 38%); pointer-events:none; }
.featured-shelf { min-width:0; padding:24px 30px 25px 18px; display:flex; flex-direction:column; justify-content:center; position:relative; }
.shelf-top { display:flex; justify-content:space-between; align-items:center; font-size:10px; letter-spacing:.08em; color:var(--muted); padding-inline:10px; }
.shelf-counter { font-variant-numeric:tabular-nums; color:var(--primary); }
.shelf-stage { position:relative; height:235px; min-width:0; touch-action:pan-y; outline-offset:0; border-radius:18px; perspective:1000px; }
.shelf-stage::after { content:""; position:absolute; width:200px; height:16px; left:50%; bottom:13px; transform:translateX(-50%); border-radius:50%; background:#16345a15; filter:blur(7px); z-index:-1; }
.shelf-book { position:absolute; top:28px; left:50%; padding:0; background:transparent; transform-origin:50% 85%; border-radius:5px; transition:transform 420ms cubic-bezier(.2,.7,.2,1),filter 220ms; }
.shelf-book .mini-book { width:122px; height:172px; padding:19px 17px 13px; transform:none; }
.shelf-book .mini-book strong { font-size:16px; }
.shelf-book .mini-book small { font-size:6px; }
.shelf-book .mini-book em { font-size:8px; }
.shelf-slot-0 { transform:translateX(-104%) rotate(-17deg) scale(.88); z-index:1; filter:brightness(.95); }
.shelf-slot-1 { transform:translateX(-50%) rotate(0); z-index:3; }
.shelf-slot-2 { transform:translateX(4%) rotate(17deg) scale(.88); z-index:2; filter:brightness(.95); }
.shelf-slot-0:hover { transform:translateX(-113%) rotate(-19deg) scale(.92); }
.shelf-slot-1:hover { transform:translateX(-50%) translateY(-7px); }
.shelf-slot-2:hover { transform:translateX(13%) rotate(19deg) scale(.92); }
.shelf-book:focus-visible { outline-offset:8px; }
.shelf-bottom { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 10px; }
.shelf-caption { min-width:0; }
.shelf-caption h3 { font-size:13px; max-width:240px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.shelf-caption p { font-size:11px; margin-top:4px; color:var(--primary); }
.shelf-controls { display:flex; gap:6px; flex-shrink:0; }
.shelf-controls .icon-button { background:var(--card); border:1px solid var(--outline); width:38px; height:38px; color:var(--primary); }
.shelf-controls button:first-child svg { transform:rotate(180deg); }
.shelf-controls svg { width:18px; height:18px; }
.reveal-pending { opacity:0; }
.nav-list { position:relative; }
.selection-indicator { position:absolute; top:0; left:0; background:var(--high); border-radius:28px; pointer-events:none; z-index:0; transition:transform 380ms cubic-bezier(.22,.8,.22,1),width 250ms,height 250ms; }
.nav-list .nav-item,.bottom-nav a { position:relative; z-index:1; }
.nav-list[data-motion-nav] .nav-item.active { background:transparent; }
.bottom-nav .selection-indicator { background:var(--primary-container); border-radius:20px; }
.bottom-nav[data-motion-nav] a.active > [data-icon] { background:transparent; }
.book-stage { perspective:700px; }
.book-stage::after { content:""; position:absolute; inset:0; background:radial-gradient(circle at var(--light-x,50%) var(--light-y,30%),#ffffff80,transparent 55%); opacity:0; transition:opacity 220ms; pointer-events:none; mix-blend-mode:soft-light; }
@media (hover:hover) and (pointer:fine) {
  .book-stage.pointer-active::after { opacity:.65; }
  .book-card:hover .mini-book { transform:rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(-5px); }
  .text-button:hover .icon { transform:translateX(3px); }
}
.text-button .icon { transition:transform 180ms; }
.community-strip strong { font-variant-numeric:tabular-nums; }
.order-steps .complete svg { animation:step-complete 350ms cubic-bezier(.2,.8,.2,1); }
@keyframes step-complete { from { transform:scale(.65); opacity:.3; } to { transform:scale(1); opacity:1; } }
.appearance-link { display:flex; align-items:center; gap:10px; }
html[data-motion="quiet"] *,html[data-motion="quiet"] *::before,html[data-motion="quiet"] *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
html[data-motion="quiet"] .reveal-pending { opacity:1; }
html[data-motion="quiet"] .book-card:hover .mini-book { transform:none; }
html[data-motion="quiet"] .book-stage::after { display:none; }
@media (max-width:1240px) { .featured-shelf { padding-right:18px; padding-left:0; } .shelf-caption h3 { max-width:180px; } }
@media (max-width:1023px) { .selection-indicator { border-radius:16px; } }
@media (min-width:700px) and (max-width:900px) {
  .hero-card { grid-template-columns:1.1fr 1fr; }
  .hero-copy h1 { font-size:34px; } .hero-copy p { font-size:12px; }
  .shelf-book .mini-book { width:92px; height:140px; padding:16px 13px; }
  .shelf-book .mini-book strong { font-size:13px; } .shelf-stage { height:205px; }
  .shelf-book { top:34px; } .shelf-caption h3 { max-width:130px; font-size:11px; }
  .shelf-controls { gap:2px; } .shelf-controls .icon-button { width:34px; height:34px; }
}
@media (max-width:699px) {
  .hero-copy { padding-bottom:24px; } .hero-copy p { max-width:100%; font-size:12px; }
  .hero-copy h1 { font-size:36px; } .featured-shelf { padding:16px 18px; border-top:1px solid color-mix(in srgb,var(--primary) 14%,transparent); background:color-mix(in srgb,var(--card) 42%,transparent); display:grid; grid-template-columns:125px minmax(0,1fr); grid-template-rows:auto 1fr; gap:4px 10px; }
  .shelf-top { grid-column:2; grid-row:1; padding:0; font-size:9px; }
  .shelf-stage { grid-column:1; grid-row:1/3; height:119px; }
  .shelf-stage::after { width:100px; bottom:2px; }
  .shelf-book { top:8px; } .shelf-book .mini-book { width:56px; height:85px; padding:10px 8px; }
  .shelf-book .mini-book strong { font-size:8px; line-height:1.4; margin-top:5px; }
  .shelf-book .mini-book small { font-size:3px; } .shelf-book .mini-book em { font-size:4px; } .shelf-book .cover-line { height:2px; margin-top:7px; }
  .shelf-bottom { grid-column:2; grid-row:2; padding:0; flex-wrap:wrap; align-content:center; gap:8px; }
  .shelf-caption { width:100%; } .shelf-caption h3 { max-width:100%; font-size:12px; white-space:normal; line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
  .shelf-caption p { font-size:11px; } .shelf-controls .icon-button { width:44px; height:34px; border-radius:18px; } .shelf-controls { gap:8px; }
}
@media (prefers-reduced-motion:reduce) {
  .reveal-pending { opacity:1; } .book-stage::after { display:none; }
  .shelf-book:hover { filter:none; } .book-card:hover .mini-book { transform:none; }
}
