/* v1.9.1 · fixed-camera 2.5D story library scene + restrained tactile interaction */
.library-v2-page{
  width:100%;
  max-width:none;
  min-height:100dvh;
  margin:0;
  overflow-x:hidden;
  background:#17110d;
}
.library-v2-page button:hover,
.library-v2-page .btn:hover{transform:none;box-shadow:none}
.library-v2-scene{
  position:relative;
  width:min(100vw,430px);
  aspect-ratio:390/844;
  margin:0 auto;
  overflow:hidden;
  isolation:isolate;
  background:#eadcc3;
  font-family:"Songti SC","STSong","Noto Serif SC",serif;
  color:#49372a;
  touch-action:pan-y;
  --scene-light-x:72%;
  --scene-light-y:20%;
}
.library-v2-master{
  position:absolute;
  inset:0;
  z-index:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:fill;
  user-select:none;
  pointer-events:none;
  transition:filter .28s ease,transform .28s cubic-bezier(.2,.75,.25,1);
}
.library-v2-scene:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  opacity:.30;
  background:
    radial-gradient(circle at var(--scene-light-x) var(--scene-light-y),rgba(255,242,210,.30) 0%,rgba(255,229,178,.11) 15%,transparent 37%),
    radial-gradient(circle at calc(var(--scene-light-x) - 13%) calc(var(--scene-light-y) + 22%),rgba(214,160,95,.08),transparent 32%);
  mix-blend-mode:soft-light;
  transition:opacity .22s ease;
}
.library-v2-scene.is-engaged:before{opacity:.48}
.library-v2-copy{
  position:absolute;
  left:3.1%;
  top:4.7%;
  z-index:5;
  width:67%;
  min-height:12%;
  padding:.4% 0;
  pointer-events:none;
}
.library-v2-copy:before{
  content:"";
  position:absolute;
  z-index:-1;
  left:-2%;
  top:-8%;
  width:111%;
  height:112%;
  background:linear-gradient(90deg,rgba(241,229,208,.995) 0%,rgba(241,229,208,.985) 68%,rgba(241,229,208,.60) 89%,transparent 100%);
  filter:blur(4px);
}
.library-v2-copy h1{
  margin:0;
  font-size:clamp(24px,7.4vw,31px);
  line-height:1.08;
  font-weight:500;
  letter-spacing:.075em;
  color:#423127;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}
.library-v2-copy p{
  margin:4.5% 0 0;
  font-size:clamp(12.5px,3.55vw,15px);
  line-height:1.45;
  letter-spacing:.10em;
  color:#846d58;
  white-space:nowrap;
}
.library-v2-menu-hit{
  position:absolute;
  left:87.2%;
  top:2.7%;
  z-index:20;
  width:10.4%;
  height:5.4%;
  padding:0;
  border:0;
  border-radius:28%;
  background:transparent;
  box-shadow:none;
  -webkit-tap-highlight-color:transparent;
}
.library-v2-menu-hit:before{
  content:"";position:absolute;inset:7%;border-radius:28%;opacity:0;
  background:radial-gradient(circle,rgba(255,239,205,.25),transparent 70%);
  box-shadow:0 0 0 1px rgba(121,83,52,.10) inset;
  transition:opacity .16s ease,transform .16s ease;
}
.library-v2-menu-hit:active:before,.library-v2-menu-hit:focus-visible:before{opacity:1;transform:scale(.92)}
.library-v2-menu-hit:focus-visible{
  outline:2px solid rgba(126,83,48,.58);
  outline-offset:-2px;
}
.library-v2-slot{position:absolute;inset:0;z-index:10;pointer-events:none}
.library-v2-book-hit{
  position:absolute;
  z-index:11;
  padding:0;
  margin:0;
  border:0;
  border-radius:3%;
  background:transparent;
  box-shadow:none;
  color:#49372b;
  overflow:visible;
  pointer-events:auto;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  transform-origin:50% 94%;
  transform:perspective(580px) translateY(var(--book-lift,0)) rotateX(var(--book-tilt-y,0deg)) rotateY(var(--book-tilt-x,0deg)) scale(var(--book-scale,1));
  transition:transform .22s cubic-bezier(.18,.82,.28,1),filter .20s ease;
  will-change:transform;
}
.library-v2-book-hit:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  border-radius:4%;
  opacity:1;
  pointer-events:none;
  background-image:var(--library-v2-books,var(--library-v2-scene));
  background-repeat:no-repeat;
  background-size:var(--crop-size-x) var(--crop-size-y);
  background-position:var(--crop-pos-x) var(--crop-pos-y);
  transform:translateY(.35%) scale(.997);
  filter:brightness(1.01) saturate(1.01) drop-shadow(0 8px 7px rgba(26,15,9,.18));
  transition:opacity .16s ease,transform .22s cubic-bezier(.18,.82,.28,1),filter .22s ease;
  will-change:transform,opacity;
}
.library-v2-book-hit.is-hovered,
.library-v2-book-hit.is-pressing,
.library-v2-book-hit:focus-visible{
  --book-lift:-1.15%;
  --book-scale:1.012;
  filter:drop-shadow(0 8px 5px rgba(21,12,7,.13));
}
.library-v2-book-hit.is-hovered:before,
.library-v2-book-hit.is-pressing:before,
.library-v2-book-hit.is-opening:before,
.library-v2-book-hit:focus-visible:before{opacity:1;transform:translateY(-.35%) scale(1.009);filter:brightness(1.045) saturate(1.025) drop-shadow(0 10px 8px rgba(26,15,9,.24))}
.library-v2-book-hit.is-opening{--book-lift:-2.0%;--book-scale:1.022;filter:brightness(1.04) drop-shadow(0 12px 7px rgba(21,12,7,.20))}
.library-v2-book-hit.is-opening .library-v2-book-title{filter:brightness(1.06);box-shadow:inset 0 0 0 1px rgba(111,77,49,.08),0 0 11px rgba(255,223,167,.50)}
.library-v2-book-hit.slot-1{left:3.55%;top:26.65%;width:21.05%;height:29.03%}
.library-v2-book-hit.slot-2{left:27.69%;top:26.65%;width:21.05%;height:29.03%}
.library-v2-book-hit.slot-3{left:51.79%;top:26.65%;width:20.52%;height:29.03%}
.library-v2-book-hit.slot-4{left:76.67%;top:26.65%;width:20.26%;height:29.03%}
.library-v2-book-hit.slot-5{left:3.55%;top:59.83%;width:21.80%;height:26.07%}
.library-v2-book-hit.slot-6{left:29.49%;top:59.83%;width:23.08%;height:26.07%}
/* Each interactive hit reuses the exact matching crop from the single scene master.
   This adds light/tilt feedback without replacing the baked artwork or exposing CSS cards. */
