*{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,#666,#764ba2);min-height:100vh;display:flex;justify-content:center;align-items:center;padding:10px;overflow:hidden}.start-container{text-align:center;color:#fff;max-width:800px;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,#666,#764ba2);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)}.rank-number{font-size:clamp(3rem,12vw,6rem);font-weight:900;color:#ffffff4d;margin-bottom:10px;text-shadow:0 4px 20px rgba(0,0,0,.2);transition:color .3s ease}.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}.image-container{width:100%;max-width:400px;aspect-ratio:2048 / 2560;overflow:hidden;border-radius:15px;margin-bottom:20px;box-shadow:0 10px 30px #0006;background:#0000001a}.cover-image{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:20px;word-break:break-word;transition:color .3s ease}.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:40px 15px 120px;justify-content:center}.rank-number{margin-bottom:8px;font-size:clamp(2.5rem,10vw,5rem)}.content-wrapper{padding:15px;border-radius:20px;max-height:calc(100vh - 220px);overflow-y:auto;-webkit-overflow-scrolling:touch}.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:30px 15px 110px}.rank-number{font-size:clamp(2rem,8vw,4rem);margin-bottom:6px}.content-wrapper{padding:12px;max-height:calc(100vh - 200px)}.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:200px 1fr 200px;grid-template-rows:1fr;align-items:center;justify-content:center;padding:40px;gap:40px}.ranking-card:not(.ending-card) .rank-number{font-size:clamp(6rem,12vw,10rem);margin-bottom:0;grid-column:1;grid-row:1;display:flex;align-items:center;justify-content:center}.ranking-card:not(.ending-card) .content-wrapper{grid-column:2;grid-row:1;max-width:600px;margin:0 auto}.ranking-card:not(.ending-card)>.controls{position:static!important;grid-column:3;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:350px}.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}.rank-number{font-size:3rem;margin-bottom:5px}.content-wrapper{padding:15px;max-height:calc(100vh - 120px)}.image-container{max-width:400px}}