:root{--color-primary: #0891b2;--color-primary-hover: #0e7490;--color-secondary: #6b7280;--color-success: #22c55e;--color-danger: #b91c1c;--color-warning: #f59e0b;--color-info: #3b82f6;--color-bg: #f9fafb;--color-surface: #ffffff;--color-border: #e5e7eb;--color-text: #111827;--color-text-muted: #6b7280;--radius: .5rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background-color:var(--color-bg);color:var(--color-text);line-height:1.5;min-height:100vh;padding:var(--spacing-xl) var(--spacing-md)}.container{max-width:1000px;margin:0 auto}.header{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing-xl);margin-bottom:var(--spacing-xl);position:relative}h1{color:var(--color-text);margin-bottom:var(--spacing-sm);font-size:1.75rem;font-weight:700}.subtitle{color:var(--color-text-muted);margin-bottom:var(--spacing-lg);font-size:1rem}.create-btn{background-color:var(--color-primary);color:#fff;border:none;padding:.5rem .75rem;font-size:.875rem;font-weight:600;border-radius:.375rem;cursor:pointer;transition:background-color .2s;display:flex;align-items:center;gap:.375rem;white-space:nowrap}.create-btn span:first-child{font-size:1rem;font-weight:700;line-height:1}.create-btn:hover{background-color:var(--color-primary-hover)}.create-btn:active{transform:translateY(1px)}.create-btn:disabled{opacity:.6;cursor:not-allowed}.sessions-section{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing-xl)}.sessions-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-xl)}.sessions-header h2{color:var(--color-text);font-size:1.5rem}.sessions-list{display:flex;flex-direction:column;gap:var(--spacing-md)}.session-item{border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing-md);transition:all .2s;cursor:pointer;position:relative}.session-item:hover{border-color:var(--color-primary);box-shadow:0 2px 4px #0891b21a}.session-item:focus{outline:2px solid var(--color-primary);outline-offset:2px}.session-item:focus:not(:focus-visible){outline:none}.session-item:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.session-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-sm)}.session-name-section{flex:1;margin-right:var(--spacing-md)}.session-name-display{display:flex;align-items:center;gap:var(--spacing-sm)}.session-name{font-size:1.125rem;font-weight:600;color:var(--color-text);cursor:pointer;padding:.25rem .5rem;border-radius:.25rem;transition:all .2s;display:inline-block}.session-name:hover{background-color:var(--color-bg);outline:1px dashed var(--color-primary)}.session-name-input{font-size:1.125rem;font-weight:600;padding:.25rem .5rem;border:1px solid var(--color-primary);border-radius:.25rem;width:100%;max-width:400px;font-family:inherit}.session-meta{display:flex;gap:var(--spacing-md);flex-wrap:wrap;color:var(--color-text-muted);font-size:.8125rem;margin-bottom:var(--spacing-sm)}.session-url{background-color:var(--color-bg);padding:.5rem .75rem;border-radius:.25rem;font-family:Courier New,monospace;font-size:.8125rem;word-break:break-all;border:1px solid var(--color-border);display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-sm)}.session-url-text{flex:1;min-width:0}.session-url-label{font-weight:600;margin-right:.5rem}.copy-url-btn{background-color:var(--color-primary);color:#fff;border:none;padding:.25rem .5rem;border-radius:.25rem;cursor:pointer;font-size:.75rem;font-weight:600;white-space:nowrap;transition:background-color .2s;flex-shrink:0}.copy-url-btn:hover{background-color:var(--color-primary-hover)}.copy-url-btn.copied{background-color:var(--color-success)}.session-actions{display:flex;gap:var(--spacing-sm);align-items:center}.delete-btn{background-color:var(--color-danger);color:#fff;border:none;padding:.5rem 1rem;border-radius:.375rem;cursor:pointer;font-size:.875rem;font-weight:600;transition:background-color .2s;white-space:nowrap}.delete-btn:hover{background-color:#dc2626}.sessions-section .delete-btn{padding:.375rem .75rem;font-size:.8125rem}.request-count{display:inline-block;background-color:var(--color-primary);color:#fff;padding:.125rem .625rem;border-radius:9999px;font-size:.75rem;font-weight:700}.breadcrumb{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg);font-size:.875rem}.breadcrumb a{color:var(--color-primary);text-decoration:none;font-weight:500}.breadcrumb a:hover{text-decoration:underline}.breadcrumb-separator{color:var(--color-text-muted)}.breadcrumb-current{color:var(--color-text);font-weight:500}.endpoint-name-section{margin-top:var(--spacing-lg);margin-bottom:var(--spacing-md);display:flex;justify-content:space-between;align-items:center;gap:var(--spacing-md)}.endpoint-name-display{display:flex;align-items:center;gap:var(--spacing-sm);flex:1}.endpoint-name{font-size:1.75rem;font-weight:700;color:var(--color-text);margin:0;cursor:pointer;padding:.25rem .5rem;border-radius:.25rem;transition:all .2s;display:inline-block}.endpoint-name:hover{background-color:var(--color-bg);outline:1px dashed var(--color-primary)}.endpoint-name-input{font-size:1.75rem;font-weight:700;padding:.25rem .5rem;border:1px solid var(--color-primary);border-radius:.25rem;flex:1;max-width:500px;font-family:inherit}.webhook-url{background-color:var(--color-bg);border:1px solid var(--color-border);padding:.75rem;border-radius:.25rem;font-family:Courier New,monospace;font-size:.9rem;margin-top:var(--spacing-md);word-break:break-all;display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-md)}.webhook-url-text{flex:1}.copy-btn{background-color:var(--color-primary);color:#fff;border:none;padding:.375rem .75rem;border-radius:.25rem;cursor:pointer;font-size:.8125rem;font-weight:600;white-space:nowrap;transition:background-color .2s;min-height:2rem;display:inline-flex;align-items:center;justify-content:center}.copy-btn:hover{background-color:var(--color-primary-hover)}.copy-btn.copied{background-color:var(--color-success)}.header-actions{display:flex;gap:var(--spacing-md);align-items:center;margin-top:var(--spacing-md)}.stats{display:flex;gap:var(--spacing-md);margin-top:var(--spacing-md)}.stat{padding:.25rem .75rem;background-color:var(--color-bg);color:var(--color-text-muted);border:1px solid var(--color-border);border-radius:9999px;font-size:.8125rem;font-weight:500}.requests-container{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:var(--spacing-xl)}.requests-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-xl)}.requests-header h2{color:var(--color-text);font-size:1.5rem}.refresh-btn{background-color:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);padding:.5rem 1rem;border-radius:.375rem;cursor:pointer;font-size:.875rem;font-weight:600;transition:all .2s}.refresh-btn:hover{background-color:var(--color-bg);border-color:var(--color-secondary)}.request-item{border:1px solid var(--color-border);border-radius:var(--radius);margin-bottom:var(--spacing-md);overflow:hidden}.request-header{background-color:var(--color-surface);padding:var(--spacing-md);display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:background-color .2s}.request-header:hover{background-color:var(--color-bg)}.request-method{display:inline-block;padding:.125rem .5rem;border-radius:.25rem;font-weight:700;font-size:.75rem;margin-right:var(--spacing-sm);text-transform:uppercase}.method-GET{background-color:var(--color-success);color:#fff}.method-POST{background-color:var(--color-info);color:#fff}.method-PUT{background-color:var(--color-warning);color:#000}.method-PATCH{background-color:#0ea5e9;color:#fff}.method-DELETE{background-color:var(--color-danger);color:#fff}.method-OPTIONS,.method-HEAD{background-color:var(--color-secondary);color:#fff}.request-time,.request-size{color:var(--color-text-muted);font-size:.875rem;margin-left:var(--spacing-sm)}.toggle-icon{transition:transform .3s;color:var(--color-text-muted)}.request-item.expanded .toggle-icon{transform:rotate(180deg)}.request-details{padding:0 var(--spacing-md);max-height:0;overflow:hidden;transition:all .3s ease-in-out;background-color:var(--color-bg)}.request-details.expanded{padding:var(--spacing-md);max-height:5000px;border-top:1px solid var(--color-border)}.detail-section{margin-bottom:var(--spacing-lg)}.detail-section h3{color:var(--color-text);font-size:.875rem;font-weight:700;margin-bottom:var(--spacing-md);text-transform:uppercase;letter-spacing:.05em}.section-header-with-actions{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md)}.section-header-with-actions h3{margin-bottom:0}.content-actions{display:flex;gap:var(--spacing-sm)}.action-btn{background-color:var(--color-surface);color:var(--color-text);border:1px solid var(--color-border);padding:.25rem .5rem;border-radius:.25rem;cursor:pointer;font-size:.75rem;font-weight:500;transition:all .2s}.action-btn:hover{background-color:var(--color-bg);border-color:var(--color-primary)}.action-btn.active{background-color:var(--color-primary);color:#fff;border-color:var(--color-primary)}.request-metadata{background-color:var(--color-surface);padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:.25rem}.metadata-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--spacing-md);margin-bottom:var(--spacing-lg)}.metadata-item{display:flex;flex-direction:column;gap:.25rem}.metadata-label{font-size:.75rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.metadata-value{font-size:.875rem;color:var(--color-text);word-break:break-all}.request-id{font-family:Courier New,monospace;cursor:pointer;color:var(--color-primary);text-decoration:underline}.request-id:hover{color:var(--color-primary-hover)}.metadata-subsection{margin-top:var(--spacing-md)}.metadata-subsection h4{font-size:.75rem;font-weight:600;color:var(--color-text-muted);margin-bottom:var(--spacing-sm);text-transform:uppercase;letter-spacing:.05em}.empty-value{color:var(--color-text-muted);font-style:italic}.json-content{margin:0;white-space:pre;word-wrap:normal;overflow-x:auto}.json-content.word-wrap{white-space:pre-wrap;word-wrap:break-word}.detail-content{background-color:var(--color-surface);padding:var(--spacing-md);border:1px solid var(--color-border);border-radius:.25rem;overflow-x:auto}pre{margin:0;white-space:pre-wrap;word-wrap:break-word;font-family:Courier New,monospace;font-size:.8125rem;color:var(--color-text)}.empty-state{text-align:center;padding:var(--spacing-xl) var(--spacing-md);color:var(--color-text-muted)}.empty-state h3{margin-bottom:var(--spacing-sm);color:var(--color-text)}.modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;opacity:0;transition:opacity .2s;pointer-events:none}.modal-overlay.show{opacity:1;pointer-events:all}.modal{background-color:var(--color-surface);border-radius:var(--radius);padding:var(--spacing-xl);max-width:500px;width:90%;box-shadow:0 10px 25px #0003;transform:scale(.95);transition:transform .2s;position:relative}.modal-overlay.show .modal{transform:scale(1)}.modal-header{margin-bottom:var(--spacing-lg);display:flex;align-items:center;gap:var(--spacing-md)}.modal-title{font-size:1.5rem;font-weight:700;color:var(--color-text);margin:0;flex:1}.modal-body{margin-bottom:var(--spacing-lg);color:var(--color-text);line-height:1.6;white-space:pre-line}.modal-icon{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem;flex-shrink:0}.modal-icon.success{background-color:#dcfce7;color:var(--color-success)}.modal-icon.error{background-color:#fee2e2;color:var(--color-danger)}.modal-icon.warning{background-color:#fef3c7;color:var(--color-warning)}.modal-footer{display:flex;gap:var(--spacing-md);justify-content:flex-end}.modal-btn{padding:.5rem 1rem;border-radius:.375rem;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s;border:none}.modal-btn-primary{background-color:var(--color-primary);color:#fff}.modal-btn-primary:hover{background-color:var(--color-primary-hover)}.modal-btn-danger{background-color:var(--color-danger);color:#fff}.modal-btn-danger:hover{background-color:#dc2626}.modal-btn-secondary{background-color:var(--color-secondary);color:#fff}.modal-btn-secondary:hover{background-color:#4b5563}.modal-btn:disabled{opacity:.5;cursor:not-allowed}