.plan-picker-dialog { width: min(1100px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); box-sizing: border-box; padding: clamp(20px, 4vw, 40px); border: 1px solid #d9d5e8; border-radius: 24px; background: #faf9ff; color: #252237; }
.plan-picker-dialog::backdrop { background: rgb(15 12 28 / .65); }
.plan-picker-dialog h2 { margin: 0 40px 8px 0; font-size: 1.8rem; }
.plan-picker-close { position: absolute; right: 16px; top: 12px; border: 0; background: transparent; color: inherit; font-size: 2rem; cursor: pointer; }
.plan-picker-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr)); gap: 14px; margin: 24px 0; }
.plan-picker-card { display: flex; flex-direction: column; padding: 20px; border: 1px solid #dad6e7; border-radius: 16px; background: #fff; min-width: 0; }
.plan-picker-card[data-current=true] { outline: 2px solid #8170d0; }
.plan-picker-card h3 { margin: 0; }
.plan-picker-card .plan-picker-price { font-size: 1.6rem; font-weight: 700; margin: 12px 0; }
.plan-picker-card p, .plan-picker-card li { font-size: .9rem; line-height: 1.5; }
.plan-picker-card ul { padding-left: 18px; margin-bottom: 24px; }
.plan-picker-card button { margin-top: auto; padding: 12px; background: #6450b6; color: #fff; border: 0; border-radius: 10px; font: inherit; cursor: pointer; }
.plan-picker-card button:disabled { opacity: .6; cursor: default; }
.plan-picker-dialog progress { width: 100%; height: 10px; accent-color: #8170d0; }
.plan-picker-note { font-size: .85rem; line-height: 1.5; }
.plan-picker-status { min-height: 1.5em; }
.usage-plans-button { padding: 9px 16px; border: 1px solid #8170d0; border-radius: 999px; background: transparent; color: inherit; font: inherit; cursor: pointer; }
:root[data-theme=dark] .plan-picker-dialog { background: #191925; color: #f2efff; border-color: #454054; }
:root[data-theme=dark] .plan-picker-card { background: #222130; border-color: #454054; }