.generation-upgrade {
    box-sizing: border-box;
    width: min(460px, calc(100% - 32px));
    max-height: calc(100dvh - 32px);
    margin: auto;
    padding: 28px;
    border: 1px solid #454545;
    border-radius: 8px;
    background: #171717;
    color: #f5f5f5;
    font-family: Inter, sans-serif;
    letter-spacing: 0;
}
.generation-upgrade::backdrop { background: rgb(0 0 0 / 65%); }
.generation-upgrade h2 { margin: 0 0 14px; font-size: 24px; line-height: 1.25; letter-spacing: 0; }
.generation-upgrade p { margin: 0 0 14px; font-size: 14px; line-height: 1.6; color: #d2d2d2; }
.generation-upgrade .generation-upgrade-note { color: #a3a3a3; font-size: 13px; }
.generation-upgrade-actions { display: flex; justify-content: flex-end; align-items: center; gap: 12px; margin-top: 24px; }
.generation-upgrade-actions form { margin: 0; }
.generation-upgrade-actions .btn-primary,
.generation-upgrade-actions .btn-ghost { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 16px; border-radius: 6px; font-size: 14px; text-align: center; white-space: normal; }
.generation-upgrade-actions :focus-visible { outline: 2px solid #d4ff3a; outline-offset: 4px; }
@media (max-width: 420px) {
    .generation-upgrade { padding: 24px; }
    .generation-upgrade-actions { flex-direction: column-reverse; align-items: stretch; }
    .generation-upgrade-actions button { width: 100%; }
}