.vote-feedback-modal {
    position: fixed;
    inset: 0;
    z-index: 100;
    display: grid;
    place-items: center;
    padding: 16px;
}
.vote-feedback-modal[hidden] { display: none; }
.vote-feedback-backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    background: rgba(8, 6, 31, .76);
    backdrop-filter: blur(4px);
}
.vote-feedback-dialog {
    position: relative;
    width: min(100%, 500px);
    max-height: min(720px, calc(100dvh - 32px));
    overflow-y: auto;
    padding: 24px;
    border: 2px solid var(--money, var(--lime, #d6ff4b));
    background: var(--void, var(--navy, #08061f));
    color: var(--bone, var(--cream, #efeeff));
    box-shadow: 0 24px 70px rgba(8, 6, 31, .48);
}
.vote-feedback-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-feedback-kicker {
    margin: 0 42px 6px 0;
    color: var(--money, var(--lime, #d6ff4b));
    font: 800 .68rem/1.2 var(--font-display, var(--display, system-ui));
    letter-spacing: .12em;
    text-transform: uppercase;
}
.vote-feedback-dialog h2 {
    margin: 0;
    font: 800 clamp(1.65rem, 6vw, 2.4rem)/.95 var(--font-display, var(--display, system-ui));
    letter-spacing: -.04em;
}
.vote-feedback-selection { margin: 10px 0 20px; color: var(--mute, var(--muted, #9a96d8)); }
.vote-feedback-selection strong { color: var(--bone, var(--cream, #efeeff)); }
.punch-power { margin: 0 0 18px; padding: 0; border: 0; }
.punch-power legend,
.vote-reason-field > span {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 8px;
    font: 800 .72rem/1.2 var(--font-display, var(--display, system-ui));
    letter-spacing: .04em;
    text-transform: uppercase;
}
.punch-power legend span,
.vote-reason-field small { color: var(--mute, var(--muted, #9a96d8)); font: inherit; }
.punch-power-options { display: grid; grid-template-columns: repeat(5, 1fr); gap: 7px; }
.punch-power-option { position: relative; cursor: pointer; }
.punch-power-option input { position: absolute; opacity: 0; pointer-events: none; }
.punch-power-option span {
    min-height: 48px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(239, 238, 255, .28);
    background: rgba(239, 238, 255, .06);
    color: var(--bone, var(--cream, #efeeff));
    font: 800 1rem/1 var(--font-display, var(--display, system-ui));
    pointer-events: none;
}
.punch-power-option:hover span,
.punch-power-option input:focus-visible + span { border-color: var(--money, var(--lime, #d6ff4b)); }
.punch-power-option input:checked + span {
    border-color: var(--money, var(--lime, #d6ff4b));
    background: var(--money, var(--lime, #d6ff4b));
    color: var(--void, var(--navy, #08061f));
}
.punch-power-scale { display: flex; justify-content: space-between; margin-top: 6px; color: var(--mute, var(--muted, #9a96d8)); font: 700 .56rem/1.2 var(--font-display, var(--display, system-ui)); text-transform: uppercase; }
.vote-reason-field { display: block; }
.vote-reason-field textarea {
    width: 100%;
    min-height: 92px;
    resize: vertical;
    padding: 11px;
    border: 1px solid rgba(239, 238, 255, .28);
    border-radius: 0;
    outline: 0;
    background: rgba(239, 238, 255, .06);
    color: var(--bone, var(--cream, #efeeff));
    font: 500 .9rem/1.4 var(--font-body, var(--display, system-ui));
}
.vote-reason-field textarea:focus { border-color: var(--money, var(--lime, #d6ff4b)); }
.vote-reason-field textarea::placeholder { color: var(--mute, var(--muted, #9a96d8)); }
.vote-feedback-error { margin: 10px 0 0; color: #ff8b80; font-size: .78rem; font-weight: 700; }
.vote-feedback-actions { display: grid; grid-template-columns: 1fr 1.35fr; gap: 8px; margin-top: 18px; }
.vote-feedback-actions button { min-height: 46px; padding: 10px; border-radius: 0; font-weight: 800; }
.vote-feedback-cancel { border: 1px solid rgba(239, 238, 255, .28); background: transparent; color: inherit; }
.vote-feedback-submit { border: 1px solid var(--money, var(--lime, #d6ff4b)); background: var(--money, var(--lime, #d6ff4b)); color: var(--void, var(--navy, #08061f)); }
body.vote-feedback-open { overflow: hidden; }

@media (max-width: 420px), (max-height: 620px) {
    .vote-feedback-modal { padding: 8px; align-items: start; }
    .vote-feedback-dialog { max-height: calc(100dvh - 16px); padding: 19px 16px; }
    .vote-feedback-selection { margin-bottom: 15px; }
    .punch-power { margin-bottom: 14px; }
    .punch-power-option span { min-height: 44px; }
    .vote-reason-field textarea { min-height: 76px; }
}