:root{font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5;font-weight:400;color:#1a1a2e;background-color:#f5f7fa;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{margin:0;padding:0;box-sizing:border-box}body{min-height:100vh;display:flex;flex-direction:column;align-items:center}#root{width:100%;min-height:100vh;display:flex;flex-direction:column}.app{display:flex;flex-direction:column;min-height:100vh}.header{background:#fff;border-bottom:1px solid #e2e8f0;padding:1rem 2rem;display:flex;align-items:center;justify-content:space-between;box-shadow:0 1px 3px #0000000d}.header-brand{display:flex;align-items:center;gap:.75rem}.header-logo{width:36px;height:36px;background:linear-gradient(135deg,#4f46e5,#7c3aed);border-radius:8px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:1.1rem}.header-title{font-size:1.25rem;font-weight:700;color:#1a1a2e}.header-subtitle{font-size:.8rem;color:#64748b;font-weight:400}.main{flex:1;display:flex;flex-direction:column;align-items:center;padding:2rem 1rem;gap:1.5rem}.page-title{text-align:center}.page-title h1{font-size:1.75rem;font-weight:700;color:#1a1a2e;margin-bottom:.25rem}.page-title p{color:#64748b;font-size:.95rem}.widget-container{width:100%;max-width:480px;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 1px 3px #00000014;border:1px solid #e2e8f0}.widget-container iframe{display:block;width:100%;height:600px;border:none}.payment-status{width:100%;max-width:480px;padding:1rem 1.25rem;border-radius:12px;display:flex;align-items:center;gap:.75rem;animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.payment-status.success{background:#f0fdf4;border:1px solid #bbf7d0;color:#166534}.payment-status.failed{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}.payment-status.cancelled{background:#fffbeb;border:1px solid #fde68a;color:#92400e}.status-icon{font-size:1.25rem;flex-shrink:0}.status-message{flex:1}.status-message strong{display:block;font-size:.9rem}.status-message span{font-size:.8rem;opacity:.8}.status-dismiss{background:none;border:none;font-size:1.1rem;cursor:pointer;opacity:.5;padding:.25rem;color:inherit}.status-dismiss:hover{opacity:1}.footer{text-align:center;padding:1.5rem;color:#94a3b8;font-size:.8rem;border-top:1px solid #e2e8f0}@media(max-width:520px){.header{padding:.75rem 1rem}.main{padding:1rem .75rem}}