.credit-confirmation-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--spacing-md);animation:fadeIn .2s ease-out}.credit-confirmation-modal{background:#fff;border-radius:var(--radius-xl);padding:var(--spacing-xl);max-width:420px;width:100%;position:relative;box-shadow:0 25px 50px -12px #00000040;animation:slideUp .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.credit-confirmation-modal-close{position:absolute;top:var(--spacing-md);right:var(--spacing-md);width:32px;height:32px;border:none;background:transparent;cursor:pointer;color:var(--color-text-secondary);padding:0;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-full);transition:background-color .2s,color .2s}.credit-confirmation-modal-close:hover{background:var(--color-surface-hover);color:var(--color-text-primary)}.credit-confirmation-modal-close svg{width:20px;height:20px}.credit-confirmation-modal-icon{width:64px;height:64px;margin:0 auto var(--spacing-md);background:linear-gradient(135deg,#e0f2fe,#bae6fd);border-radius:var(--radius-full);display:flex;align-items:center;justify-content:center;color:#0284c7}.credit-confirmation-modal-icon svg{width:32px;height:32px}.credit-confirmation-modal:has(.credit-confirmation-modal-insufficient) .credit-confirmation-modal-icon{background:linear-gradient(135deg,#fef2f2,#fecaca);color:#dc2626}.credit-confirmation-modal-title{font-size:var(--font-size-xl);font-weight:600;text-align:center;margin:0 0 var(--spacing-sm);color:var(--color-text-primary)}.credit-confirmation-modal-description{text-align:center;color:var(--color-text-secondary);font-size:var(--font-size-sm);margin:0 0 var(--spacing-lg);line-height:1.5}.credit-confirmation-modal-balance{background:var(--color-surface);border-radius:var(--radius-lg);padding:var(--spacing-md);margin-bottom:var(--spacing-md)}.credit-confirmation-modal-balance-row{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-xs) 0;font-size:var(--font-size-sm)}.credit-confirmation-modal-balance-row span:first-child{color:var(--color-text-secondary)}.credit-confirmation-modal-balance-row span:last-child{font-weight:600;color:var(--color-text-primary)}.credit-confirmation-modal-balance-row.cost{border-top:1px dashed var(--color-border);margin-top:var(--spacing-xs);padding-top:var(--spacing-sm)}.credit-confirmation-modal-balance-row.remaining{border-top:1px solid var(--color-border);margin-top:var(--spacing-xs);padding-top:var(--spacing-sm)}.credit-confirmation-modal-balance-row .low-balance{color:#f59e0b}.credit-confirmation-modal-balance-row .insufficient{color:#dc2626}.credit-confirmation-modal-breakdown{margin-bottom:var(--spacing-md)}.credit-confirmation-modal-breakdown h3{font-size:var(--font-size-sm);font-weight:500;color:var(--color-text-secondary);margin:0 0 var(--spacing-sm);text-transform:uppercase;letter-spacing:.5px}.credit-confirmation-modal-breakdown-list{background:var(--color-surface);border-radius:var(--radius-md);overflow:hidden}.credit-confirmation-modal-breakdown-item{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-sm);border-bottom:1px solid var(--color-border)}.credit-confirmation-modal-breakdown-item:last-child{border-bottom:none}.credit-confirmation-modal-breakdown-item span:first-child{display:flex;align-items:center;gap:var(--spacing-xs);color:var(--color-text-primary)}.credit-confirmation-modal-breakdown-item span:last-child{font-weight:500;color:var(--color-text-secondary)}.credit-confirmation-modal-breakdown-item.cached{opacity:.7}.credit-confirmation-modal-breakdown-item.cached span:last-child{text-decoration:line-through;color:var(--color-text-tertiary)}.cached-badge{display:inline-flex;align-items:center;padding:2px 6px;background:linear-gradient(135deg,#d1fae5,#a7f3d0);color:#059669;font-size:10px;font-weight:600;border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.3px}.credit-confirmation-modal-cache-message{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-sm) var(--spacing-md);background:linear-gradient(135deg,#fef3c7,#fde68a);border-radius:var(--radius-md);font-size:var(--font-size-sm);color:#92400e;margin-bottom:var(--spacing-md)}.credit-confirmation-modal-cache-message svg{width:16px;height:16px;flex-shrink:0}.credit-confirmation-modal-insufficient{text-align:center;padding:var(--spacing-md);background:linear-gradient(135deg,#fef2f2,#fee2e2);border-radius:var(--radius-lg);margin-bottom:var(--spacing-md)}.credit-confirmation-modal-insufficient p{margin:0 0 var(--spacing-md);color:#991b1b;font-size:var(--font-size-sm)}.credit-confirmation-modal-buy-link{display:inline-flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg);background:linear-gradient(135deg,#dc2626,#b91c1c);color:#fff;font-size:var(--font-size-sm);font-weight:500;border-radius:var(--radius-md);text-decoration:none;transition:transform .2s,box-shadow .2s}.credit-confirmation-modal-buy-link:hover{transform:translateY(-1px);box-shadow:0 4px 12px #dc26264d}.credit-confirmation-modal-actions{display:flex;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.credit-confirmation-modal-cancel{flex:1;padding:var(--spacing-sm) var(--spacing-md);background:var(--color-surface);color:var(--color-text-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;cursor:pointer;transition:background-color .2s,border-color .2s}.credit-confirmation-modal-cancel:hover:not(:disabled){background:var(--color-surface-hover);border-color:var(--color-border-hover)}.credit-confirmation-modal-cancel:disabled{opacity:.5;cursor:not-allowed}.credit-confirmation-modal-confirm{flex:2;display:flex;align-items:center;justify-content:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;border-radius:var(--radius-md);font-size:var(--font-size-sm);font-weight:500;cursor:pointer;transition:transform .2s,box-shadow .2s}.credit-confirmation-modal-confirm:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #10b9814d}.credit-confirmation-modal-confirm:disabled{opacity:.7;cursor:not-allowed;transform:none}.credit-confirmation-modal-confirm svg{width:16px;height:16px}.credit-confirmation-modal-confirm .loading-indicator{display:flex;align-items:center;gap:var(--spacing-xs)}.credit-confirmation-modal-confirm .spinner{width:16px;height:16px;animation:spin 1s linear infinite}.credit-confirmation-modal-confirm .spinner-track{opacity:.25;fill:none}.credit-confirmation-modal-confirm .spinner-fill{opacity:.75}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 480px){.credit-confirmation-modal{padding:var(--spacing-lg);margin:var(--spacing-sm)}.credit-confirmation-modal-actions{flex-direction:column}.credit-confirmation-modal-cancel,.credit-confirmation-modal-confirm{flex:none;width:100%}}