:root{--primary: #4f46e5;--primary-hover: #4338ca;--bg: #f9fafb;--bg-card: #ffffff;--text: #111827;--text-muted: #6b7280;--border: #e5e7eb;--success: #10b981;--warning: #f59e0b;--error: #ef4444}*{margin:0;padding:0;box-sizing:border-box}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);line-height:1.5}.skeleton{position:relative;overflow:hidden;background:#e5e7eb;color:transparent}.skeleton:after{content:"";position:absolute;inset:0;transform:translate(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);animation:skeleton-shimmer 1.4s infinite}@keyframes skeleton-shimmer{to{transform:translate(100%)}}.skeleton-text{display:inline-block;height:.9em;width:8ch;border-radius:6px}.skeleton-text.sm{width:6ch;height:.75em}.skeleton-text.lg{width:14ch;height:1em}.skeleton-text.xl{width:18ch;height:1.1em}.skeleton-badge{display:inline-block;width:72px;height:20px;border-radius:9999px}.skeleton-avatar{display:inline-block;width:36px;height:36px;border-radius:50%}.login-container{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem}.login-box{background:var(--bg-card);padding:3rem;border-radius:12px;box-shadow:0 4px 6px -1px #0000001a;text-align:center;max-width:400px;width:100%}.login-box h1{margin-bottom:.5rem;font-size:1.5rem}.login-box p{color:var(--text-muted);margin-bottom:2rem}.login-logo{margin-bottom:1.5rem}.logo-icon{display:inline-flex;align-items:center;justify-content:center;width:56px;height:56px;background:linear-gradient(135deg,var(--primary) 0%,#7c3aed 100%);color:#fff;border-radius:14px}.login-footer{margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border)}.login-footer p{font-size:.8125rem;color:var(--text-muted);margin:0}.google-btn{display:inline-flex;align-items:center;gap:.75rem;background:var(--bg-card);border:1px solid var(--border);padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;cursor:pointer;text-decoration:none;color:var(--text);transition:background .2s,box-shadow .2s}.google-btn:hover{background:var(--bg);box-shadow:0 2px 4px #0000001a}.google-btn svg{width:20px;height:20px}.admin-layout{display:flex;height:100vh;overflow:hidden}.sidebar{width:250px;background:var(--bg-card);border-right:1px solid var(--border);padding:1.5rem;display:flex;flex-direction:column;flex-shrink:0}.sidebar-logo{font-weight:600;font-size:1.25rem;margin-bottom:2rem;color:var(--primary)}.sidebar-nav{display:flex;flex-direction:column;gap:.25rem;flex:1}.sidebar-nav a{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;border-radius:8px;text-decoration:none;color:var(--text-muted);transition:background .2s,color .2s}.sidebar-nav a:hover,.sidebar-nav a.active{background:var(--bg);color:var(--text)}.sidebar-nav a.active{background:#eef2ff;color:var(--primary)}.sidebar-user{border-top:1px solid var(--border);padding-top:1rem;display:flex;align-items:center;gap:.75rem}.sidebar-toggle{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;border:1px solid var(--border);background:var(--bg-card);color:var(--text);cursor:pointer;transition:background .2s,border-color .2s;flex-shrink:0}.sidebar-toggle:hover{background:var(--bg)}.sidebar-backdrop{position:fixed;inset:0;background:#11182773;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s;z-index:900}.sidebar-backdrop.show{opacity:1;visibility:visible}body.sidebar-open{overflow:hidden}.sidebar-user img{width:36px;height:36px;border-radius:50%}.sidebar-user-info{flex:1;min-width:0}.sidebar-user-name{font-weight:500;font-size:.875rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-user-email{font-size:.75rem;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.main-content{flex:1;padding:2rem;overflow-y:auto}.page-header{margin-bottom:2rem;display:flex;align-items:center;gap:.75rem}.page-title-block{display:flex;flex-direction:column;gap:.25rem}.page-header-row{display:flex;align-items:center;gap:1rem}.page-header h1{font-size:1.5rem;margin-bottom:.25rem}.page-header-row h1{margin:0}.page-header p{color:var(--text-muted)}.card{background:var(--bg-card);border-radius:12px;border:1px solid var(--border);padding:1.5rem}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.card-title{font-weight:600}.metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:2rem}.metric-card{background:var(--bg-card);border-radius:12px;border:1px solid var(--border);padding:1.5rem}.metric-label{font-size:.875rem;color:var(--text-muted);margin-bottom:.5rem}.metric-value{font-size:2rem;font-weight:600}.metric-change{font-size:.75rem;margin-top:.25rem}.metric-change.positive{color:var(--success)}.metric-change.negative{color:var(--error)}.table-container{overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{padding:.75rem 1rem;text-align:left;border-bottom:1px solid var(--border)}th{font-weight:500;font-size:.875rem;color:var(--text-muted);background:var(--bg)}tr:hover{background:var(--bg)}.filters{display:flex;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.filter-input{padding:.5rem 1rem;border:1px solid var(--border);border-radius:8px;font-size:.875rem;min-width:200px}.filter-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #4f46e51a}.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:8px;font-size:.875rem;font-weight:500;cursor:pointer;border:none;transition:background .2s}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover)}.btn-secondary{background:var(--bg);color:var(--text);border:1px solid var(--border)}.btn-secondary:hover{background:var(--border)}.btn-danger{background:var(--error);color:#fff}.badge{display:inline-block;padding:.25rem .75rem;border-radius:9999px;font-size:.75rem;font-weight:500;min-width:4.5rem;text-align:center}.badge-success{background:#d1fae5;color:#065f46}.badge-warning{background:#fef3c7;color:#92400e}.badge-error{background:#fee2e2;color:#991b1b}.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem}.detail-section{background:var(--bg-card);border-radius:12px;border:1px solid var(--border);padding:1.5rem}.detail-section h3{font-size:1rem;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--border)}.detail-row{display:flex;justify-content:space-between;align-items:center;padding:.5rem 0;gap:.5rem}.detail-row .subscription-value{flex:1;text-align:right}.btn-refresh{padding:.25rem;line-height:1;flex-shrink:0}.btn-refresh .refresh-icon{display:block}.btn-refresh.loading .refresh-icon{animation:spin 1s linear infinite}.btn-refresh:disabled{opacity:.5;cursor:not-allowed}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.detail-label{color:var(--text-muted);font-size:.875rem}.detail-value{font-weight:500;font-size:.875rem}.text-muted{color:var(--text-muted)}.text-sm{font-size:.875rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}.sidebar-user-dropdown{position:relative;border-top:1px solid var(--border);padding-top:1rem}.sidebar-user-dropdown .sidebar-user{width:100%;background:none;border:none;cursor:pointer;display:flex;align-items:center;gap:.75rem;padding:.5rem;border-radius:8px;transition:background .2s;text-align:left}.sidebar-user-dropdown .sidebar-user:hover{background:var(--bg)}.dropdown-arrow{margin-left:auto;color:var(--text-muted);transition:transform .2s}.user-menu{position:absolute;bottom:100%;left:0;right:0;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:.5rem;margin-bottom:.5rem;box-shadow:0 4px 12px #00000026;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .2s,transform .2s,visibility .2s}.user-menu.show{opacity:1;visibility:visible;transform:translateY(0)}.user-menu-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;border-radius:6px;text-decoration:none;color:var(--text);font-size:.875rem;transition:background .2s}.user-menu-item:hover{background:var(--bg)}.user-menu-item svg{color:var(--text-muted)}.search-bar{position:relative;margin-bottom:1.5rem}.search-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none}.search-input{width:100%;max-width:500px;padding:.875rem 1rem .875rem 3rem;border:1px solid var(--border);border-radius:10px;font-size:.9375rem;background:var(--bg-card);transition:border-color .2s,box-shadow .2s}.search-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #4f46e51a}.search-input::placeholder{color:var(--text-muted)}.search-hint{display:none}.table-wrapper{overflow-x:auto}.table-wrapper.virtual-table{max-height:calc(100vh - 360px);overflow-y:auto}.table-wrapper.virtual-table .data-table thead th{position:sticky;top:0;z-index:1}.data-table{width:100%;border-collapse:separate;border-spacing:0}.data-table th{padding:.875rem 1rem;text-align:left;font-weight:500;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);background:var(--bg);border-bottom:1px solid var(--border)}.data-table th:first-child{border-top-left-radius:8px}.data-table th:last-child{border-top-right-radius:8px}.data-table td{padding:.5rem .75rem;border-bottom:1px solid var(--border);vertical-align:middle;font-size:.8125rem}.data-table.high-density td{padding:.375rem .5rem;font-size:.75rem}.data-table.high-density th{padding:.5rem;font-size:.6875rem}.data-table tbody tr{transition:background .15s}.data-table tbody tr.clickable-row{cursor:pointer}.data-table tbody tr:hover{background:#f8fafc}.data-table tbody tr:last-child td{border-bottom:none}.customer-cell{display:flex;align-items:center;gap:.75rem}.customer-avatar{width:36px;height:36px;border-radius:8px;background:linear-gradient(135deg,var(--primary) 0%,#7c3aed 100%);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;flex-shrink:0}.customer-info{display:flex;flex-direction:column;gap:.125rem;min-width:0}.customer-email{font-weight:500;color:var(--text)}.customer-id{font-size:.75rem;color:var(--text-muted);font-family:ui-monospace,SFMono-Regular,monospace}.code-tag{display:inline-block;padding:.25rem .5rem;background:var(--bg);border-radius:4px;font-family:ui-monospace,SFMono-Regular,monospace;font-size:.8125rem;color:var(--text)}.warehouse-cell{display:flex;align-items:center;gap:.5rem}.warehouse-icon{color:var(--text-muted);display:flex}.btn-icon{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:6px;color:var(--text-muted);text-decoration:none;transition:background .2s,color .2s}.btn-icon:hover{background:var(--bg);color:var(--text)}.table-footer{display:flex;justify-content:space-between;align-items:center;padding:1rem;border-top:1px solid var(--border);background:var(--bg);border-radius:0 0 12px 12px;margin:0 -1.5rem -1.5rem}.pagination{display:flex;align-items:center;gap:.75rem}.page-info{font-size:.875rem;color:var(--text-muted)}.btn-sm{padding:.375rem .625rem}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem;color:var(--text-muted);text-align:center}.empty-state svg{margin-bottom:1rem;opacity:.5}.empty-state p{font-weight:500;color:var(--text);margin-bottom:.25rem}.empty-state span{font-size:.875rem}.copyable{display:inline-flex;align-items:center;gap:.5rem;background:none;border:none;padding:.25rem .5rem;margin:-.25rem -.5rem;border-radius:6px;cursor:pointer;font-size:.875rem;font-weight:500;color:var(--text);font-family:inherit;transition:background .15s}.copyable:hover{background:var(--bg)}.copyable code{font-family:ui-monospace,SFMono-Regular,monospace;font-size:.8125rem}.copyable .copy-icon{color:var(--text-muted);opacity:0;transition:opacity .15s}.copyable:hover .copy-icon{opacity:1}.copyable .check-icon{color:var(--success);display:none}.copyable.copied .copy-icon{display:none}.copyable.copied .check-icon{display:block}.query-filters{display:flex;flex-wrap:wrap;gap:1rem;padding-bottom:1rem;margin-bottom:1rem;border-bottom:1px solid var(--border)}.filter-group{display:flex;flex-direction:column;gap:.375rem}.filter-label{font-size:.75rem;font-weight:500;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.filter-select,.query-filters .filter-input{padding:.5rem .75rem;border:1px solid var(--border);border-radius:6px;font-size:.875rem;background:var(--bg-card);min-width:150px}.filter-select:focus,.query-filters .filter-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #4f46e51a}.filter-actions{flex-direction:row;align-items:flex-end;gap:.5rem}.query-info{padding:.75rem 0;font-size:.875rem;color:var(--text-muted)}.query-info strong{color:var(--text)}.metric-section{display:flex;flex-direction:column;gap:.75rem}.metric-header{display:flex;align-items:center;gap:.75rem}.metric-icon{width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center}.metric-icon-primary{background:#eef2ff;color:var(--primary)}.metric-icon-success{background:#d1fae5;color:var(--success)}.metric-icon-warning{background:#fef3c7;color:var(--warning)}.metric-icon-info{background:#dbeafe;color:#3b82f6}.metric-section .metric-label{font-size:.875rem;color:var(--text-muted);margin:0}.metric-section .metric-value{font-size:2rem;font-weight:700;line-height:1}.metric-section .metric-change{display:flex;align-items:center;gap:.375rem;font-size:.8125rem;margin:0}.metric-section .metric-change.positive{color:var(--success)}.metric-section .metric-change.negative{color:var(--error)}.status-grid{display:flex;flex-direction:column;gap:.5rem}.status-item{display:flex;align-items:center;gap:1rem;padding:.875rem;border-radius:8px;background:var(--bg)}.status-indicator{width:10px;height:10px;border-radius:50%;flex-shrink:0}.status-indicator.status-healthy{background:var(--success);box-shadow:0 0 0 3px #10b98133}.status-indicator.status-warning{background:var(--warning);box-shadow:0 0 0 3px #f59e0b33}.status-indicator.status-error{background:var(--error);box-shadow:0 0 0 3px #ef444433}.status-info{flex:1;min-width:0}.status-name{font-weight:500;font-size:.875rem}.status-detail{font-size:.75rem;color:var(--text-muted);margin-top:.125rem}.status-uptime{font-size:.875rem;font-weight:600;color:var(--text-muted)}.log-metrics-bar{display:flex;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}.metric-chip{display:flex;flex-direction:column;gap:.25rem;padding:.75rem 1rem;background:var(--bg);border-radius:8px;min-width:100px}.metric-chip .metric-label{font-size:.75rem;color:var(--text-muted);margin:0}.metric-chip .metric-value{font-size:1.25rem;font-weight:600;line-height:1}.metric-chip .metric-rate{font-size:.75rem;color:var(--error)}.metric-chip-clickable{cursor:pointer;transition:background .15s}.metric-chip-clickable:hover{background:#fee2e2}.filter-chips{display:flex;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}.chip{display:inline-flex;align-items:center;padding:.375rem .75rem;background:var(--bg);border:1px solid var(--border);border-radius:9999px;font-size:.8125rem;color:var(--text-muted);cursor:pointer;transition:all .15s}.chip:hover{background:var(--border);color:var(--text)}.chip-active{background:var(--primary);border-color:var(--primary);color:#fff}.chip-active:hover{background:var(--primary-hover)}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--text-muted)}.status-dot.status-success{background:var(--success)}.status-dot.status-pending{background:var(--warning)}.status-dot.status-failed{background:var(--error)}.time-relative{border-bottom:1px dotted var(--text-muted);cursor:help;font-size:.6875rem;color:var(--text-muted);white-space:nowrap}.failure-cell{display:flex;flex-direction:column;gap:.125rem;max-width:180px}.failure-reason{color:var(--error);font-size:.6875rem;line-height:1.3}.suggested-action{font-style:italic;color:var(--text-muted);font-size:.625rem}.message-cell{display:flex;flex-direction:column;gap:.125rem;max-width:280px}.message-preview{font-size:.75rem;word-break:break-word;line-height:1.3}.payload-preview{font-family:ui-monospace,SFMono-Regular,monospace;font-size:.625rem;color:var(--text-muted);background:var(--bg);padding:.125rem .375rem;border-radius:3px;word-break:break-word}.details-preview{display:block;font-family:ui-monospace,SFMono-Regular,monospace;font-size:.625rem;color:var(--error);background:#fee2e2;padding:.125rem .375rem;border-radius:3px;word-break:break-word}.message-cell-dense{font-size:.8125rem;line-height:1.4;word-break:break-word}.details-inline{font-family:ui-monospace,SFMono-Regular,monospace;font-size:.75rem;color:var(--text-muted);background:var(--bg);padding:.125rem .375rem;border-radius:3px;margin-left:.5rem}.badge-info{background:#dbeafe;color:#1e40af}.data-table.high-density td{padding:.5rem .75rem;font-size:.8125rem}.data-table.high-density .time-relative{font-size:.8125rem}.data-table.high-density .code-tag{font-size:.75rem}.events-scroll-container{max-height:500px;min-height:300px;overflow-y:auto;border:1px solid var(--border);border-radius:8px;background:var(--bg-card)}.events-scroll-container .data-table{border-radius:0}.events-scroll-container .data-table thead th{position:sticky;top:0;z-index:1;background:var(--bg)}.events-scroll-container .data-table th:first-child{border-top-left-radius:0}.events-scroll-container .data-table th:last-child{border-top-right-radius:0}.events-scroll-container .empty-state{border:none}.event-row{cursor:pointer}.event-row:hover,.event-row.expanded{background:#f8fafc}.event-row.expanded td{border-bottom:none}.event-details-row{display:none}.event-details-row.show{display:table-row}.event-details-row td{padding:0;background:#f8fafc}.event-details-content{padding:.75rem 1rem;border-bottom:1px solid var(--border)}.event-details-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem}.event-detail-item{display:flex;flex-direction:column;gap:.25rem}.event-detail-label{font-size:.6875rem;font-weight:500;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.event-detail-value{font-size:.8125rem;color:var(--text);word-break:break-word}.event-detail-value code{font-family:ui-monospace,SFMono-Regular,monospace;font-size:.75rem;background:var(--bg-card);padding:.125rem .375rem;border-radius:3px;border:1px solid var(--border)}.event-detail-value.error-text{color:var(--error)}.event-payload-preview{margin-top:.5rem;padding:.5rem;background:var(--bg-card);border:1px solid var(--border);border-radius:4px;font-family:ui-monospace,SFMono-Regular,monospace;font-size:.75rem;color:var(--text-muted);white-space:pre-wrap;word-break:break-all;max-height:100px;overflow-y:auto}.expand-icon{display:inline-block;width:16px;height:16px;margin-right:.25rem;vertical-align:middle;transition:transform .15s}.event-row.expanded .expand-icon{transform:rotate(90deg)}#live-tail-btn{display:inline-flex;align-items:center;gap:.5rem}#live-tail-btn .live-dot{width:8px;height:8px;border-radius:50%;background:var(--text-muted);transition:background .15s}#live-tail-btn.active{background:var(--error);color:#fff;border-color:var(--error)}#live-tail-btn.active .live-dot{background:#fff;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.action-bar{display:flex;gap:.5rem;align-items:center}.dropdown{position:relative}.dropdown-menu{position:absolute;top:100%;right:0;background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:.25rem;margin-top:.25rem;box-shadow:0 4px 12px #0000001a;z-index:100;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .15s,transform .15s,visibility .15s;min-width:100px}.dropdown-menu.show{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-menu button{display:block;width:100%;padding:.5rem .75rem;background:none;border:none;text-align:left;font-size:.875rem;color:var(--text);cursor:pointer;border-radius:4px;transition:background .15s}.dropdown-menu button:hover{background:var(--bg)}.badge-source{background:#dbeafe;color:#1e40af}.toast{position:fixed;bottom:2rem;left:50%;transform:translate(-50%) translateY(100%);background:var(--text);color:#fff;padding:.75rem 1.5rem;border-radius:8px;font-size:.875rem;opacity:0;visibility:hidden;transition:all .3s ease;z-index:1000}.toast.show{opacity:1;visibility:visible;transform:translate(-50%) translateY(0)}.new-event{animation:highlightNew 2s ease-out}@keyframes highlightNew{0%{background:#d1fae5}to{background:transparent}}@media(max-width:1024px){.main-content{padding:1.5rem}.detail-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}@media(max-width:768px){.sidebar-toggle{display:inline-flex}.sidebar{position:fixed;top:0;left:0;width:260px;height:100vh;padding:1.5rem;border-right:1px solid var(--border);border-bottom:none;transform:translate(-100%);transition:transform .2s ease;z-index:1000;box-shadow:0 10px 30px #0f172a1f}.sidebar.open{transform:translate(0)}.sidebar-logo{margin-bottom:1.5rem}.sidebar-nav{flex-direction:column;gap:.5rem}.sidebar-nav a{padding:.65rem .85rem;border-radius:8px}.sidebar-user-dropdown{margin-top:1rem}.user-menu{top:100%;bottom:auto;margin-top:.5rem;margin-bottom:0}.main-content{padding:1rem}.table-footer{flex-direction:column;align-items:flex-start;gap:.75rem}.detail-grid{grid-template-columns:1fr}.table-wrapper.virtual-table{max-height:calc(100vh - 300px)}}