:root{--bg: #151329;--bg-2: #1a1633;--surface: #221c3f;--surface-2: #2a2350;--surface-glass: rgba(42, 35, 80, .55);--border: #332b5c;--border-2: #40376e;--text: #ece9fb;--text-muted: #a49ecb;--text-dim: #6f6796;--grad-primary: linear-gradient(135deg, #d0389f 0%, #7b3ff2 100%);--grad-warm: linear-gradient(135deg, #ff8a3d 0%, #ff4d8d 100%);--grad-cool: linear-gradient(135deg, #7b3ff2 0%, #2f9bff 100%);--primary: #9d5cff;--primary-strong: #7b3ff2;--accent-warm: #ff6fa5;--accent-teal: #2bd4c4;--ok: #34d399;--ok-bg: rgba(52, 211, 153, .14);--warn: #fbbf24;--warn-bg: rgba(251, 191, 36, .14);--danger: #fb7185;--danger-bg: rgba(251, 113, 133, .14);--info: #60a5fa;--info-bg: rgba(96, 165, 250, .14);--radius: 14px;--radius-sm: 8px;--radius-pill: 999px;--shadow: 0 8px 30px rgba(0, 0, 0, .35);--glow: 0 0 24px rgba(157, 92, 255, .35)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:var(--bg);color:var(--text)}*{scrollbar-color:var(--border-2) transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-thumb{background:var(--border-2);border-radius:var(--radius-pill)}*::-webkit-scrollbar-track{background:transparent}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active,textarea:-webkit-autofill,select:-webkit-autofill{-webkit-text-fill-color:var(--text);-webkit-box-shadow:0 0 0 1000px var(--bg-2) inset;box-shadow:0 0 0 1000px var(--bg-2) inset;caret-color:var(--text);transition:background-color 9999s ease-out 0s}.page-header{margin-bottom:24px}.page-header h1{font-size:24px;font-weight:700;color:var(--text);letter-spacing:-.02em}.page-header p{color:var(--text-muted);margin-top:4px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px;margin-bottom:24px}.stat-card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);overflow:hidden;transition:transform .18s,border-color .18s}.stat-card:hover{transform:translateY(-2px);border-color:var(--border-2)}.stat-card .stat-label{font-size:13px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.stat-card .stat-value{font-size:30px;font-weight:800;color:var(--text);margin-top:6px;font-variant-numeric:tabular-nums;letter-spacing:-.02em}.gradient-num,.stat-card .stat-value.gradient-num{background:var(--grad-primary);-webkit-background-clip:text;background-clip:text;color:transparent}.stat-icon{position:absolute;top:16px;right:16px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:var(--surface-glass);color:var(--text)}.stat-icon svg{width:22px;height:22px}.data-table{width:100%;border-collapse:collapse;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}.data-table th,.data-table td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--border)}.data-table th{background:var(--bg-2);font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted)}.data-table tbody tr:last-child td{border-bottom:none}.data-table th.sortable{cursor:pointer;-webkit-user-select:none;user-select:none;position:relative;padding-right:24px;transition:color .15s,background .15s}.data-table th.sortable:hover{color:var(--text);background:var(--surface-2)}.data-table th.sortable:after{content:"\2195";position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:12px;opacity:.35}.data-table th.sortable.sort-asc:after{content:"\2191";opacity:1;color:var(--primary)}.data-table th.sortable.sort-desc:after{content:"\2193";opacity:1;color:var(--primary)}.data-table th.sortable.sort-asc,.data-table th.sortable.sort-desc{color:var(--text)}.data-table th.sortable[data-sort-prio]{padding-right:40px}.data-table th.sortable[data-sort-prio]:before{content:attr(data-sort-prio);position:absolute;right:22px;top:50%;transform:translateY(-50%);min-width:14px;height:14px;padding:0 3px;box-sizing:border-box;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;line-height:1;color:#fff;background:var(--primary-strong);border-radius:999px}.data-table tr:hover{background:var(--surface-2)}.data-table a{color:var(--primary);text-decoration:none}.data-table a:hover{text-decoration:underline}.badge{display:inline-block;padding:3px 9px;border-radius:var(--radius-pill);font-size:12px;font-weight:600}.badge-success{background:var(--ok-bg);color:var(--ok)}.badge-warning{background:var(--warn-bg);color:var(--warn)}.badge-danger{background:var(--danger-bg);color:var(--danger)}.badge-info{background:var(--info-bg);color:var(--info)}.badge-secondary{background:var(--surface-2);color:var(--text-muted)}.pagination{display:flex;justify-content:space-between;align-items:center;margin-top:16px;padding:12px 0}.pagination button{padding:8px 16px;border:1px solid var(--border-2);background:var(--surface);color:var(--text);border-radius:var(--radius-sm);cursor:pointer;font-size:14px;transition:background .15s,border-color .15s}.pagination button:disabled{opacity:.4;cursor:not-allowed}.pagination button:hover:not(:disabled){background:var(--surface-2);border-color:var(--primary)}.pagination .page-info{color:var(--text-muted);font-size:14px}.btn{padding:8px 16px;border:none;border-radius:var(--radius-sm);cursor:pointer;font-size:14px;font-weight:600;transition:transform .15s,box-shadow .15s,background .2s,opacity .15s}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--grad-primary);color:#fff}.btn-primary:hover:not(:disabled){box-shadow:var(--glow);transform:translateY(-1px)}.btn-secondary{background:var(--surface-2);color:var(--text);border:1px solid var(--border-2)}.btn-secondary:hover:not(:disabled){background:var(--border)}.btn-danger{background:var(--danger-bg);color:var(--danger);border:1px solid var(--danger)}.btn-danger:hover:not(:disabled){background:var(--danger);color:#fff}.btn-sm{padding:4px 12px;font-size:13px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.detail-item{padding:8px 0}.detail-item .detail-label{font-size:13px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.detail-item .detail-value{font-size:16px;font-weight:500;margin-top:2px;color:var(--text)}.detail-item a{color:var(--primary);text-decoration:none}.detail-item a:hover{text-decoration:underline}.tab-bar{position:sticky;top:0;z-index:10;display:flex;flex-wrap:wrap;gap:6px;padding:10px 0;margin-bottom:20px;background:var(--bg);border-bottom:1px solid var(--border)}.tab-btn{padding:8px 16px;border:1px solid transparent;background:transparent;color:var(--text-muted);border-radius:var(--radius-pill);cursor:pointer;font-size:14px;font-weight:600;transition:color .15s,background .15s,border-color .15s}.tab-btn:hover{color:var(--text);background:var(--surface)}.tab-btn.active{color:#fff;background:var(--grad-primary);box-shadow:var(--glow)}.loading{text-align:center;padding:40px;color:var(--text-muted)}.error{background:var(--danger-bg);color:var(--danger);padding:12px 16px;border-radius:var(--radius-sm);margin-bottom:16px}.timeframe-filter{margin-bottom:20px}.timeframe-presets{display:flex;flex-wrap:wrap;gap:8px}.timeframe-btn{padding:6px 14px;border:1px solid var(--border-2);background:var(--surface);border-radius:var(--radius-sm);cursor:pointer;font-size:13px;font-weight:500;color:var(--text-muted);transition:all .15s}.timeframe-btn:hover{background:var(--surface-2);border-color:var(--primary);color:var(--text)}.timeframe-btn.active{background:var(--grad-primary);color:#fff;border-color:transparent}.timeframe-custom{display:flex;gap:16px;margin-top:12px;align-items:flex-end}.custom-field{display:flex;flex-direction:column;gap:4px}.custom-field label{font-size:12px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}.custom-field input[type=datetime-local]{padding:6px 10px;border:1px solid var(--border-2);border-radius:var(--radius-sm);font-size:13px;font-family:inherit;color:var(--text);background:var(--surface);color-scheme:dark}.custom-field input[type=datetime-local]:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px #9d5cff40}.column-filter{margin-bottom:16px}.filter-rows{display:flex;flex-direction:column;gap:8px}.filter-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.filter-select,.filter-input{padding:6px 10px;border:1px solid var(--border-2);border-radius:var(--radius-sm);font-size:13px;font-family:inherit;color:var(--text);background:var(--surface);color-scheme:dark}.filter-select:focus,.filter-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 2px #9d5cff40}.filter-column-select{min-width:150px}.filter-operator-select{min-width:100px}.filter-value-select,.filter-input{min-width:180px}.filter-remove-btn{width:28px;height:28px;display:flex;align-items:center;justify-content:center;border:1px solid var(--border-2);background:var(--surface);border-radius:var(--radius-sm);cursor:pointer;font-size:16px;color:var(--text-muted);line-height:1;transition:all .15s;flex-shrink:0}.filter-remove-btn:hover{background:var(--danger-bg);border-color:var(--danger);color:var(--danger)}.filter-add-btn{margin-top:8px;padding:6px 14px;border:1px dashed var(--border-2);background:transparent;border-radius:var(--radius-sm);cursor:pointer;font-size:13px;font-weight:500;color:var(--text-muted);transition:all .15s}.filter-add-btn:hover{border-color:var(--primary);color:var(--primary);background:#9d5cff14}.back-link{display:inline-block;margin-bottom:16px;color:var(--primary);text-decoration:none;font-size:14px}.back-link:hover{text-decoration:underline}@media (max-width: 768px){.data-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}.card{padding:14px}.page-header{margin-bottom:16px}.detail-grid{grid-template-columns:1fr}.timeframe-custom{flex-direction:column;align-items:stretch;gap:12px}.custom-field input[type=datetime-local]{width:100%}.filter-row{flex-direction:column;align-items:stretch}.filter-column-select,.filter-operator-select,.filter-value-select,.filter-input{min-width:0;width:100%}.filter-remove-btn{align-self:flex-end}}
