/* R119 投票评选 */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:16px;-webkit-text-size-adjust:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB",sans-serif;background:var(--bg,#F5F7FF);color:var(--text-primary,#1A237E);line-height:1.5;min-height:100vh;padding-bottom:calc(72px + env(safe-area-inset-bottom))}
img{max-width:100%;display:block}
button,input{font:inherit;border:none;background:none;cursor:pointer}
a{color:inherit;text-decoration:none}

#skeleton .sk-hero{height:180px;background:linear-gradient(90deg,#e8eaf6 25%,#f5f5f5 50%,#e8eaf6 75%);background-size:200% 100%;animation:shimmer 1.2s infinite}
#skeleton .sk-stats{height:56px;margin:12px;background:#e8eaf6;border-radius:12px;animation:shimmer 1.2s infinite}
#skeleton .sk-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:12px}
#skeleton .sk-card{height:200px;background:#e8eaf6;border-radius:16px;animation:shimmer 1.2s infinite}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

#hero{position:relative;overflow:hidden;border-radius:0 0 24px 24px;margin-bottom:12px}
#hero-bg{position:absolute;inset:0;opacity:.95}
.hero-content{position:relative;padding:28px 20px 24px;color:#fff;text-align:center}
#hero-title{font-size:1.35rem;font-weight:700;margin:8px 0 4px}
#hero-subtitle{font-size:.9rem;opacity:.9}
.countdown{margin-top:12px;font-size:1.1rem;font-weight:600;background:rgba(0,0,0,.2);display:inline-block;padding:6px 14px;border-radius:20px}

.badge{display:inline-block;padding:4px 10px;border-radius:12px;font-size:.75rem;font-weight:600}
.badge--active{background:var(--accent,#FFD700);color:var(--primary,#1A237E)}
.badge--upcoming{background:#fff3cd;color:#856404}
.badge--ended{background:rgba(255,255,255,.3);color:#fff}

.stats-bar{display:flex;flex-wrap:wrap;gap:12px;padding:12px 16px;background:var(--card-bg,#fff);margin:0 12px 12px;border-radius:16px;box-shadow:0 2px 12px rgba(26,35,126,.08)}
.stats-bar>div{flex:1;min-width:80px;text-align:center}
.stat-label{display:block;font-size:.75rem;color:var(--text-secondary);margin-bottom:2px}
.stats-bar strong{font-size:1.25rem;color:var(--primary)}
.milestone-inline{flex:1 1 100%;display:flex;align-items:center;gap:8px;font-size:.8rem}
.mile-track{flex:1;height:6px;background:#e8eaf6;border-radius:3px;overflow:hidden}
.mile-fill{height:100%;background:var(--accent);border-radius:3px;transition:width .4s}

.toolbar{display:flex;gap:8px;padding:0 12px 12px;align-items:center}
.toolbar input{flex:1;padding:10px 14px;border-radius:12px;border:1px solid #c5cae9;background:#fff}
.btn-primary,.btn-outline{padding:10px 16px;border-radius:12px;font-weight:600}
.btn-primary{background:var(--primary);color:#fff}
.btn-outline{border:1px solid var(--primary);color:var(--primary);background:#fff}

.section-title{font-size:1rem;padding:0 16px 10px;color:var(--text-primary)}
.candidate-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;padding:0 12px 16px}
.candidate-card{position:relative;background:var(--card-bg);border-radius:16px;padding:14px 12px;text-align:center;box-shadow:0 2px 10px rgba(26,35,126,.06);border:2px solid transparent;transition:border .2s,transform .15s}
.candidate-card.selected{border-color:var(--accent)}
.candidate-card:active{transform:scale(.98)}
.c-num{position:absolute;top:8px;left:8px;width:22px;height:22px;border-radius:50%;background:var(--primary);color:#fff;font-size:.7rem;line-height:22px}
.c-avatar{width:72px;height:72px;border-radius:18px;margin:0 auto 8px;object-fit:cover}
.c-name{font-size:.95rem;font-weight:600}
.c-group{font-size:.75rem;color:var(--text-secondary);margin:2px 0}
.c-desc{font-size:.72rem;color:#7986cb;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.c-votes{display:block;font-size:.8rem;color:var(--secondary);margin-bottom:8px}
.c-vote-btn{width:100%;padding:8px;border-radius:10px;background:var(--secondary);color:#fff;font-size:.85rem}
.candidate-card.selected .c-vote-btn{background:var(--accent);color:var(--primary)}

.vote-bar{position:fixed;left:12px;right:12px;bottom:calc(68px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--card-bg);border-radius:16px;box-shadow:0 4px 20px rgba(0,0,0,.12);z-index:50}
.vote-bar.hidden{display:none}
.vote-bar.disabled{opacity:.6;pointer-events:none}
#submit-vote:disabled{opacity:.5}

.results{padding:8px 12px 24px}
.podium{display:flex;align-items:flex-end;justify-content:center;gap:8px;padding:16px 8px 24px;min-height:160px}
.podium-item{flex:1;max-width:100px;text-align:center}
.podium-item img{width:48px;height:48px;border-radius:12px;margin:0 auto 4px;border:2px solid var(--accent)}
.podium-name{font-size:.75rem;font-weight:600;display:block}
.podium-votes{font-size:.7rem;color:var(--text-secondary)}
.podium-bar{height:calc(var(--h,60) * 1px);max-height:100px;background:linear-gradient(180deg,var(--secondary),var(--primary));border-radius:8px 8px 0 0;margin-top:6px}
.rank-1 .podium-bar{background:linear-gradient(180deg,var(--accent),#ffb300)}

.bar-chart{padding:0 4px}
.bar-row{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:.8rem}
.bar-label{width:56px;flex-shrink:0;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar-track{flex:1;height:10px;background:#e8eaf6;border-radius:5px;overflow:hidden}
.bar-fill{height:100%;background:linear-gradient(90deg,var(--secondary),var(--primary));border-radius:5px;transition:width .5s}
.bar-val{width:72px;flex-shrink:0;font-size:.72rem;color:var(--text-secondary)}

.ranking-list{list-style:none;padding:0 4px;margin-top:12px}
.rank-item{display:flex;align-items:center;gap:10px;padding:10px 8px;background:var(--card-bg);border-radius:12px;margin-bottom:8px}
.rank-item.top{border-left:3px solid var(--accent)}
.rank-no{width:24px;font-weight:700;color:var(--primary)}
.rank-item img{width:36px;height:36px;border-radius:10px}
.rank-name{flex:1;font-weight:500}
.rank-votes{font-size:.85rem;color:var(--secondary)}

.security-hint{text-align:center;font-size:.72rem;color:var(--text-secondary);padding:0 16px 20px}

.modal{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-end;justify-content:center;pointer-events:none;opacity:0;transition:opacity .25s}
.modal.open{pointer-events:auto;opacity:1}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45)}
.modal-sheet{position:relative;width:100%;max-width:480px;max-height:85vh;overflow-y:auto;background:var(--card-bg);border-radius:20px 20px 0 0;padding:24px 20px 32px;transform:translateY(100%);transition:transform .3s}
.modal.open .modal-sheet{transform:translateY(0)}
.modal-close{position:absolute;top:12px;right:12px;width:32px;height:32px;border-radius:50%;background:#f5f5f5}
.detail-avatar{width:100px;height:100px;border-radius:20px;margin:0 auto 12px}
.detail-group{color:var(--text-secondary);font-size:.85rem;margin-bottom:8px}
.detail-votes{font-weight:600;color:var(--primary);margin:12px 0}
#detail-vote-btn{width:100%}

.admin-panel{position:fixed;inset:12px;z-index:300;background:var(--card-bg);border-radius:16px;padding:16px;overflow-y:auto;box-shadow:0 8px 32px rgba(0,0,0,.2)}
.admin-panel header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.admin-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px}
.kpi-card{background:var(--bg);padding:10px;border-radius:12px;text-align:center;font-size:.75rem}
.kpi-card strong{display:block;font-size:1.1rem;margin-top:4px}
.admin-groups{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.admin-groups .tag{background:var(--bg);padding:4px 10px;border-radius:8px;font-size:.75rem}
.admin-actions{display:flex;gap:8px;margin-bottom:12px}
.admin-actions button{flex:1;padding:10px;background:var(--primary);color:#fff;border-radius:10px}
.admin-log{max-height:200px;overflow-y:auto;font-size:.72rem;background:var(--bg);padding:8px;border-radius:10px}
.log-row{padding:4px 0;border-bottom:1px solid #e8eaf6}

.toast{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(.9);background:rgba(26,35,126,.92);color:#fff;padding:12px 20px;border-radius:12px;font-size:.9rem;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:400}
.toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}
.toast.ok{background:rgba(0,200,83,.92)}
.toast.warn{background:rgba(255,82,82,.92)}

.confetti-piece{position:fixed;top:-10px;width:8px;height:14px;border-radius:2px;pointer-events:none;z-index:500;animation:confetti-fall 2s ease-out forwards}
@keyframes confetti-fall{to{transform:translateY(100vh) rotate(720deg);opacity:0}}
.supporter-badge{position:fixed;top:80px;left:50%;transform:translateX(-50%);background:var(--accent);color:var(--primary);padding:10px 18px;border-radius:20px;font-weight:600;opacity:0;transition:opacity .3s;z-index:100}
.supporter-badge.show{opacity:1}

.share-page,.invite-page{background:var(--bg)}
.share-main,.invite-main{max-width:480px;margin:0 auto;padding:24px 16px}
.share-hero,.invite-card{text-align:center;background:var(--card-bg);border-radius:20px;padding:28px 20px;box-shadow:0 4px 20px rgba(26,35,126,.1)}
.share-hero h1,.invite-card h1{font-size:1.25rem;margin-bottom:8px;color:var(--primary)}
.share-candidates-preview{display:flex;justify-content:center;gap:8px;margin:16px 0;align-items:center}
.share-candidates-preview img{width:48px;height:48px;border-radius:12px}
.share-candidates-preview .more{font-size:.85rem;color:var(--text-secondary)}
.share-qr-block,.invite-card #invite-qr{margin:16px auto}
.share-qr-block p,.invite-card p{color:var(--text-secondary);font-size:.9rem;margin:8px 0 16px}
.share-cta{display:inline-block;margin:8px 0;width:100%;text-align:center;padding:12px}
.invite-from{font-size:.9rem;color:var(--secondary);margin-bottom:8px}
.invite-card .btn-primary,.invite-card .btn-outline,.share-qr-block .btn-outline{display:block;width:100%;margin-top:8px;padding:12px;text-align:center}

.contact-footer{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid #e8eaf6;padding:8px 12px calc(8px + env(safe-area-inset-bottom));z-index:60}
.contact-footer__btns{display:flex;gap:8px}
.contact-footer__cta{flex:1.2;text-align:center;padding:10px;background:var(--primary,#1A237E);color:#fff;border-radius:10px;font-weight:600}
.contact-footer__btn{flex:1;text-align:center;padding:10px;border:1px solid #c5cae9;border-radius:10px;font-size:.85rem}
.contact-footer__brand{text-align:center;font-size:.65rem;color:#9e9e9e;margin-top:6px}

.empty{text-align:center;color:var(--text-secondary);padding:24px;grid-column:1/-1}
.chart-timeline{display:flex;align-items:flex-end;gap:4px;height:80px;margin-top:12px;padding:0 4px}
.tl-bar{flex:1;background:var(--secondary);border-radius:4px 4px 0 0;min-height:4px;position:relative}
.tl-bar span{position:absolute;bottom:-18px;left:50%;transform:translateX(-50%);font-size:.6rem;color:var(--text-secondary)}

@media(min-width:600px){
  .candidate-grid{grid-template-columns:repeat(3,1fr)}
  #hero-title{font-size:1.6rem}
}