*{box-sizing:border-box}html,body,#root{margin:0;padding:0;width:100%;height:100%}body{font-family:Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{display:flex;flex-direction:column;min-height:100vh}.bookcomp-book-cover{position:relative;display:flex;align-items:center;justify-content:center;perspective:1200px;transform-style:preserve-3d;margin:0 auto;background:linear-gradient(135deg,#8b4513,sienna,peru,sienna,#8b4513);border:3px solid #654321;border-radius:8px;box-shadow:0 0 0 1px #4a3118,0 25px 80px #0006,inset 0 2px 5px #ffffff1a;padding:15px}.bookcomp-book-cover:before,.bookcomp-book-cover:after{content:"";position:absolute;background:#fff;border:1px solid #ddd;border-radius:6px;box-shadow:0 2px 8px #0000001a}.bookcomp-book-cover:before{top:12px;left:12px;right:12px;bottom:12px;background:linear-gradient(to bottom,#fff,#f8f8f8);z-index:1}.bookcomp-book-cover:after{top:9px;left:9px;right:9px;bottom:9px;background:linear-gradient(to bottom,#fafafa,#f0f0f0);z-index:0}.bookcomp-book-spread{position:relative;perspective:1200px;border-radius:8px;background:#fff;transform-style:preserve-3d;box-shadow:0 5px 20px #0003;z-index:10}.bookcomp-page{position:absolute;background:#fffdf8;border:1px solid #ddd;transform-style:preserve-3d;cursor:pointer;overflow:hidden;box-sizing:border-box;transition:transform 1s ease;backface-visibility:hidden}.bookcomp-static-left-page{left:0;top:0;border-right:2px solid #ccc;z-index:1;box-shadow:inset -7px 0 30px -7px #0000001a}.bookcomp-static-right-page{right:0;top:0;z-index:1;box-shadow:inset 7px 0 30px -7px #0000001a}.bookcomp-text-content{height:100%;padding:20px;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;font-family:Georgia,Times New Roman,serif;background:transparent}.bookcomp-story-text{line-height:1.8;color:#2c3e50;text-align:justify;-webkit-hyphens:auto;hyphens:auto;word-wrap:break-word;margin:0;text-shadow:0 1px 2px rgba(0,0,0,.1)}.bookcomp-page-number{font-size:14px;color:#666;font-weight:500;background:#fffc;padding:4px 8px;border-radius:12px;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.bookcomp-loading-placeholder{height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f5f5f5,#e8e8e8);color:#666;font-style:italic}.bookcomp-turning-page{position:absolute;z-index:10;transform-style:preserve-3d;animation-fill-mode:forwards}.bookcomp-turn-next{right:0;transform-origin:left center;animation:bookcompTurnNext 1s ease-in-out forwards}.bookcomp-turn-prev{left:0;transform-origin:right center;animation:bookcompTurnPrev 1s ease-in-out forwards}.bookcomp-page-front,.bookcomp-page-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;background:#fffdf8;overflow:hidden}.bookcomp-page-back{transform:rotateY(180deg)}.bookcomp-animating{pointer-events:none}@keyframes bookcompTurnNext{0%{transform:rotateY(0)}50%{transform:rotateY(-90deg);box-shadow:-10px 0 30px #0006}to{transform:rotateY(-180deg);box-shadow:-20px 0 40px #0009}}@keyframes bookcompTurnPrev{0%{transform:rotateY(0)}50%{transform:rotateY(90deg);box-shadow:10px 0 30px #0006}to{transform:rotateY(180deg);box-shadow:20px 0 40px #0009}}.bookcomp-static-left-page:active,.bookcomp-static-right-page:active{background:#ffffff1a}.bookcomp-no-interaction{cursor:default!important;pointer-events:auto}.bookcomp-no-interaction:hover,.bookcomp-static-left-page.bookcomp-no-interaction:hover{background:none!important;box-shadow:inset -7px 0 30px -7px #0000001a!important}.bookcomp-static-right-page.bookcomp-no-interaction:hover{background:none!important;box-shadow:inset 7px 0 30px -7px #0000001a!important}.bookcomp-no-interaction:active{background:none!important}@media (max-width: 768px){.bookcomp-text-content{padding:15px}.bookcomp-story-text{line-height:1.6}}@media (max-width: 480px){.bookcomp-text-content{padding:12px}}.story-book{box-shadow:0 4px 20px #0000004d;border-radius:8px}.page{background-color:#fff;border:solid 1px #c2b5a3;overflow:hidden}.page .page-content{width:100%;height:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:stretch}.page.--left{border-right:0;box-shadow:inset -7px 0 30px -7px #0000001a}.page.--right{border-left:0;box-shadow:inset 7px 0 30px -7px #0000001a}.page.--hard{background-color:#f2e8d9;border:solid 1px #998f80}.page.odd{border-right:0}.page.even{border-left:0}.turnjs-book-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background-color:#f0f0f0;padding:20px;box-sizing:border-box}.turnjs-book-cover{position:relative;display:flex;align-items:center;justify-content:center;perspective:1200px;transform-style:preserve-3d;background:linear-gradient(135deg,#8b4513,sienna,peru,sienna,#8b4513);border:3px solid #654321;border-radius:8px;box-shadow:0 0 0 1px #4a3118,0 25px 80px #0006,inset 0 2px 5px #ffffff1a;padding:15px}.turnjs-book-cover:before,.turnjs-book-cover:after{content:"";position:absolute;background:#fff;border:1px solid #ddd;border-radius:6px;box-shadow:0 2px 8px #0000001a}.turnjs-book-cover:before{top:12px;left:12px;right:12px;bottom:12px;background:linear-gradient(to bottom,#fff,#f8f8f8);z-index:1}.turnjs-book-cover:after{top:9px;left:9px;right:9px;bottom:9px;background:linear-gradient(to bottom,#fafafa,#f0f0f0);z-index:0}.turnjs-book-spread{position:relative;perspective:1200px;border-radius:8px;background:#fff;transform-style:preserve-3d;box-shadow:0 5px 20px #0003;z-index:10}.turnjs-page{position:absolute;background:#fffdf8;border:1px solid #ddd;transform-style:preserve-3d;cursor:pointer;overflow:hidden;box-sizing:border-box}.turnjs-static-left-page{left:0;top:0;border-right:2px solid #ccc;z-index:1}.turnjs-static-right-page{right:0;top:0;z-index:1}.turnjs-page.turnjs-animating{pointer-events:none}.turnjs-turning-page{position:absolute;z-index:10;transform-style:preserve-3d;pointer-events:none}.turnjs-turn-next{right:0;top:0;transform-origin:left center;animation:turnNextPage 1s ease-in-out forwards}.turnjs-turn-prev{left:0;top:0;transform-origin:right center;animation:turnPrevPage 1s ease-in-out forwards}@keyframes turnNextPage{0%{transform:rotateY(0)}50%{transform:rotateY(-90deg);box-shadow:-10px 0 30px #0006}to{transform:rotateY(-180deg);box-shadow:-20px 0 40px #0009}}@keyframes turnPrevPage{0%{transform:rotateY(0)}50%{transform:rotateY(90deg);box-shadow:10px 0 30px #0006}to{transform:rotateY(180deg);box-shadow:20px 0 40px #0009}}.turnjs-page-front{position:absolute;width:100%;height:100%;backface-visibility:hidden;background:#fffdf8;border:1px solid #ddd;box-sizing:border-box}.turnjs-page-back{position:absolute;width:100%;height:100%;backface-visibility:hidden;transform:rotateY(180deg);background:#fffdf8;border:1px solid #ddd;box-sizing:border-box}.turnjs-text-content{padding:30px;height:100%;box-sizing:border-box;display:flex;flex-direction:column;justify-content:flex-start;position:relative;background:#fffdf8}.turnjs-story-text{font-family:Georgia,Times New Roman,serif!important;color:#333;text-align:left;margin:0;flex-grow:1;line-height:1.6;word-spacing:1px}.turnjs-page-number{font-size:12px!important;color:#888;text-align:center;margin-top:auto;padding-top:20px;font-family:Georgia,serif!important}.turnjs-audio-controls{display:flex;justify-content:flex-start;align-items:center;margin-top:10px;margin-bottom:10px}.turnjs-loading-placeholder{display:flex;align-items:center;justify-content:center;height:100%;background-color:#f9f9f9;color:#666;font-style:italic}.turnjs-navigation-hint{margin-top:20px;text-align:center;color:#666}.turnjs-book-spread:before{content:"";position:absolute;top:0;left:50%;width:2px;height:100%;background:linear-gradient(to bottom,#0000001a,#0003,#0000001a);transform:translate(-50%);z-index:5;border-radius:1px}.turnjs-page:hover{box-shadow:0 2px 10px #0000001a}.turnjs-page img{border-radius:4px}@media (max-width: 768px){.turnjs-book-container{padding:10px}.turnjs-text-content{padding:20px}.turnjs-story-text{font-size:14px!important}}
