*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;letter-spacing:1px}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:linear-gradient(135deg,#f89ca0,#ec313c);min-height:100vh;display:flex;justify-content:center;align-items:center;padding:10px;overflow:hidden}.start-container{text-align:center;color:#fff;max-width:1000px;width:100%;padding:10px 20px 100px;max-height:100vh;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;justify-content:flex-start}.start-container h1{font-size:3rem;margin-bottom:2rem;animation:fadeInUp .8s ease}.start-btn{padding:20px 60px;font-size:1.5rem;background:#fff;color:#666;border:none;border-radius:50px;cursor:pointer;font-weight:700;transition:all .3s ease;box-shadow:0 10px 30px #0000004d;animation:fadeInUp .8s ease .3s backwards}.start-btn:hover{transform:scale(1.05);box-shadow:0 15px 40px #0006}.fullscreen-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#f89ca0,#ec313c);z-index:9999;overflow:hidden;transition:background .8s ease}.fullscreen-overlay.active{display:block}.ranking-card{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:60px 20px 140px;opacity:0;overflow-y:auto;-webkit-overflow-scrolling:touch}.ranking-card.anim-slide-right{transform:translate(100%) scale(.9)}.ranking-card.anim-slide-right.active{opacity:1;transform:translate(0) scale(1);transition:all .7s cubic-bezier(.34,1.56,.64,1)}.ranking-card.anim-slide-right.exit{opacity:0;transform:translate(-100%) scale(.9);transition:all .6s cubic-bezier(.68,-.55,.27,1.55)}.ranking-card.anim-slide-left{transform:translate(-100%) scale(.9)}.ranking-card.anim-slide-left.active{opacity:1;transform:translate(0) scale(1);transition:all .7s cubic-bezier(.34,1.56,.64,1)}.ranking-card.anim-slide-left.exit{opacity:0;transform:translate(100%) scale(.9);transition:all .6s cubic-bezier(.68,-.55,.27,1.55)}.ranking-card.anim-zoom{transform:scale(.3)}.ranking-card.anim-zoom.active{opacity:1;transform:scale(1);transition:all .8s cubic-bezier(.34,1.56,.64,1)}.ranking-card.anim-zoom.exit{opacity:0;transform:scale(1.5) rotate(10deg);transition:all .6s cubic-bezier(.68,-.55,.27,1.55)}.ranking-card.anim-slide-top{transform:translateY(-100%) scale(.95)}.ranking-card.anim-slide-top.active{opacity:1;transform:translateY(0) scale(1);transition:all .7s cubic-bezier(.34,1.56,.64,1)}.ranking-card.anim-slide-top.exit{opacity:0;transform:translateY(100%) scale(.95);transition:all .6s cubic-bezier(.68,-.55,.27,1.55)}.ranking-card.anim-slide-bottom{transform:translateY(100%) scale(.95)}.ranking-card.anim-slide-bottom.active{opacity:1;transform:translateY(0) scale(1);transition:all .7s cubic-bezier(.34,1.56,.64,1)}.ranking-card.anim-slide-bottom.exit{opacity:0;transform:translateY(-100%) scale(.95);transition:all .6s cubic-bezier(.68,-.55,.27,1.55)}.ranking-card.anim-rotate{transform:scale(.5) rotate(-180deg)}.ranking-card.anim-rotate.active{opacity:1;transform:scale(1) rotate(0);transition:all .8s cubic-bezier(.34,1.56,.64,1)}.ranking-card.anim-rotate.exit{opacity:0;transform:scale(.5) rotate(180deg);transition:all .6s cubic-bezier(.68,-.55,.27,1.55)}.ranking-card.anim-diagonal-tr{transform:translate(100%,-100%) scale(.8)}.ranking-card.anim-diagonal-tr.active{opacity:1;transform:translate(0) scale(1);transition:all .7s cubic-bezier(.34,1.56,.64,1)}.ranking-card.anim-diagonal-tr.exit{opacity:0;transform:translate(-100%,100%) scale(.8);transition:all .6s cubic-bezier(.68,-.55,.27,1.55)}.ranking-card.anim-flip{transform:perspective(1000px) rotateY(90deg) scale(.9)}.ranking-card.anim-flip.active{opacity:1;transform:perspective(1000px) rotateY(0) scale(1);transition:all .8s cubic-bezier(.34,1.56,.64,1)}.ranking-card.anim-flip.exit{opacity:0;transform:perspective(1000px) rotateY(-90deg) scale(.9);transition:all .6s cubic-bezier(.68,-.55,.27,1.55)}.content-wrapper{background:#ffffff26;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:25px;padding:25px;max-width:700px;width:100%;box-shadow:0 20px 60px #0000004d;display:flex;flex-direction:column;align-items:center;margin-top:40px}.image-container{width:100%;max-width:400px;overflow:hidden;border-radius:15px;margin-bottom:20px;box-shadow:0 10px 30px #0006;background:#0000001a;position:relative;flex-shrink:0}.image-container:before{content:"";display:block;padding-top:125%}.cover-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.news-title{font-size:clamp(1.1rem,3.5vw,1.8rem);color:#fff;text-align:center;line-height:1.5;font-weight:600;margin-bottom:10px;word-break:break-word;transition:color .3s ease}.book-author{font-size:clamp(.95rem,2.8vw,1.2rem);color:#fff;text-align:center;font-style:italic;opacity:.9;margin-bottom:15px;transition:color .3s ease}.book-recommendation{text-align:center;margin-bottom:20px;padding:15px;background:#0000001a;border-radius:15px;width:100%}.recommender{font-size:clamp(.9rem,2.5vw,1.1rem);font-weight:600;margin-bottom:8px;opacity:.95}.recommend-reason{font-size:clamp(.9rem,2.5vw,1.1rem);font-style:italic;line-height:1.5;opacity:.9}.news-link{display:inline-block;padding:12px 30px;background:#fff3;color:#fff;text-decoration:none;border-radius:25px;transition:all .3s ease;font-weight:500;font-size:clamp(.9rem,2.5vw,1rem);border:2px solid transparent}.news-link:hover{background:#ffffff4d;transform:translateY(-2px)}.controls{position:fixed;bottom:30px;left:50%;transform:translate(-50%);display:flex;gap:15px;z-index:10000;width:90%;max-width:400px;justify-content:center}.ranking-card>.controls{display:none!important}.control-btn{padding:15px 35px;font-size:1.1rem;background:#fff;color:#666;border:none;border-radius:50px;cursor:pointer;font-weight:700;transition:all .3s ease;box-shadow:0 10px 30px #0000004d;flex:1;min-width:0;display:flex;align-items:center;justify-content:center}.control-btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 15px 40px #0006}.control-btn:disabled{opacity:.3;cursor:not-allowed}.arrow{width:0;height:0;border-style:solid}.arrow-left{border-width:10px 15px 10px 0;border-color:transparent currentColor transparent transparent}.arrow-right{border-width:10px 0 10px 15px;border-color:transparent transparent transparent currentColor}.control-btn-share{gap:8px}.control-btn-share svg{transition:transform .3s ease}.control-btn-share:hover svg{transform:scale(1.2)}.close-btn{position:fixed;top:20px;right:20px;width:45px;height:45px;background:#fff3;border:none;border-radius:50%;color:#fff;font-size:1.3rem;cursor:pointer;transition:all .3s ease;z-index:10000;display:flex;align-items:center;justify-content:center}.close-btn:hover{background:#ffffff4d;transform:rotate(90deg)}.progress-indicator{display:none}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){body{padding:10px}.start-container h1{font-size:2rem;margin-bottom:1.5rem}.start-btn{padding:15px 40px;font-size:1.2rem}.ranking-card{padding:20px 15px 120px;justify-content:flex-start}.content-wrapper{padding:15px;border-radius:20px;height:auto;margin-top:20px}.image-container{max-width:100%;margin-bottom:12px;border-radius:12px}.news-title{margin-bottom:12px;font-size:clamp(1rem,3vw,1.5rem)}.news-link{padding:10px 25px;font-size:clamp(.85rem,2.2vw,.95rem)}.controls{bottom:20px;gap:10px;width:calc(100% - 40px)}.control-btn{padding:12px 20px;font-size:1rem}.close-btn{width:40px;height:40px;font-size:1.2rem}.progress-indicator{top:20px;padding:6px 15px}}@media (max-width: 480px){.ranking-card{padding:15px 15px 110px;justify-content:flex-start}.content-wrapper{padding:12px;height:auto;margin-top:15px}.image-container{margin-bottom:10px}.news-title{margin-bottom:10px;font-size:clamp(.9rem,2.8vw,1.3rem)}.news-link{padding:8px 20px;font-size:clamp(.8rem,2vw,.9rem)}.controls{bottom:15px}.control-btn{padding:10px 15px}}@media (min-width: 769px) and (orientation: landscape){.ranking-card:not(.ending-card){display:grid;grid-template-columns:1fr 200px;grid-template-rows:1fr;align-items:center;justify-content:center;padding:20px;gap:20px;height:100vh}.ranking-card:not(.ending-card) .content-wrapper{grid-column:1;grid-row:1;max-width:700px;max-height:90vh;overflow-y:auto;margin:0 auto;padding:20px}.ranking-card:not(.ending-card)>.controls{position:static!important;grid-column:2;grid-row:1;flex-direction:column;width:auto;max-width:none;transform:none;gap:20px;display:flex!important}.ranking-card:not(.ending-card) .control-btn{width:100%;padding:20px}.ranking-card:not(.ending-card) .image-container{max-width:300px;max-height:60vh}.fullscreen-overlay>.controls{display:none}.ranking-card.ending-card{padding:60px 80px}.ranking-card.ending-card .content-wrapper{max-width:900px;padding:40px 50px}}@media (max-width: 768px) and (orientation: landscape){.ranking-card{padding-top:20px;justify-content:center}.content-wrapper{padding:15px;height:auto}.image-container{max-width:400px}}