*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden;font-family:Noto Sans JP,sans-serif;background:linear-gradient(160deg,#f5f5f5,#e8e8e8,#f0f0f0);color:#333;-webkit-font-smoothing:antialiased}#app{height:100vh;display:flex;flex-direction:column}#loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;gap:20px;font-size:28px;color:#00000080}.loading-spinner{width:56px;height:56px;border:3px solid rgba(0,0,0,.1);border-top-color:#eb0a1e;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#error{display:flex;align-items:center;justify-content:center;height:100vh;font-size:28px;color:#eb0a1e}.hdr{display:flex;align-items:center;justify-content:space-between;padding:16px 48px;background:#fff;border-bottom:3px solid #EB0A1E;flex-shrink:0;box-shadow:0 2px 12px #0000000f}.hdr-center{text-align:center}.hdr h1{font-size:56px;font-weight:900;color:#222;letter-spacing:6px}.page-ind{font-size:24px;color:#0006;font-weight:500;letter-spacing:1px}.nav-btn{width:64px;height:64px;border-radius:50%;border:2px solid rgba(0,0,0,.15);background:#00000008;color:#555;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.nav-btn:hover:not([disabled]){background:#eb0a1e14;border-color:#eb0a1e;color:#eb0a1e;transform:scale(1.1)}.nav-btn[disabled]{opacity:.2;cursor:default}.nav-btn svg{width:32px;height:32px}.cards{flex:1;display:flex;flex-direction:column;gap:10px;padding:12px 32px;overflow:hidden}.card{display:flex;gap:28px;background:#fff;border:none;border-radius:18px;padding:0 32px 0 0;flex:1 1 0;min-height:0;overflow:hidden;transition:all .3s cubic-bezier(.22,1,.36,1);align-items:stretch;box-shadow:0 2px 12px #00000014}.card-img{width:350px;height:100%;border-radius:18px 0 0 18px;object-fit:cover;object-position:center;flex-shrink:0;image-rendering:auto}.card-img-ph{background:linear-gradient(135deg,#e8e8e8,#d8d8d8);display:flex;align-items:center;justify-content:center}.card-img-ph span{font-size:56px;font-weight:900;color:#eb0a1e;text-shadow:none}.card-body{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:8px;overflow:hidden;padding:12px 0}.card-top{display:flex;align-items:baseline;justify-content:space-between;gap:24px}.card-title{font-size:40px;font-weight:800;color:#222;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}.card-bar{display:flex;align-items:center}.bar-track{flex:1;height:36px;background:#f0f0f0;border-radius:18px;overflow:hidden}.bar-fill{height:100%;border-radius:18px;background:linear-gradient(90deg,#eb0a1e,#f34,#f65);transition:width .8s cubic-bezier(.22,1,.36,1);box-shadow:0 0 8px #eb0a1e4d}.vote-num{font-size:52px;font-weight:900;color:#eb0a1e;min-width:120px;text-align:right;flex-shrink:0}.vote-num small{font-size:26px;font-weight:600;color:#eb0a1eb3;margin-left:2px}.card-cmts{overflow:hidden;position:relative;height:34px;margin-top:4px;border-top:1px solid rgba(0,0,0,.06);padding-top:4px}.cmt-track{display:flex;white-space:nowrap;will-change:transform;backface-visibility:hidden;transform:translateZ(0)}.cmt-half{display:flex;gap:80px;padding-right:80px;flex-shrink:0}.cmt{display:flex;align-items:baseline;gap:12px;flex-shrink:0}.cmt-name{font-weight:800;color:#eb0a1e;white-space:nowrap;font-size:22px}.cmt-text{color:#00000080;white-space:nowrap;font-size:22px}.no-data{display:flex;align-items:center;justify-content:center;height:100%;font-size:28px;color:#0000004d}.ranking-display{display:flex;flex-direction:column;height:100vh;overflow:hidden}