*{box-sizing:border-box}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5;margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.app-container{flex-direction:column;height:100vh;display:flex;overflow:hidden}.top-bar{background-color:#fff;border-bottom:1px solid #e0e0e0;flex-shrink:0;justify-content:space-between;align-items:center;padding:1rem 1rem 1rem 1.5rem;display:flex}.top-bar h1{color:#333;margin:0;font-size:1.5rem}.top-bar-buttons{gap:.75rem;display:flex}.send-button{color:#fff;cursor:pointer;background-color:#007bff;border:none;border-radius:4px;align-items:center;gap:.5rem;padding:.5rem 1.5rem;font-size:1rem;font-weight:600;transition:background-color .2s;display:flex}.send-button:hover:not(:disabled){background-color:#0056b3}.send-button:disabled{cursor:not-allowed;background-color:#6c757d}.play-icon{font-size:.875rem}.main-layout{flex:1;display:flex;overflow:hidden}.left-sidebar{background-color:#fff;border-right:1px solid #e0e0e0;width:350px;padding:1.5rem;overflow-y:auto}.sidebar-section{margin-bottom:1rem}.sidebar-section h3{color:#333;margin:0 0 1rem;font-size:1.125rem}.integration-select{background-color:#fff;border:1px solid #ddd;border-radius:4px;width:100%;padding:.5rem;font-size:1rem}.integration-info-compact{text-align:left;background-color:#f8f9fa;border:1px solid #e0e0e0;border-radius:8px;flex-direction:row;align-items:center;gap:.75rem;margin-top:1rem;margin-bottom:1rem;padding:.5rem;display:flex}.integration-info-compact img{object-fit:contain;border:1px solid #e0e0e0;border-radius:4px;width:48px;height:48px}.integration-info-compact p{color:#666;margin:0;font-size:.875rem}.fields{flex-direction:column;gap:1rem;display:flex}.field{flex-direction:column;display:flex}.field label{color:#555;margin-bottom:.25rem;font-size:.875rem;font-weight:600}.field-description{color:#666;margin:0 0 .5rem;font-size:.75rem}.field input,.field select{border:1px solid #ddd;border-radius:4px;padding:.5rem;font-size:.875rem}.field input:focus,.field select:focus{border-color:#007bff;outline:none}.required{color:#dc3545}.validate-button{color:#fff;cursor:pointer;background-color:#6c757d;border:none;border-radius:4px;align-items:center;gap:.5rem;padding:.5rem 1.5rem;font-size:1rem;font-weight:600;transition:background-color .2s;display:flex}.validate-button:hover:not(:disabled){background-color:#5a6268}.validate-button:disabled{cursor:not-allowed;background-color:#adb5bd}.transform-button{color:#fff;cursor:pointer;background-color:#17a2b8;border:none;border-radius:4px;align-items:center;gap:.5rem;padding:.5rem 1.5rem;font-size:1rem;font-weight:600;transition:background-color .2s;display:flex}.transform-button:hover:not(:disabled){background-color:#138496}.transform-button:disabled{cursor:not-allowed;background-color:#7cc6d6}.event-filters{flex-direction:column;gap:.75rem;display:flex}.filter-field{flex-direction:column;display:flex}.filter-field label{color:#555;margin-bottom:.25rem;font-size:.875rem;font-weight:600}.filter-field select{border:1px solid #ddd;border-radius:4px;padding:.375rem .5rem;font-size:.875rem}.events-column{background-color:#f8f9fa;border-right:1px solid #e0e0e0;flex-direction:column;width:300px;display:flex;overflow:hidden}.events-header{background-color:#fff;border-bottom:1px solid #e0e0e0}.events-header h3{color:#333;margin:0;padding:1rem 1.5rem .5rem;font-size:1.125rem}.event-filters{padding:0 1.5rem 1rem}.filter-row{flex-direction:column;gap:.5rem;display:flex}.filter-select{background-color:#fff;border:1px solid #ddd;border-radius:4px;width:100%;padding:.375rem .5rem;font-size:.8125rem}.filter-select:focus{border-color:#007bff;outline:none}.events-list{background-color:#fff;flex:1;padding:1rem;overflow-y:auto}.events-list::-webkit-scrollbar{display:none}.no-events{text-align:center;color:#999;padding:2rem 1rem}.event-button-wrapper{margin-bottom:.5rem;position:relative}.event-button-wrapper:last-child{margin-bottom:0}.event-button{text-align:left;cursor:pointer;background:#fff;border:1px solid #dee2e6;border-radius:4px;flex-direction:column;justify-content:space-between;align-items:stretch;gap:.5rem;width:100%;padding:.75rem;transition:all .2s;display:flex}.event-button:hover{background-color:#e9ecef70;border-color:#adb5bd}.event-quick-send{color:#007bff;cursor:pointer;opacity:0;z-index:10;background:0 0;border:none;padding:.25rem .5rem;font-size:.75rem;font-weight:700;position:absolute;bottom:8px;right:8px}.event-button-wrapper:hover .event-quick-send{opacity:1}.event-quick-send:hover{color:#0056b3;text-decoration:underline}.event-quick-send:disabled{color:#6c757d;cursor:not-allowed}.event-header-row{justify-content:space-between;align-items:center;font-size:.875rem;display:flex}.event-name{color:#495057;font-weight:600}.event-id{color:#999;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.75rem}.event-details{gap:.25rem;font-size:.75rem;display:flex}.event-store{color:#000;background-color:#007bff40;border-radius:3px;padding:.125rem .375rem}.event-refund{color:#000;background-color:#dc354540;border-radius:3px;padding:.125rem .375rem}.right-section{flex-direction:column;flex:1;display:flex;overflow:hidden}.payload-section{background-color:#fff;border-bottom:1px solid #e0e0e0;flex-direction:column;flex:2;display:flex}.payload-section h3{color:#333;border-bottom:1px solid #e0e0e0;margin:0;padding:1rem 1.5rem;font-size:1.125rem}.payload-editor{resize:none;background-color:#f8f9fa;border:none;flex:1;padding:1rem 1.5rem;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.875rem;line-height:1.5}.payload-editor:focus{background-color:#fff;outline:none}.response-section{background-color:#fff;flex-direction:column;flex:1;display:flex}.response-section h3{color:#333;border-bottom:1px solid #e0e0e0;margin:0;padding:1rem 1.5rem;font-size:1.125rem}.response-header{align-items:center;gap:1rem;display:flex}.response-content{background-color:#f8f9fa;flex:1;max-height:40vh;padding:1.5rem;overflow-y:auto}.response-content pre{white-space:pre-wrap;word-wrap:break-word;margin:0;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.875rem;line-height:1.5}.no-response{color:#999;text-align:center}.error{color:#c00;background-color:#fee;border:1px solid #fcc;border-radius:4px;padding:.25rem .5rem;font-size:.875rem}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#a8a8a8}html,body,#root{height:100%;margin:0;padding:0;overflow:hidden}