.voting-hero{grid-template-areas:'heading art' 'vote art' 'actions actions';grid-template-columns:1fr 1fr;row-gap:14px}.voting-hero .character-heading{grid-area:heading}.voting-hero .character-heading h1{font-size:64px;margin:10px 0}.voting-hero .character-stage{grid-area:art}.voting-hero .character-actions{grid-area:actions;margin-top:0}.voting-hero .character-hello{display:none}
.vote-panel{grid-area:vote;background:#fffdf5;border:2px solid #172b55;border-radius:24px;padding:24px;box-shadow:5px 6px 0 #172b55}.vote-kicker{font-family:var(--round);font-size:20px;font-weight:900;margin:0 0 12px}.vote-personal-score{display:flex;align-items:baseline;gap:24px}.vote-personal-score>span{font-size:14px}.vote-personal-score b{font-family:var(--round);font-size:42px;line-height:1.2}.vote-breakdown{font-size:11px;color:#526180;margin:12px 0 16px}.vote-button,.ranking-vote{font-family:var(--round)!important;font-weight:900!important;cursor:pointer;border:2px solid #172b55;color:#172b55;background:#ffe253;border-radius:999px;min-height:48px;padding:12px 24px;transition:transform .15s,background .15s}.vote-panel>.vote-button{width:100%;box-shadow:3px 4px 0 #172b55;font-size:18px}.vote-button:hover:not(:disabled),.ranking-vote:hover:not(:disabled){background:#ffb4c6;transform:translateY(-2px)}.vote-button:disabled,.ranking-vote:disabled{background:#e8e9e6;color:#596370;box-shadow:none;cursor:default;opacity:1}.vote-button.voted,.ranking-vote.voted{background:#a7e2da;color:#172b55}.vote-day-rule{font-size:11px!important;line-height:1.9!important;color:#526180;margin:17px 0 0!important}.vote-ranking-link{display:block;margin-top:12px;font-size:12px;font-weight:800;text-decoration:underline;text-underline-offset:4px}[data-vote-status]{font-size:13px;line-height:1.8;font-weight:700;margin:12px 0 0}.vote-panel [data-vote-status]:empty{display:none}
.oshi-ranking{max-width:1050px;margin:auto;padding:72px 24px;scroll-margin-top:25px}.ranking-heading{display:flex;align-items:end;justify-content:space-between;gap:28px;margin-bottom:28px}.ranking-heading h2{font:900 42px/1.5 var(--round);margin:8px 0 0}.ranking-heading>p{font-size:14px;line-height:2}.ranking-summary{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px 28px;padding:20px 24px;background:#ffe879;border:2px solid #172b55;border-radius:20px}.ranking-summary>span{font-size:15px;font-weight:800;white-space:nowrap}.ranking-summary b{font:900 36px/1.2 var(--round);margin:0 4px}.ranking-summary p{font-size:12px;margin:0;line-height:1.9}.opening-disclosure{font-size:12px;line-height:1.9;color:#526180;margin:14px 4px 25px}.ranking-list{list-style:none;padding:0!important;margin:0!important;display:grid;gap:12px}.ranking-row{display:grid;grid-template-columns:40px 1fr 150px 84px;align-items:center;gap:16px;padding:12px 20px;border:2px solid #d4dced;border-radius:20px;background:#fffdf5}.ranking-row[data-rank='1']{border-color:#172b55;background:#fff1b5;box-shadow:4px 4px 0 #ffb4c6}.ranking-place{font:900 30px var(--round);text-align:center}.ranking-character{display:flex;align-items:center;gap:14px;min-width:0;color:#172b55;text-decoration:none}.ranking-face{display:block;width:70px;height:70px;overflow:hidden;flex-shrink:0}.ranking-face img{display:block;width:200%;height:auto;max-width:none}.ranking-character b{font:900 21px var(--round)}.ranking-character small{display:block;font-size:10px;line-height:1.7;margin-top:4px}.ranking-count{font-size:12px;text-align:right}.ranking-count>b{font:900 28px var(--round);margin-right:3px}.ranking-count small{display:block;font-size:10px;line-height:1.7;white-space:nowrap;color:#526180}.ranking-vote{font-size:13px;padding:8px 10px;min-width:74px}.vote-refresh{font-size:11px;color:#526180;margin-top:20px}.vote-retry{margin-top:16px;border:2px solid #172b55;padding:10px 20px;border-radius:30px;background:white;color:#172b55;font-weight:700}
.character-story{max-width:1050px;margin:0 auto 40px;padding:0 24px}.character-story>summary{font:800 19px var(--round);border-block:2px solid #d4dced;padding:22px 0;cursor:pointer}.character-story .character-about{padding:36px 0}.character-story .character-play{border-radius:20px}.character-dock>.vote-button{min-width:190px;padding:9px 18px;font-size:13px}.character-dock a{align-self:center}
@media(max-width:760px){.friends-hero{padding:35px 22px}.friends-hero h1{font-size:43px}.friends-hero>p:not(.eyebrow){font-size:14px}.voting-hero{grid-template-areas:'heading' 'art' 'vote' 'actions';grid-template-columns:1fr;gap:14px;padding:25px 20px}.voting-hero .character-heading h1{font-size:46px;margin:4px 0}.voting-hero .character-tagline{font-size:15px;margin:8px 0}.voting-hero .character-stage{width:240px;max-width:80%;margin:auto}.voting-hero .character-stage .art-hint{font-size:10px}.voting-hero .pose-caption{margin:8px 0 0;font-size:12px}.vote-panel{padding:19px;box-shadow:3px 4px 0 #172b55}.vote-kicker{font-size:18px}.vote-personal-score b{font-size:34px}.vote-panel>.vote-button{font-size:16px;min-height:52px}.vote-day-rule{font-size:10px!important}.oshi-ranking{padding:45px 20px}.ranking-heading{display:block;margin-bottom:22px}.ranking-heading h2{font-size:32px}.ranking-heading>p{font-size:12px;margin:16px 0 0}.ranking-summary{padding:16px 18px;gap:8px}.ranking-summary b{font-size:31px}.ranking-summary p{font-size:11px}.opening-disclosure{font-size:11px;margin:13px 0 22px}.ranking-row{grid-template-columns:25px 1fr auto;gap:7px;padding:11px 10px;border-radius:16px}.ranking-place{font-size:23px}.ranking-character{gap:5px}.ranking-face{width:43px;height:52px}.ranking-character b{font-size:15px}.ranking-character small{font-size:8px}.ranking-count{grid-column:2;text-align:left;margin-left:48px;grid-row:2;margin-top:-8px}.ranking-count>b{font-size:22px}.ranking-count small{font-size:9px;display:inline;margin-left:8px;white-space:normal}.ranking-vote{grid-column:3;grid-row:1/3;min-width:63px;max-width:75px;font-size:10px;padding:8px 7px}.character-story{padding:0 20px}.character-story>summary{font-size:17px}.character-dock>.vote-button{font-size:12px;min-width:165px;max-width:70%;min-height:46px}.character-actions [data-character-status]{width:100%}}
@media(prefers-reduced-motion:reduce){.vote-button,.ranking-vote{transition:none}}
