:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}body{background:#f6f8fa;font-family:Segoe UI,Arial,sans-serif;margin:0;padding:0;line-height:1.5;-webkit-text-size-adjust:100%}*{box-sizing:border-box}.preview-section{margin-top:32px;background:#f5f7fa;border-radius:8px;box-shadow:0 2px 8px #00000014;padding:16px;color:#222}@media (min-width: 768px){.preview-section{padding:24px}}.preview-section h3{margin-top:0;color:#2563eb;font-size:1.2rem;font-weight:700}.preview-box{background:#fff;border-radius:8px;padding:18px;box-shadow:0 1px 4px #0000000f;margin-top:12px;font-size:1rem}.preview-table{width:100%;border-collapse:collapse;margin:16px 0}.preview-table th,.preview-table td{border:1px solid #e2e8f0;padding:8px 12px;text-align:left}.preview-table th{background:#f1f5f9;font-weight:600;color:#374151}.preview-logo-section{display:flex;justify-content:center;align-items:center;margin-bottom:16px;padding:12px;background:#f8fafc;border-radius:8px;border:2px dashed #d1d5db;min-height:120px;transition:all .2s}.preview-logo{max-width:150px;max-height:100px;width:auto;height:auto;object-fit:contain;border-radius:6px;box-shadow:0 2px 8px #0000001a;transition:all .2s}.preview-logo:hover{transform:scale(1.05);box-shadow:0 4px 16px #00000026}.preview-logo-placeholder{color:#9ca3af;font-size:14px;font-weight:500;text-align:center;padding:20px;display:flex;flex-direction:column;align-items:center;gap:8px}.preview-logo-placeholder:before{content:"📷";font-size:32px;opacity:.5}@media (max-width: 640px){.preview-logo-section{min-height:100px;padding:8px}.preview-logo{max-width:120px;max-height:80px}.preview-logo-placeholder{padding:16px;font-size:13px}.preview-logo-placeholder:before{font-size:24px}}.preview-table td{background:#f8fafc}.form-input{display:block;width:100%;margin:12px 0;padding:14px 16px;border:1px solid #d0d7de;border-radius:8px;font-size:16px;background:#fff;color:#222;transition:border .2s;box-sizing:border-box;min-height:44px}.form-input:focus{outline:none;border-color:#4f8cff;box-shadow:0 0 0 3px #4f8cff1a}.form-input[type=file]{background:#eaf1fb;border-radius:6px;padding:8px 12px;color:#222;border:1px solid #d0d7de;font-size:1rem;margin-bottom:8px}.form-input:focus{border-color:#4f8cff;outline:none}.form-input.small{width:100%;display:block;margin:0 0 12px}@media (min-width: 768px){.form-input.small{width:120px;display:inline-block;margin:0 8px 0 0}}.number-generator{display:flex;gap:8px;align-items:center;margin:12px 0}.number-generator .form-input{margin:0;flex:1}.number-generator .add-btn{margin:0;min-width:44px;padding:0 12px;font-size:14px}.logo-upload-section{margin:16px 0}.logo-upload-label{display:block;font-size:14px;font-weight:600;color:#374151;margin-bottom:8px}.logo-upload-container{border:2px dashed #d1d5db;border-radius:12px;overflow:hidden}.logo-upload-area{padding:32px 16px;text-align:center;background:#f9fafb;cursor:pointer;transition:all .2s ease;min-height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center}.logo-upload-area:hover{background:#f3f4f6;border-color:#4f8cff}.logo-upload-icon{font-size:2.5rem;margin-bottom:12px;opacity:.6}.logo-upload-text strong{color:#374151;font-size:16px;display:block;margin-bottom:4px}.logo-upload-text p{color:#6b7280;font-size:14px;margin:0}.logo-preview{position:relative;background:#fff;padding:16px}.logo-preview-image{max-width:100%;max-height:120px;width:auto;height:auto;display:block;margin:0 auto 12px;border-radius:8px;box-shadow:0 2px 8px #0000001a}.logo-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}.change-logo-btn,.remove-logo-btn{padding:8px 16px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;min-height:40px}.change-logo-btn{background:#4f8cff;color:#fff}.change-logo-btn:hover{background:#3b7bfd}.remove-logo-btn{background:#ef4444;color:#fff}.remove-logo-btn:hover{background:#dc2626}@media (max-width: 768px){.logo-upload-area{padding:24px 16px;min-height:100px}.logo-upload-icon{font-size:2rem;margin-bottom:8px}.logo-actions{flex-direction:column}.change-logo-btn,.remove-logo-btn{width:100%;justify-content:center}}.items-section{margin:18px 0;background:#f5f7fa;padding:16px;border-radius:8px;color:#222;box-shadow:0 2px 8px #0000000f}.add-btn,.remove-btn,.submit-btn,.export-btn{background:#4f8cff;color:#fff;border:none;border-radius:6px;padding:8px 18px;font-size:1rem;font-weight:600;cursor:pointer;margin-top:8px;margin-right:8px;transition:background .2s,color .2s}.add-btn:hover,.remove-btn:hover,.submit-btn:hover,.export-btn:hover{background:#2563eb}.add-btn:focus,.remove-btn:focus,.submit-btn:focus,.export-btn:focus{outline:2px solid #2563eb;outline-offset:2px;background:#2563eb}.export-btn{background:#059669;font-size:1.1rem;padding:12px 24px}.export-btn:hover{background:#047857}.export-btn:focus{outline:2px solid #047857;background:#047857}.export-btn:disabled{background:#9ca3af;cursor:not-allowed}.submit-btn{width:100%;margin-top:18px}.container{max-width:1200px;margin:0 auto;padding:0 16px;min-height:100vh}.nav{display:flex;justify-content:center;align-items:center;gap:12px;margin-bottom:24px;flex-wrap:wrap}.nav-btn{background:#fff;color:#4f8cff;border:2px solid #eaf1fb;padding:12px 20px;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;box-shadow:0 2px 8px #4f8cff14;transition:all .2s ease;min-height:44px;flex:1;max-width:200px}.nav-btn:hover,.nav-btn.active{background:#4f8cff;color:#fff;transform:translateY(-1px)}.main-content{max-width:100%;margin:0 auto;padding:0}.form-section{background:#fff;border-radius:12px;padding:20px;margin-bottom:20px;box-shadow:0 2px 12px #0000000f}@media (min-width: 768px){.container{padding:0 24px}.nav{gap:16px;margin-bottom:32px}.nav-btn{flex:none;padding:12px 24px}.main-content{max-width:800px}.form-section{padding:32px;margin-bottom:32px}}@media (min-width: 1024px){.container{padding:0 32px}.main-content{max-width:900px}}.form-input{display:block;width:100%;margin:12px 0;padding:14px 16px;border:1px solid #d0d7de;border-radius:8px;font-size:16px;background:#fff;color:#222;box-sizing:border-box;min-height:44px}.add-btn,.remove-btn,.submit-btn,.export-btn{min-height:44px;padding:12px 20px;font-size:16px;border-radius:8px;cursor:pointer;transition:all .2s ease;border:none;font-weight:600;display:inline-flex;align-items:center;justify-content:center;text-align:center}.export-btn{background:#059669;color:#fff;width:100%;margin:16px 0}@media (min-width: 768px){.export-btn{width:auto;min-width:180px}}.nav-btn.active{background:#4f8cff;color:#fff;border:2px solid #4f8cff}.nav-btn:hover{background:#4f8cff;color:#fff;transform:translateY(-1px)}.nav-btn{background:#fff;color:#4f8cff;border:none;padding:10px 24px;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;box-shadow:0 2px 8px #4f8cff14;transition:background .2s,color .2s}.nav-btn:hover{background:#4f8cff;color:#fff}.main-content{padding:32px 24px}.form-section{background:#f0f4fa;border-radius:8px;padding:24px;box-shadow:0 2px 8px #0000000a;text-align:center}.form-section h2{margin-top:0;color:#4f8cff}.footer{background:#eaf1fb;color:#4f8cff;text-align:center;padding:16px;font-size:.95rem}.header{background:linear-gradient(90deg,#eaf1fb,#4f8cff);color:#2563eb;padding:20px 16px 16px;text-align:center;border-radius:0 0 16px 16px;box-shadow:0 4px 24px #4f8cff14;display:flex;align-items:center;justify-content:space-between;position:relative}.header h1{margin:0 0 8px;font-size:1.8rem;font-weight:800;letter-spacing:.5px;font-family:Segoe UI,Arial,sans-serif;text-align:center;background:linear-gradient(90deg,#4f8cff,#2563eb);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.2;flex:1}.logout-header-btn{background:#2563eb1a;border:1px solid rgba(37,99,235,.2);color:#2563eb;padding:8px 16px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;margin-bottom:8px}.logout-header-btn:hover{background:#2563eb26;border-color:#2563eb4d;transform:translateY(-1px);box-shadow:0 2px 8px #2563eb26}@media (min-width: 768px){.header{padding:32px 24px 20px;border-radius:0 0 20px 20px}.header h1{font-size:2.2rem}.logout-header-btn{font-size:15px;padding:10px 20px}}@media (min-width: 1024px){.header{padding:40px 24px 24px;border-radius:0 0 24px 24px}.header h1{font-size:2.6rem;margin:0 0 12px;letter-spacing:1px}}.item-row{display:flex;gap:12px;align-items:flex-end;margin-bottom:16px;padding:12px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0;flex-direction:column}@media (max-width: 767px){.item-row{flex-direction:column;align-items:stretch}.item-row .form-group{display:flex;flex-direction:column}.item-row .remove-btn{align-self:flex-start;margin-top:8px}}.item-row .form-input{margin:0}.item-row .form-group{display:flex;flex-direction:column}.item-row .form-group label{font-size:14px;font-weight:600;color:#374151;margin-bottom:4px}.item-row .remove-btn{align-self:flex-start;background:#dc2626;color:#fff;padding:8px 16px;font-size:14px;min-height:40px}@media (min-width: 768px){.item-row{flex-direction:row;align-items:flex-end;padding:12px;gap:16px}.item-row .form-group{display:flex;flex-direction:column;flex:none}.item-row .form-group:first-child{flex:2;min-width:200px}.item-row .form-group:nth-child(2),.item-row .form-group:nth-child(3){flex:none;min-width:100px}.item-row .form-group label{height:24px;margin-bottom:4px;display:flex;align-items:center}.item-row .form-input{margin:0;height:48px;box-sizing:border-box}.item-row .remove-btn{flex:none;width:auto;margin-top:0;height:48px;align-self:flex-end}}.status-message{padding:12px 16px;margin:16px 0;border-radius:8px;font-size:14px;text-align:center;word-break:break-word}.auth-container{max-width:720px;margin:24px auto;padding:0 16px;color:#111}.auth-form{background:#fff;padding:28px;border-radius:10px;box-shadow:0 6px 20px #1018280f;text-align:left;color:#111}.auth-form h2{margin:0 0 12px;color:#0f172a;font-size:1.25rem;font-weight:700}.auth-form .form-input{background:#fff;color:#0b1220;border:1px solid #dbe7fb}.form-input::placeholder{color:#9aa4b2;opacity:1}.auth-form .submit-btn{background:#2563eb;color:#fff;border-radius:8px}.auth-form .add-btn{background:#e6f0ff;color:#2563eb;border-radius:8px}.auth-container{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.auth-overlay{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.auth-modal{background:#fff;border-radius:12px;box-shadow:0 25px 50px -12px #00000040;max-width:480px;width:100%;max-height:90vh;overflow-y:auto;padding:0;position:relative;animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.auth-header{padding:24px 24px 16px;border-bottom:1px solid #e5e7eb;display:flex;align-items:center;justify-content:space-between}.auth-header h2{margin:0;font-size:24px;font-weight:600;color:#111827}.close-btn{background:none;border:none;font-size:24px;color:#9ca3af;cursor:pointer;padding:4px;border-radius:4px;transition:all .2s}.close-btn:hover{background:#f3f4f6;color:#374151}.signup-options{padding:16px 24px}.signup-label{font-size:15px;color:#374151;margin:0 0 12px;font-weight:600}.option-buttons{display:flex;border:2px solid #2563eb;border-radius:8px;overflow:hidden;box-shadow:0 2px 4px #2563eb1a}.option-btn{flex:1;padding:14px 20px;background:#fff;border:none;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;border-right:2px solid #2563eb;color:#374151}.option-btn:last-child{border-right:none}.option-btn.active{background:#2563eb;color:#fff;box-shadow:inset 0 2px 4px #0000001a}.option-btn:not(.active):hover{background:#f8fafc;color:#2563eb}.service-options{padding:0 24px 16px}.service-label{font-size:15px;color:#374151;margin:0 0 12px;font-weight:600}.service-buttons{display:flex;gap:10px;flex-wrap:wrap}.service-btn{flex:1;min-width:120px;padding:12px 16px;background:#fff;border:2px solid #2563eb;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;color:#374151}.service-btn.active{background:#2563eb;color:#fff;border-color:#2563eb;box-shadow:0 2px 8px #2563eb40}.service-btn:not(.active):hover{background:#f8fafc;border-color:#1d4ed8;color:#2563eb;transform:translateY(-1px)}.form-group{padding:0 24px 16px}.form-group.half{flex:1}.name-row,.password-row{display:flex;gap:16px;padding:0 24px}.single-password{padding:0 24px 16px}.password-group{flex:1;padding:0 0 16px}.form-group label{display:block;font-size:15px;font-weight:600;color:#374151;margin-bottom:8px}.required{color:#ef4444}.form-input{width:100%;padding:14px 16px;border:2px solid #d1d5db;border-radius:8px;font-size:15px;font-weight:500;transition:all .2s;background:#fff;color:#374151}.form-input:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a}.form-input::placeholder{color:#9ca3af;font-weight:400}.form-select{width:100%;padding:14px 40px 14px 16px;border:2px solid #d1d5db;border-radius:8px;font-size:15px;font-weight:500;background:#fff;cursor:pointer;transition:all .2s;color:#374151;appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px}.form-select:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a}.form-select option{padding:12px;font-size:15px;color:#374151;background:#fff}.password-input-container{position:relative}.password-input{padding-right:45px}.password-toggle{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;font-size:16px;padding:4px;border-radius:4px;transition:all .2s}.password-toggle:hover{background:#f3f4f6}.checkbox-group{padding:0 24px 16px;display:flex;align-items:flex-start;gap:8px}.checkbox-group input[type=checkbox]{margin-top:2px;cursor:pointer}.checkbox-group label{font-size:13px;color:#6b7280;cursor:pointer;line-height:1.4}.error-message{margin:0 24px 16px;padding:12px;background:#fef2f2;border:1px solid #fecaca;border-radius:6px;color:#dc2626;font-size:14px}.auth-submit-btn{width:calc(100% - 48px);margin:0 24px 16px;padding:14px;background:#2563eb;border:none;border-radius:6px;color:#fff;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s}.auth-submit-btn:hover{background:#1d4ed8;transform:translateY(-1px);box-shadow:0 4px 12px #2563eb40}.auth-submit-btn:active{transform:translateY(0)}.terms-text{padding:0 24px 16px;font-size:12px;color:#6b7280;text-align:center;line-height:1.4}.terms-link{color:#2563eb;text-decoration:none}.terms-link:hover{text-decoration:underline}.switch-mode{padding:16px 24px 24px;text-align:center;border-top:1px solid #e5e7eb}.switch-mode p{margin:0;font-size:14px;color:#6b7280}.switch-btn{background:none;border:none;color:#2563eb;cursor:pointer;font-weight:600;text-decoration:none;font-size:14px}.switch-btn:hover{text-decoration:underline}.welcome-container{background:#fff;border-radius:12px;padding:32px;text-align:center;box-shadow:0 25px 50px -12px #00000040;max-width:400px;width:100%}.welcome-container h2{margin:0 0 16px;color:#111827;font-size:24px;font-weight:600}.welcome-container p{margin:0 0 24px;color:#6b7280;font-size:16px}.logout-btn{padding:12px 24px;background:#ef4444;border:none;border-radius:6px;color:#fff;font-weight:600;cursor:pointer;transition:all .2s}.logout-btn:hover{background:#dc2626;transform:translateY(-1px);box-shadow:0 4px 12px #ef444440}@media (max-width: 640px){.auth-modal{margin:0;border-radius:0;max-height:100vh;height:100vh}.service-buttons{flex-direction:column}.service-btn{min-width:auto}.name-row,.password-row{flex-direction:column;gap:0}.password-group{padding-bottom:16px}}.client-templates-section{margin:20px 0;padding:16px;background:#f8fafc;border-radius:12px;border:1px solid #e2e8f0}.templates-buttons{display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap}.template-btn{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;border-radius:8px;padding:10px 16px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:6px}.template-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #3b82f640}.template-btn.save-btn{background:linear-gradient(135deg,#10b981,#059669)}.template-btn.save-btn:hover{box-shadow:0 4px 12px #10b98140}.save-template-form{background:#fff;padding:16px;border-radius:8px;border:1px solid #d1d5db;margin-bottom:16px}.template-name-input{margin-bottom:12px}.template-form-buttons{display:flex;gap:8px;flex-wrap:wrap}.save-template-btn{background:#10b981;color:#fff;border:none;border-radius:6px;padding:8px 14px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.save-template-btn:hover{background:#059669;transform:translateY(-1px)}.cancel-template-btn{background:#6b7280;color:#fff;border:none;border-radius:6px;padding:8px 14px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.cancel-template-btn:hover{background:#4b5563;transform:translateY(-1px)}.templates-list{background:#fff;border-radius:8px;border:1px solid #d1d5db;overflow:hidden}.templates-header{display:flex;justify-content:space-between;align-items:center;padding:16px;background:#f9fafb;border-bottom:1px solid #e5e7eb}.templates-header h4{margin:0;color:#374151;font-size:16px;font-weight:600}.close-templates-btn{background:none;border:none;color:#6b7280;font-size:18px;cursor:pointer;padding:4px;border-radius:4px;transition:all .2s}.close-templates-btn:hover{background:#e5e7eb;color:#374151}.no-templates{padding:24px;text-align:center;color:#6b7280;font-style:italic}.templates-grid{display:grid;gap:1px;background:#e5e7eb}.template-card{background:#fff;padding:16px;display:flex;justify-content:space-between;align-items:flex-start;transition:all .2s}.template-card:hover{background:#f9fafb}.template-info{flex:1;margin-right:16px}.template-info h5{margin:0 0 8px;color:#1f2937;font-size:16px;font-weight:600}.template-client{margin:0 0 4px;color:#374151;font-weight:500;font-size:14px}.template-details{margin:0;color:#6b7280;font-size:13px;line-height:1.4;max-height:40px;overflow:hidden;text-overflow:ellipsis}.template-actions{display:flex;gap:8px;flex-shrink:0}.load-template-btn{background:#3b82f6;color:#fff;border:none;border-radius:6px;padding:6px 12px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s}.load-template-btn:hover{background:#2563eb;transform:translateY(-1px)}.delete-template-btn{background:#ef4444;color:#fff;border:none;border-radius:6px;padding:6px 12px;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s}.delete-template-btn:hover{background:#dc2626;transform:translateY(-1px)}@media (max-width: 640px){.template-card{flex-direction:column;gap:12px}.template-info{margin-right:0}.template-actions{align-self:stretch}.load-template-btn,.delete-template-btn{flex:1}}.form-field{position:relative;margin-bottom:16px}.form-field.has-error input,.form-field.has-error textarea,.form-field.has-error select{border:2px solid #ef4444!important;background-color:#fef2f2;box-shadow:0 0 0 3px #ef44441a}.form-field.has-error input:focus,.form-field.has-error textarea:focus,.form-field.has-error select:focus{border-color:#ef4444;box-shadow:0 0 0 3px #ef444433;outline:none}.error-message{color:#ef4444;font-size:.875rem;margin-top:4px;display:flex;align-items:center;gap:4px;font-weight:500}.error-message:before{content:"⚠";font-size:1rem}.field-label{display:block;margin-bottom:6px;font-weight:600;color:#374151;font-size:.95rem}.field-label.required:after{content:" *";color:#ef4444;font-weight:700}.item-row.has-error{background-color:#fef2f2;border:2px solid #ef4444;border-radius:8px;padding:12px;margin-bottom:12px}.item-row.has-error input{border-color:#ef4444}.validation-summary{background-color:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:16px;margin-bottom:20px;color:#991b1b}.validation-summary h4{margin:0 0 8px;color:#dc2626;font-size:1rem;font-weight:600}.validation-summary ul{margin:0;padding-left:20px}.validation-summary li{margin-bottom:4px;font-size:.9rem}.form-field.is-valid input,.form-field.is-valid textarea,.form-field.is-valid select{border-color:#10b981;background-color:#f0fdf4}.form-field.is-valid input:focus,.form-field.is-valid textarea:focus,.form-field.is-valid select:focus{border-color:#10b981;box-shadow:0 0 0 3px #10b9811a}@media (max-width: 768px){.error-message{font-size:.8rem}.validation-summary{padding:12px;font-size:.9rem}.item-row.has-error{padding:8px}}.form-actions{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap}.draft-btn{background:#6b7280;color:#fff;border:none;padding:12px 20px;border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s;display:flex;align-items:center;gap:8px}.draft-btn:hover{background:#4b5563;transform:translateY(-2px)}.export-btn{background:#7c3aed;color:#fff;border:none;padding:12px 20px;border-radius:8px;cursor:pointer;font-weight:600;transition:all .2s;display:flex;align-items:center;gap:8px}.export-btn:hover{background:#6d28d9;transform:translateY(-2px)}.export-options{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:16px;margin-top:12px}.export-options h4{margin:0 0 12px;color:#374151;font-size:1rem}.export-buttons{display:flex;gap:8px;flex-wrap:wrap}.export-option-btn{background:#f3f4f6;border:1px solid #d1d5db;color:#374151;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;transition:all .2s;display:flex;align-items:center;gap:6px}.export-option-btn:hover{background:#e5e7eb;border-color:#9ca3af;transform:translateY(-1px)}.drafts-section{padding:20px}.empty-state{text-align:center;padding:40px 20px;color:#6b7280;background:#f9fafb;border-radius:8px;border:2px dashed #d1d5db}.drafts-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-top:20px}.draft-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:20px;box-shadow:0 2px 4px #0000000d;transition:all .2s}.draft-card:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.draft-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.draft-header h4{margin:0;color:#111827;font-size:1.1rem;line-height:1.3}.draft-type{padding:4px 8px;border-radius:4px;font-size:.75rem;font-weight:600;text-transform:uppercase}.draft-type.invoice{background:#dbeafe;color:#1d4ed8}.draft-type.receipt{background:#d1fae5;color:#065f46}.draft-details{margin-bottom:16px}.draft-details p{margin:4px 0;font-size:.9rem;color:#6b7280}.draft-actions{display:flex;gap:8px}.load-draft-btn{background:#10b981;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;flex:1;transition:all .2s}.load-draft-btn:hover{background:#059669}.delete-draft-btn{background:#ef4444;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;transition:all .2s}.delete-draft-btn:hover{background:#dc2626}.history-section{padding:20px}.history-filters{margin-bottom:20px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.history-filters label{font-weight:600;color:#374151}.filter-select{padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;background:#fff;color:#374151;font-size:.9rem}.history-list{display:flex;flex-direction:column;gap:12px}.history-item{background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:16px;display:flex;align-items:center;gap:16px;transition:all .2s}.history-item:hover{box-shadow:0 2px 8px #0000001a;border-color:#d1d5db}.history-icon{font-size:2rem;width:60px;height:60px;display:flex;align-items:center;justify-content:center;background:#f3f4f6;border-radius:12px;flex-shrink:0}.history-details{flex:1;min-width:0}.history-details h4{margin:0 0 8px;color:#111827;font-size:1rem;word-break:break-word}.history-details p{margin:2px 0;font-size:.9rem;color:#6b7280}.history-actions{display:flex;gap:8px;flex-shrink:0}.view-btn,.email-btn{background:#f3f4f6;border:1px solid #d1d5db;color:#374151;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:.9rem;transition:all .2s;display:flex;align-items:center;gap:6px}.view-btn:hover,.email-btn:hover{background:#e5e7eb;border-color:#9ca3af}@media (max-width: 768px){.form-actions,.export-buttons{flex-direction:column}.drafts-grid{grid-template-columns:1fr}.history-item{flex-direction:column;align-items:flex-start;gap:12px}.history-icon{align-self:center}.history-actions{align-self:stretch}.view-btn,.email-btn{flex:1;justify-content:center}.history-filters{flex-direction:column;align-items:flex-start}}@media (max-width: 480px){.draft-actions{flex-direction:column}.export-option-btn{justify-content:center}}.draft-checkbox{margin-right:8px;transform:scale(1.1);accent-color:#2563eb}.form-field .field-label input[type=checkbox]{margin-right:8px;margin-top:0;vertical-align:middle}.form-field .field-label{display:flex;align-items:center;font-weight:500;color:#374151;gap:8px}#theme,#receiptTheme{background:linear-gradient(135deg,#f8fafc,#f1f5f9);border:1px solid #cbd5e1;transition:all .2s ease}#theme:focus,#receiptTheme:focus{border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a;background:#fff}.draft-mode-indicator{background:linear-gradient(135deg,#fef3c7,#fde68a);border:1px solid #f59e0b;color:#92400e;padding:8px 12px;border-radius:6px;font-size:.875rem;font-weight:500;margin-top:8px;display:flex;align-items:center;gap:6px}input[type=checkbox]{width:18px;height:18px;accent-color:#2563eb;cursor:pointer}input[type=checkbox]:checked{background-color:#2563eb}.form-field{position:relative}.form-field:has(#theme),.form-field:has(#receiptTheme){background:linear-gradient(135deg,#f8fafc,#fff);padding:16px;border-radius:8px;border:1px solid #e2e8f0;margin-bottom:16px}.form-field:has(.draft-checkbox){background:linear-gradient(135deg,#fefce8,#fff);padding:16px;border-radius:8px;border:1px solid #fbbf24;margin-bottom:16px}.theme-preview{display:inline-block;width:12px;height:12px;border-radius:50%;margin-left:8px;vertical-align:middle}.theme-minimalist .theme-preview{background:linear-gradient(135deg,#000,#555)}.theme-corporate .theme-preview{background:linear-gradient(135deg,#1e40af,#3b82f6)}.theme-creative .theme-preview{background:linear-gradient(135deg,#8b4513,tan)}