.library-v2-book-hit.slot-1{--crop-size-x:475.06%;--crop-size-y:344.47%;--crop-pos-x:4.50%;--crop-pos-y:37.55%}
.library-v2-book-hit.slot-2{--crop-size-x:475.06%;--crop-size-y:344.47%;--crop-pos-x:35.07%;--crop-pos-y:37.55%}
.library-v2-book-hit.slot-3{--crop-size-x:487.33%;--crop-size-y:344.47%;--crop-pos-x:65.16%;--crop-pos-y:37.55%}
.library-v2-book-hit.slot-4{--crop-size-x:493.58%;--crop-size-y:344.47%;--crop-pos-x:96.15%;--crop-pos-y:37.55%}
.library-v2-book-hit.slot-5{--crop-size-x:458.72%;--crop-size-y:383.58%;--crop-pos-x:4.54%;--crop-pos-y:80.93%}
.library-v2-book-hit.slot-6{--crop-size-x:433.28%;--crop-size-y:383.58%;--crop-pos-x:38.34%;--crop-pos-y:80.93%}
.library-v2-book-hit:after{
  content:"";
  position:absolute;
  inset:1.5%;
  z-index:2;
  border-radius:5%;
  opacity:0;
  background:
    linear-gradient(108deg,transparent 20%,rgba(255,242,210,.31) 47%,rgba(255,235,191,.13) 54%,transparent 72%),
    linear-gradient(to top,rgba(224,174,105,.11),transparent 38%);
  background-size:170% 100%,100% 100%;
  background-position:115% 0,0 0;
  transition:opacity .16s ease,background-position .42s ease;
  pointer-events:none;
}
.library-v2-book-hit.is-hovered:after,
.library-v2-book-hit.is-pressing:after,
.library-v2-book-hit:focus-visible:after{opacity:1;background-position:18% 0,0 0}
.library-v2-book-hit.is-holding:after{
  opacity:1;
  animation:libraryV2HoldWarmth .52s linear both;
}
.library-v2-book-hit:focus-visible{outline:2px solid rgba(232,198,138,.58);outline-offset:-3px}
.library-v2-book-title{
  position:absolute;
  z-index:3;
  display:block;
  writing-mode:vertical-rl;
  text-orientation:upright;
  overflow:hidden;
  white-space:normal;
  word-break:break-all;
  padding:4% 2%;
  border-radius:38% / 8%;
  font-size:clamp(10.8px,3.55vw,14.8px);
  line-height:1.18;
  letter-spacing:.06em;
  text-align:start;
  font-weight:500;
  color:#49362a;
  background:linear-gradient(90deg,rgba(230,213,181,.98),rgba(239,225,199,.99) 49%,rgba(224,204,169,.98));
  box-shadow:inset 0 0 0 1px rgba(111,77,49,.05),0 0 7px rgba(224,202,170,.38);
  text-shadow:0 1px 0 rgba(255,255,255,.46);
  transition:filter .18s ease,box-shadow .18s ease,transform .18s ease;
}
.library-v2-book-title.is-long{font-size:clamp(9.4px,3.05vw,12.7px);line-height:1.05;letter-spacing:.015em}
.library-v2-book-title.is-very-long{font-size:clamp(8.4px,2.72vw,11.3px);line-height:1.01;letter-spacing:0}
.library-v2-book-title.is-latin{
  writing-mode:horizontal-tb;
  text-orientation:mixed;
  display:grid;
  place-items:center;
  padding:8% 8%;
  line-height:1.08;
  letter-spacing:.02em;
  word-break:break-word;
}
.library-v2-book-hit.slot-1 .library-v2-book-title{left:31.5%;top:13.5%;width:38%;height:51%}
.library-v2-book-hit.slot-2 .library-v2-book-title{left:31.5%;top:13.5%;width:38%;height:51%}
.library-v2-book-hit.slot-3 .library-v2-book-title{left:37%;top:13.5%;width:39%;height:50%}
.library-v2-book-hit.slot-4 .library-v2-book-title{left:36%;top:13.5%;width:37%;height:51%}
.library-v2-book-hit.slot-5 .library-v2-book-title{left:31.5%;top:23%;width:37%;height:47%}
.library-v2-book-hit.slot-6 .library-v2-book-title{left:35.5%;top:18.5%;width:36%;height:51%}
.library-v2-book-progress{
  position:absolute;
  z-index:3;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:1px;
  min-width:0;
  padding:3% 2%;
  border-radius:8%;
  font-family:"Songti SC","STSong","Noto Serif SC",serif;
  line-height:1.12;
  text-align:center;
  text-shadow:0 1px 0 rgba(255,255,255,.16);
  transition:filter .18s ease,transform .18s ease;
}
.library-v2-book-progress b{display:block;font-size:clamp(9px,2.9vw,12px);font-weight:500;white-space:nowrap}
.library-v2-book-progress em{display:block;font-size:clamp(9px,2.7vw,11.5px);font-style:normal;white-space:nowrap;letter-spacing:.02em}
.library-v2-book-hit.slot-1 .library-v2-book-progress{left:24%;top:77.5%;width:52%;height:17%;background:rgba(215,197,163,.96);color:#66503c}
.library-v2-book-hit.slot-2 .library-v2-book-progress{left:15%;top:77.5%;width:66%;height:17%;background:rgba(170,124,91,.97);color:#6d4630;text-shadow:0 1px rgba(255,240,215,.20)}
.library-v2-book-hit.slot-3 .library-v2-book-progress{left:27%;top:77.5%;width:64%;height:17%;background:rgba(216,199,165,.97);color:#66503c}
.library-v2-book-hit.slot-4 .library-v2-book-progress{left:30%;top:77.5%;width:58%;height:17%;background:rgba(91,75,63,.98);color:#d9c3a3;text-shadow:0 1px rgba(0,0,0,.35)}
.library-v2-book-hit.slot-5 .library-v2-book-progress{left:24.5%;top:72.7%;width:57%;height:18%;background:rgba(125,125,103,.98);color:#e4d3b8;text-shadow:0 1px rgba(0,0,0,.28)}
.library-v2-book-hit.slot-6 .library-v2-book-progress{left:26.5%;top:72.7%;width:57%;height:18%;background:rgba(47,57,64,.98);color:#dcc7a8;text-shadow:0 1px rgba(0,0,0,.34)}
.library-v2-book-more{
  position:absolute;
  z-index:15;
  width:7.5%;
  aspect-ratio:1;
  padding:0;
  border:0;
  border-radius:50%;
  background:rgba(246,229,195,.08);
  color:transparent;
  box-shadow:none;
  opacity:.01;
  pointer-events:auto;
}
.library-v2-book-more:focus-visible{opacity:1;color:#5c4433;background:rgba(244,226,193,.94);outline:1px solid rgba(87,58,37,.35)}
.library-v2-book-more.slot-1{left:17.8%;top:27.2%}
.library-v2-book-more.slot-2{left:42%;top:27.2%}
.library-v2-book-more.slot-3{left:66.2%;top:27.2%}
.library-v2-book-more.slot-4{left:91%;top:27.2%}
.library-v2-book-more.slot-5{left:18.2%;top:60.4%}
.library-v2-book-more.slot-6{left:44.2%;top:60.4%}
.library-v2-cta{
  position:absolute;
  left:2.25%;
  top:89.45%;
  z-index:20;
  width:95.5%;
  height:9.2%;
  padding:0 11%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5%;
  border:0;
  border-radius:12% / 44%;
  background:transparent;
  color:#5a402e;
  box-shadow:none;
  overflow:hidden;
  -webkit-tap-highlight-color:transparent;
}
.library-v2-cta:before{
  content:"";
  position:absolute;
  z-index:-1;
  left:25%;
  right:22%;
  top:14%;
  bottom:13%;
  background:rgba(238,221,190,.97);
  box-shadow:0 0 16px 10px rgba(238,221,190,.88);
}
.library-v2-cta:after{
  content:"";
  position:absolute;
  inset:6% 3%;
  border-radius:12% / 44%;
  opacity:0;
  background:rgba(255,244,219,.15);
  transition:opacity .15s ease;
}
.library-v2-cta{transition:transform .17s cubic-bezier(.2,.8,.25,1),filter .17s ease}
.library-v2-cta:active{transform:translateY(1px) scale(.987);filter:brightness(1.035)}
.library-v2-cta:active:after,.library-v2-cta:focus-visible:after{opacity:1}
.library-v2-cta:focus-visible{outline:2px solid rgba(126,83,48,.45);outline-offset:-4px}
.library-v2-cta-plus{
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:11.5%;
  aspect-ratio:1;
  border:1.4px solid rgba(96,61,36,.72);
  border-radius:50%;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(23px,6.6vw,29px);
  line-height:1;
  font-weight:300;
}
.library-v2-cta-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-width:0}
.library-v2-cta-copy strong{font-size:clamp(15px,4.55vw,20px);font-weight:500;letter-spacing:.08em;white-space:nowrap}
.library-v2-cta-copy small{font-size:clamp(10px,3vw,13px);font-weight:400;letter-spacing:.06em;color:#765e4b;white-space:nowrap}
.library-v2-page-arrow{
  position:absolute;
  z-index:25;
  top:53%;
  width:8%;
  height:8%;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(40,25,16,.34);
  color:rgba(244,224,191,.82);
  font-size:clamp(23px,7vw,31px);
  line-height:1;
  box-shadow:none;
  backdrop-filter:blur(5px);
}
.library-v2-page-arrow.is-prev{left:.8%}.library-v2-page-arrow.is-next{right:.8%}
.library-v2-page-count{
  position:absolute;
  left:44%;
  top:86.8%;
  z-index:25;
  min-width:12%;
  padding:1% 2%;
  border-radius:999px;
  background:rgba(30,18,11,.34);
  color:rgba(235,215,183,.82);
  font:500 clamp(9px,2.7vw,11px)/1 ui-sans-serif,"PingFang SC",sans-serif;
  text-align:center;
}
.library-v2-preview-chip{
  position:absolute;
  z-index:30;
  left:4%;
  top:15.5%;
  padding:1.2% 2.3%;
  border-radius:999px;
  background:rgba(83,59,42,.68);
  color:#f2e5d0;
  font:500 clamp(9px,2.6vw,11px)/1 ui-sans-serif,"PingFang SC",sans-serif;
  letter-spacing:.06em;
}
.library-v2-list-shell{max-width:860px;margin:0 auto;padding:0 16px 80px}
.library-v2-list-shell .library-list{padding-top:16px}
@media(min-width:431px){
  .library-v2-page{padding:24px 0;background:radial-gradient(circle at 50% 20%,#4b382b,#17110d 72%)}
  .library-v2-scene{border-radius:34px;box-shadow:0 30px 90px rgba(0,0,0,.54)}
}
@media(max-width:340px){
  .library-v2-copy h1{font-size:23px}
  .library-v2-copy p{font-size:12px}
  .library-v2-book-title{font-size:10px}
  .library-v2-book-progress b,.library-v2-book-progress em{font-size:8.5px}
}
@keyframes libraryV2HoldWarmth{
  0%{box-shadow:inset 0 -2px 0 rgba(237,196,129,0)}
  55%{box-shadow:inset 0 -18px 24px rgba(237,196,129,.08)}
  100%{box-shadow:inset 0 -42px 42px rgba(237,196,129,.17)}
}
@keyframes libraryV2SlotsOutNext{to{opacity:0;transform:translateX(-3.2%)}}
@keyframes libraryV2SlotsOutPrev{to{opacity:0;transform:translateX(3.2%)}}
@keyframes libraryV2SlotsInNext{from{opacity:0;transform:translateX(3.2%)}}
@keyframes libraryV2SlotsInPrev{from{opacity:0;transform:translateX(-3.2%)}}
.library-v2-scene.is-turning-next .library-v2-slot,
.library-v2-scene.is-turning-next .library-v2-page-count{animation:libraryV2SlotsOutNext .16s ease both}
.library-v2-scene.is-turning-prev .library-v2-slot,
.library-v2-scene.is-turning-prev .library-v2-page-count{animation:libraryV2SlotsOutPrev .16s ease both}
.library-v2-scene.is-entering-next .library-v2-slot,
.library-v2-scene.is-entering-next .library-v2-page-count{animation:libraryV2SlotsInNext .22s cubic-bezier(.2,.75,.25,1) both}
.library-v2-scene.is-entering-prev .library-v2-slot,
.library-v2-scene.is-entering-prev .library-v2-page-count{animation:libraryV2SlotsInPrev .22s cubic-bezier(.2,.75,.25,1) both}
@media(prefers-reduced-motion:reduce){
  .library-v2-master,.library-v2-book-hit,.library-v2-book-hit:before,.library-v2-book-hit:after,.library-v2-book-title,.library-v2-book-progress,.library-v2-cta,.library-v2-cta:after{transition:none!important;animation:none!important}
}
.library-v2-book-hit.is-empty{pointer-events:none;cursor:default}
.library-v2-slot.is-empty .library-v2-book-title,
.library-v2-slot.is-empty .library-v2-book-progress{color:transparent;text-shadow:none}
.library-v2-page{padding-bottom:0!important;background:#17110d!important}
.library-v2-page:before{display:none!important}

.library-v2-slot.is-empty .library-v2-book-hit:before{display:none!important}
