.vote-insights-modal {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: grid;
    place-items: center;
    padding: 16px;
}
.vote-insights-modal[hidden] { display: none; }
.vote-insights-backdrop { position: absolute; inset: 0; border: 0; background: rgba(8, 6, 31, .76); backdrop-filter: blur(4px); }
.vote-insights-dialog {
    position: relative;
    width: min(100%, 560px);
    max-height: calc(100dvh - 32px);
    overflow-y: auto;
    padding: 24px;
    border: 2px solid var(--money, #d6ff4b);
    background: var(--void, #08061f);
    color: var(--bone, #efeeff);
    box-shadow: 0 24px 70px rgba(8, 6, 31, .48);
    font-family: var(--font-body, var(--font-display, system-ui));
}
.vote-insights-close { position: absolute; top: 8px; right: 10px; width: 38px; height: 38px; border: 0; background: transparent; color: inherit; font-size: 1.8rem; line-height: 1; }
.vote-insights-kicker { margin: 0 42px 6px 0; color: var(--money, #d6ff4b); font-size: .68rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.vote-insights-dialog h2 { margin: 0; font-family: var(--font-display, system-ui); font-size: clamp(1.7rem, 6vw, 2.5rem); font-weight: 800; line-height: .95; letter-spacing: -.04em; }
.vote-insights-matchup { margin: 10px 0 20px; color: var(--mute, #9a96d8); }
.vote-insights-scores { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.vote-insight-score { min-width: 0; padding: 13px; border: 1px solid rgba(239, 238, 255, .18); background: rgba(239, 238, 255, .05); }
.vote-insight-score-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.vote-insight-score-identity { display: flex; min-width: 0; align-items: center; gap: 9px; }
.vote-insight-score-identity > div { min-width: 0; overflow: hidden; }
.vote-insight-score h3 { margin: 0; font-size: .94rem; line-height: 1.15; overflow-wrap: anywhere; }
.vote-insight-score-identity > div > span { display: block; margin-top: 3px; color: var(--mute, #9a96d8); font-size: .66rem; font-weight: 700; }
.vote-insight-score-value { flex: 0 0 auto; color: var(--money, #d6ff4b); font-size: 1rem; }
.vote-insight-meter { height: 7px; margin-top: 8px; background: rgba(239, 238, 255, .12); overflow: hidden; }
.vote-insight-meter span { display: block; height: 100%; background: var(--money, #d6ff4b); }
.vote-insight-avatar { position: relative; display: grid; flex: 0 0 40px; width: 40px; height: 40px; overflow: hidden; place-items: center; border: 1px solid rgba(214, 255, 75, .42); background: rgba(214, 255, 75, .1); color: var(--money, #d6ff4b); font-size: .68rem; font-weight: 800; letter-spacing: .02em; }
.vote-insight-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: var(--void, #08061f); }
.vote-insight-avatar.has-logo { border: 0; background: transparent; }
.vote-insight-avatar.has-logo img { background: transparent; }
.vote-insights-reasons { margin-top: 18px; }
.vote-insights-reasons[hidden] { display: none; }
.vote-insights-reasons > h3 { margin: 0 0 8px; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; }
.vote-insight-reason { display: flex; min-width: 0; align-items: flex-start; gap: 11px; margin: 0 0 7px; padding: 12px; border-left: 3px solid rgba(214, 255, 75, .65); background: rgba(239, 238, 255, .06); }
.vote-insight-reason-body { min-width: 0; flex: 1; }
.vote-insight-reason-meta { display: flex; min-width: 0; align-items: baseline; justify-content: space-between; gap: 10px; }
.vote-insight-reason h4 { min-width: 0; margin: 0; color: var(--bone, #efeeff); font-size: .88rem; line-height: 1.25; overflow-wrap: anywhere; }
.vote-insight-reason-meta strong { flex: 0 0 auto; color: var(--money, #d6ff4b); font-size: .78rem; }
.vote-insight-reason p { margin: 4px 0 0; color: var(--bone, #efeeff); font-size: .82rem; line-height: 1.45; white-space: pre-wrap; }
.vote-insights-note { margin: 8px 0 0; color: var(--mute, #9a96d8); font-size: .72rem; }
body.vote-insights-open { overflow: hidden; }

@media (max-width: 420px), (max-height: 620px) {
    .vote-insights-modal { align-items: start; padding: 8px; }
    .vote-insights-dialog { max-height: calc(100dvh - 16px); padding: 19px 16px; }
    .vote-insights-scores { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
    .vote-insight-score { padding: 9px; }
    .vote-insight-score-head { gap: 6px; }
    .vote-insight-score-identity { gap: 5px; }
    .vote-insight-score h3 { max-width: 100%; overflow: hidden; font-size: .72rem; letter-spacing: -.015em; text-overflow: ellipsis; white-space: nowrap; }
    .vote-insight-score-identity > div > span { font-size: .58rem; }
    .vote-insight-score-value { font-size: .76rem; }
    .vote-insight-score .vote-insight-avatar { flex-basis: 30px; width: 30px; height: 30px; font-size: .56rem; }
    .vote-insight-reason { padding: 11px 10px; }
}

@media (max-width: 350px) {
    .vote-insight-score-head { display: block; }
    .vote-insight-score-value { display: block; margin-top: 7px; text-align: right; }
}
