/* Append after episode-books.css. Bounded to the three episode books. */
#game #playroom-focus.episode-shelf-root,
#game #playroom-focus.episode-reader{
 --cozy-paper:#fff5df;--cozy-ink:#594536;
 background:radial-gradient(ellipse at 48% 20%,#f7eed7 0%,#eadbbe 64%,#dcc7a5 100%)!important;
}
#game #playroom-focus .episode-shelf{
 --cover-w:min(calc((var(--stage-w,100vw) - 112px)/3),calc((var(--stage-h,520px) - 40px)*.75),300px);
 display:flex!important;flex-wrap:nowrap;align-items:center;justify-content:center;gap:30px;
 width:100%;height:100%;max-width:1100px;max-height:none;padding:16px 22px 28px!important;
 direction:rtl;isolation:isolate;
}
#game .episode-shelf:after{display:none!important}
#game #playroom-focus .episode-shelf .story-cover{
 box-sizing:border-box;position:relative;display:block!important;flex:0 0 var(--cover-w);
 width:var(--cover-w)!important;height:auto!important;aspect-ratio:3/4;max-width:none;max-height:none;min-height:0!important;
 margin:0;padding:0!important;align-self:center;overflow:hidden;
 background:#fff5df!important;color:var(--cozy-ink)!important;
 border:1px solid #c6ad825c;border-right:8px solid var(--book-color);
 border-radius:10px 3px 3px 10px;transform:rotate(-1.3deg);
 box-shadow:-2px 2px 0 #fbf0d4,-4px 4px 0 #d3bc94,-6px 6px 0 #f8edcf,-8px 8px 0 var(--book-color),-9px 13px 15px #7051352b;
 transition:transform 180ms ease,box-shadow 180ms ease;
}
#game #playroom-focus .episode-shelf .story-cover:nth-child(2){transform:rotate(1deg)}
#game #playroom-focus .episode-shelf .story-cover:nth-child(3){transform:rotate(-.7deg)}
#game #playroom-focus .episode-shelf .story-cover:hover{
 transform:translateY(-5px) rotate(0);color:var(--cozy-ink)!important;
 box-shadow:-2px 2px 0 #fbf0d4,-4px 4px 0 #d3bc94,-6px 6px 0 #f8edcf,-8px 8px 0 var(--book-color),-9px 18px 22px #70513535;
}
#game #playroom-focus .episode-shelf .story-cover:focus-visible{outline:3px dashed #49796a;outline-offset:5px}
#game #playroom-focus .episode-shelf .cover-art{
 position:absolute;inset:0;display:block;width:100%;height:100%!important;aspect-ratio:auto;min-height:0;
 margin:0!important;border:0;border-radius:0;box-shadow:none;flex:none;
 background-color:#fff5df;background-size:100% 100%!important;background-position:center!important;
}
#game #playroom-focus .episode-shelf .story-cover b{
 position:absolute;z-index:2;top:5.4%;left:6%;right:6%;display:block;
 padding:0!important;margin:0!important;font-family:Thmanyah,sans-serif;font-size:clamp(21px,2.4vw,30px);
 line-height:1.2;text-align:center;direction:rtl;text-shadow:none;color:#564a3e;
}
#game #playroom-focus .episode-shelf .story-cover small{
 position:absolute;z-index:2;top:19%;left:7%;right:7%;display:block;
 margin:0;padding:0;font-family:Thmanyah,sans-serif;font-size:12px;line-height:1.4;text-align:center;color:#806e57;
}
#game #playroom-focus .episode-shelf .story-cover[data-book="episode-rain"] small{top:22%}
#game .episode-shelf .cover-spine{
 left:auto;right:0;top:0;bottom:0;width:9px;background:linear-gradient(90deg,#69533900,#69533922);
 box-shadow:inset -1px 0 #e8d6af6b;border:0;z-index:3;pointer-events:none;
}
#game .episode-reader #play-stage{box-sizing:border-box;padding:8px 13px 18px!important}
#game .episode-reader .open-book{
 max-width:1100px;max-height:620px;width:100%;height:100%;box-sizing:border-box;
 padding:clamp(12px,2vw,25px)!important;gap:clamp(20px,3vw,36px);
 background:linear-gradient(90deg,#fff6e3 0%,#fff4dc 46%,#ead8b8 49.3%,#fff8e8 51.1%,#fff5df 100%);
 border:1px solid #cebb933d!important;border-radius:13px 7px 7px 13px;
 box-shadow:0 3px #e1cda8,0 6px #fff2d4,0 9px #cfb68c,0 12px var(--book-color,#728d87),0 18px 23px #69503328;
 perspective:1800px;transform-style:preserve-3d;isolation:isolate;
}
#game .episode-reader .open-book:after{left:calc(47.6% - 8px);width:16px;background:linear-gradient(90deg,#83644100,#876b4522,#fff7df88,#83644100);opacity:.75}
#game .episode-reader .book-page{padding:8px 12px!important}
#game .episode-reader .book-page h2{color:#846046;font-size:clamp(21px,2vw,29px);line-height:1.25;margin-bottom:13px!important}
#game .episode-reader .book-page p{color:#534d3d;font-size:clamp(17px,1.7vw,23px);line-height:1.65}
#game .episode-reader .book-ribbon{background:var(--book-color,#728d87);height:29px;right:26px;width:13px;top:-3px;opacity:.9}
/* Front and unmarked inside cover are separate faces, so painted people never mirror. */
#game .episode-reader .book-leaf{
 position:absolute;left:0;right:auto;top:0;bottom:0;width:47.6%;max-height:none;
 margin:0;padding:0;display:block;overflow:visible;background:none;box-shadow:none;
 transform-origin:100% 50%;transform-style:preserve-3d;backface-visibility:visible;
 border-radius:10px 2px 2px 10px;animation:cozy-turn-right 760ms cubic-bezier(.25,.1,.25,1) both;
}
#game .episode-reader .book-leaf.leaf-back{left:47.6%;width:52.4%;transform-origin:0 50%;animation-name:cozy-turn-left}
#game .episode-reader .cozy-leaf-front,#game .episode-reader .cozy-leaf-back{
 position:absolute;inset:0;box-sizing:border-box;border-radius:inherit;backface-visibility:hidden;
 background:#fff5df;box-shadow:-2px 3px 14px #624b3538;overflow:hidden;
}
#game .episode-reader .cozy-leaf-back{
 transform:rotateY(180deg);background:linear-gradient(90deg,#f9edd2,#fff7e3 35%,#f8ebcd);
 border:1px solid #d9c5a033;box-shadow:2px 3px 14px #624b3528;
}
#game .episode-reader .book-cover-leaf .cozy-leaf-front{border-right:8px solid var(--cover);background:#fff5df}
#game .episode-reader .book-cover-leaf .leaf-art{
 position:absolute;inset:0;display:block;width:100%;height:100%!important;aspect-ratio:auto;
 margin:0;border:0;background-size:contain!important;background-position:center!important;
 mask-image:none!important;-webkit-mask-image:none!important;
}
#game .episode-reader .book-cover-leaf b{
 position:absolute;z-index:1;top:5.4%;left:7%;right:7%;padding:0;margin:0;font-family:Thmanyah,sans-serif;
 color:#564a3e;font-size:clamp(22px,3vw,33px);line-height:1.2;text-align:center;direction:rtl;
}
#game .episode-reader .book-page-leaf .cozy-leaf-front{display:flex;align-items:center;justify-content:center;padding:20px}
#game .episode-reader .book-page-leaf .leaf-art{width:100%;height:auto!important;max-height:100%;aspect-ratio:var(--art-ratio);background-size:contain!important}
#game .episode-reader .book-page-leaf b{display:none}
@keyframes cozy-turn-right{0%,12%{transform:rotateY(0);opacity:1}88%{opacity:1}100%{transform:rotateY(178deg);opacity:0}}
@keyframes cozy-turn-left{0%{transform:rotateY(0);opacity:1}88%{opacity:1}100%{transform:rotateY(-178deg);opacity:0}}
@media(max-width:650px) and (orientation:portrait){
 #game #playroom-focus .episode-shelf{
  --cover-w:min(calc((var(--stage-w,calc(100vw - 12px)) - 64px)/2),calc((var(--stage-h,520px) - 52px)*.375),198px);
  max-width:460px;display:flex!important;flex-wrap:wrap;align-content:center;align-items:center;justify-content:center;
  gap:19px 24px;padding:8px 16px 20px!important;
 }
 #game #playroom-focus .episode-shelf .story-cover{flex:0 0 var(--cover-w);width:var(--cover-w)!important;height:auto!important;aspect-ratio:3/4;display:block!important;border-right-width:5px}
 #game #playroom-focus .episode-shelf .story-cover b{font-size:clamp(16px,4.6vw,22px);line-height:1.2;top:5%;left:5%;right:5%}
 #game #playroom-focus .episode-shelf .story-cover small{display:none}
 #game .episode-reader #play-stage{padding:5px 12px 16px!important}
 #game .episode-reader .open-book{
  grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:9px;max-width:440px;max-height:660px;
  padding:12px 17px 12px 13px!important;border-right:5px solid var(--book-color,#728d87)!important;
  background:linear-gradient(90deg,#fff6e3 0%,#fff4de 94%,#e7d2ad 100%);border-radius:10px 3px 3px 10px;
  box-shadow:-2px 2px #e1cda8,-4px 4px #fff2d4,-6px 6px #cfb68c,-8px 8px var(--book-color,#728d87),0 14px 17px #69503324;
 }
 #game .episode-reader .open-book:after{left:auto;right:0;width:10px;background:linear-gradient(90deg,#83644100,#876b4522)}
 #game .episode-reader .book-page{padding:0 2px!important;align-self:center}
 #game .episode-reader .book-page h2{font-size:21px;line-height:1.25;margin-bottom:8px!important}
 #game .episode-reader .book-page p{font-size:17px;line-height:1.6}
 #game .episode-reader .book-ribbon{right:18px;width:10px;height:20px}
 #game .episode-reader .book-leaf,#game .episode-reader .book-leaf.leaf-back{left:0;width:100%}
 #game .episode-reader .book-cover-leaf .leaf-art{background-size:contain!important}
 #game .episode-reader .book-cover-leaf b{font-size:26px}
}
@media(max-width:360px) and (orientation:portrait){
 #game .episode-reader .open-book{padding:9px 13px 9px 10px!important;gap:7px}
 #game .episode-reader .book-page h2{font-size:20px;margin-bottom:6px!important}
 #game .episode-reader .book-page p{font-size:16px;line-height:1.48}
}
@media(orientation:landscape) and (max-height:600px){
 #game #playroom-focus .episode-shelf{--cover-w:min(calc((var(--stage-w,100vw) - 100px)/3),calc((var(--stage-h,260px) - 26px)*.75),230px);gap:26px;padding:6px 18px 20px!important}
 #game #playroom-focus .episode-shelf .story-cover b{font-size:clamp(16px,3.5vh,23px)}
 #game #playroom-focus .episode-shelf .story-cover small{display:none}
 #game .episode-reader #play-stage{padding:3px 12px 15px!important}
 #game .episode-reader .open-book{padding:10px 16px!important;gap:22px}
 #game .episode-reader .book-page{padding:0 4px!important}
 #game .episode-reader .book-page h2{font-size:19px;margin-bottom:6px!important}
 #game .episode-reader .book-page p{font-size:16px;line-height:1.43}
}
@media(prefers-reduced-motion:reduce){
 #game #playroom-focus .episode-shelf .story-cover{transition:none!important}
 #game #playroom-focus .episode-shelf .story-cover:hover{transform:none}
 #game .episode-reader .book-leaf{display:none!important;animation:none!important}
}
/* Quiet narrow-tablet covers: reserve the upper paper for the full title. */
@media(min-width:651px) and (max-width:799px){
 #game #playroom-focus .episode-shelf .story-cover small{display:none}
}
