:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#213547;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}#root{width:100%;min-height:100vh}:root{--bg-primary: #0a0a0a;--bg-secondary: #121212;--text-primary: #ffffff;--text-secondary: #a0a0a0;--accent-color: #3b82f6;--glass-border: rgba(255, 255, 255, .1);--glass-bg: rgba(255, 255, 255, .03)}.app{min-height:100vh;background:var(--bg-primary);color:var(--text-primary);padding:2rem;display:flex;justify-content:center;align-items:flex-start;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}.generator-container{width:100%;max-width:1400px;background:transparent;box-shadow:none;padding:0}.split-layout{display:flex;gap:2rem;align-items:flex-start}.form-section{flex:0 0 350px;background:var(--bg-secondary);padding:2rem;border-radius:20px;border:1px solid var(--glass-border);box-shadow:0 20px 40px #0006;position:sticky;top:2rem}.grid-section{flex:1}.generator-header{text-align:left;margin-bottom:2rem}.generator-header h1{font-size:1.75rem;font-weight:700;color:var(--text-primary);margin:0 0 .5rem;line-height:1.2}.generator-header p{color:var(--text-secondary);font-size:.95rem;margin:0}.generator-form{display:flex;flex-direction:column;gap:1.5rem}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-group label{font-weight:600;color:var(--text-secondary);font-size:.9rem}.form-input{padding:.75rem 1rem;border:1px solid var(--glass-border);border-radius:10px;font-size:1rem;transition:all .2s ease;font-family:inherit;background:var(--glass-bg);color:var(--text-primary)}.form-input:focus{outline:none;border-color:var(--accent-color);background:#ffffff0d;box-shadow:0 0 0 2px #3b82f633}.generate-button{width:100%;padding:.875rem 1.5rem;background:var(--text-primary);color:var(--bg-primary);border:none;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s ease;margin-top:1rem}.generate-button:hover:not(:disabled){opacity:.9;transform:translateY(-1px);box-shadow:0 4px 12px #ffffff1a}.generate-button:disabled{opacity:.5;cursor:not-allowed}.grid-container{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem}.grid-item-wrapper{position:relative;background:var(--glass-bg);border-radius:20px;border:1px solid var(--glass-border);transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;justify-content:center;align-items:center;zoom:.7;padding:1rem;overflow:hidden}.grid-item-wrapper:hover{transform:translateY(-4px);border-color:#fff3;background:#ffffff0d;box-shadow:0 20px 40px #0003}.grid-item-content{width:100%;display:flex;justify-content:center;pointer-events:none}.grid-overlay{position:absolute;inset:0;background:#0006;display:flex;justify-content:center;align-items:center;gap:1rem;opacity:0;transition:all .3s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:20px;z-index:10}.grid-item-wrapper:hover .grid-overlay{opacity:1}.action-button{padding:.75rem 1.25rem;border:none;border-radius:8px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;min-width:100px;transform:translateY(10px);opacity:0}.grid-item-wrapper:hover .action-button{transform:translateY(0);opacity:1}.grid-item-wrapper:hover .action-button:nth-child(2){transition-delay:.05s}.download-btn{background:var(--text-primary);color:var(--bg-primary)}.download-btn:hover{background:#f0f0f0;transform:translateY(-2px)}.copy-btn{background:#ffffff1a;color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.2)}.copy-btn:hover{background:#fff3;transform:translateY(-2px)}.toast-notification{position:fixed;bottom:2rem;right:2rem;background:var(--bg-secondary);border:1px solid var(--glass-border);border-radius:12px;padding:1rem 1.5rem;box-shadow:0 10px 30px #00000080;animation:slideIn .3s cubic-bezier(.4,0,.2,1);z-index:100;color:var(--text-primary)}.toast-content{display:flex;align-items:center;gap:.75rem}.toast-icon{font-size:1.25rem}.toast-message{font-size:.95rem;font-weight:500}@keyframes slideIn{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.grid-item-content .email-notification{transform-origin:center;width:auto;min-width:600px}.grid-item-content .email-notification.email-mobile{min-width:375px}@media(max-width:1024px){.split-layout{flex-direction:column}.form-section{flex:none;width:100%;position:static}.grid-container{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}@media(max-width:768px){.app{padding:1rem}.form-section{padding:1.25rem;margin-bottom:1rem}.generator-header{margin-bottom:1.5rem}.generator-header h1{font-size:1.2rem}.grid-container{grid-template-columns:repeat(2,1fr);gap:.5rem}.grid-item-wrapper{zoom:.35;padding:.5rem;border-radius:10px}}@media(max-width:480px){.grid-item-wrapper{zoom:.28}}.payment-notification{background:#000;border-radius:28px;padding:18px 24px;min-width:360px;max-width:400px;display:flex;align-items:center;gap:16px;box-shadow:0 4px 24px #00000080;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:#fff}.payment-notification.notification-dark-blue{background:#141d26}.notification-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;font-size:28px;flex-shrink:0}.notification-content{flex:1;display:flex;flex-direction:column;gap:2px}.notification-header{display:flex;justify-content:space-between;align-items:center}.app-name{font-size:17px;font-weight:600;color:#fff}.notification-body{font-size:15px;color:#e5e5e5;line-height:1.3}.email-notification{background:#fff;width:100%;max-width:800px;font-family:Roboto,Arial,sans-serif;color:#202124;padding:20px;box-shadow:0 2px 8px #0000000d}.email-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:20px}.email-subject-line{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.email-subject-line h1{font-size:22px;font-weight:400;margin:0;color:#202124}.inbox-badge{background:#ddd;color:#444;font-size:12px;padding:1px 6px;border-radius:4px;font-weight:500}.x-badge{background:#ddd;color:#666;font-size:12px;padding:1px 6px;border-radius:4px;font-weight:500;display:none}.email-meta-icons{display:flex;gap:16px}.email-sender-row{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:32px}.sender-profile{display:flex;gap:12px;align-items:center}.sender-avatar-img{width:40px;height:40px;border-radius:50%;overflow:hidden;background:#f5f8fa}.sender-avatar-img svg{width:100%;height:100%}.sender-info{display:flex;flex-direction:column;line-height:1.4}.sender-name{font-size:14px;font-weight:700;color:#202124}.sender-email,.email-to{font-size:12px;color:#5f6368}.email-date{font-size:12px;color:#5f6368;display:flex;flex-direction:column;align-items:flex-end;gap:4px}.action-icons{display:flex;gap:12px;font-size:18px;color:#5f6368}.email-body-content{padding-left:52px}.x-logo-container{margin-bottom:24px}.x-logo-box{width:48px;height:48px;background:#000;display:flex;align-items:center;justify-content:center}.x-logo-svg{width:28px;height:28px;fill:#fff}.greeting,.amount-text,.thank-you,.signature{font-size:14px;line-height:1.5;margin:0 0 16px;color:#222}.amount-text{white-space:pre-wrap}.signature{font-weight:700;margin-top:24px}.email-mobile{max-width:400px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}.email-mobile .email-header{border-bottom:none;margin-bottom:12px}.email-mobile .email-subject-line h1{font-size:18px;font-weight:600}.email-mobile .email-sender-row{flex-direction:column;gap:8px;margin-bottom:24px}.email-mobile .sender-profile{width:100%}.email-mobile .email-date{align-items:flex-start;padding-left:52px;flex-direction:row;justify-content:space-between;width:100%}.email-mobile .email-body-content{padding-left:0}.email-mobile .x-logo-container{display:flex;justify-content:center}@media(max-width:600px){.email-body-content{padding-left:0}}.sender-avatar-placeholder{width:40px;height:40px;border-radius:50%;background:#a970ff;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:16px;flex-shrink:0}