/* Copyright CMcGee.dev - 2025 */
:root {--bg: #0b0f14;--panel: #111723;--text: #e7eef8;--muted: #a7b4c5;--accent: #4aa3ff;--accent-2: #7bd389;--danger: #ff5f6d;--warn: #ffb020;--low: #3db2ff;--info: #6aa7ff;--border: #1b2636;}* { box-sizing: border-box; }html, body { height: 100%; }body {margin: 0;font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";background: var(--bg);color: var(--text);min-height: 100vh;display: flex;flex-direction: column;}.app-header {display: flex;align-items: center;justify-content: space-between;padding: 12px 16px;background: var(--panel);border-bottom: 1px solid var(--border);position: sticky;top: 0;z-index: 10;}.title { font-weight: 700; letter-spacing: 0.2px; }.controls { display: flex; gap: 8px; align-items: center; }.file-picker input { display: none; }.file-picker span {display: inline-block;padding: 8px 12px;background: var(--accent);color: #001022;border-radius: 8px;font-weight: 600;cursor: pointer;}button.secondary {background: transparent;color: var(--text);border: 1px solid var(--border);padding: 8px 10px;border-radius: 8px;}button.secondary:hover { border-color: var(--accent); }main { padding: 16px; flex: 1; }.ingest { margin-top: 8px; }.dropzone {border: 2px dashed var(--border);border-radius: 10px;padding: 40px;display: grid;place-items: center;color: var(--muted);}.dropzone.dragover { border-color: var(--accent); color: var(--text); }.ingest-status { margin-top: 8px; color: var(--muted); }.tabs { display: flex; gap: 8px; align-items: center; margin-top: 16px; margin-bottom: 12px; }.tab {background: var(--panel);color: var(--muted);border: 1px solid var(--border);padding: 8px 12px;border-radius: 999px;cursor: pointer;}.tab.active { color: var(--text); border-color: var(--accent); }.spacer { flex: 1; }.search {background: var(--panel);border: 1px solid var(--border);color: var(--text);padding: 8px 10px;border-radius: 8px;min-width: 260px;}.view { display: block; }.view[hidden] { display: none; }.table-wrap { border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }table { width: 100%; border-collapse: collapse; }thead { background: #0f1623; }th, td {text-align: left;padding: 10px 12px;border-bottom: 1px solid var(--border);}tbody tr:hover { background: rgba(74, 163, 255, 0.08); cursor: pointer; }th.sortable { cursor: pointer; user-select: none; position: relative; }th.sortable::after {content: ''; position: absolute; right: 10px; top: 50%; transform: translateY(-50%);color: var(--muted); font-size: 10px;}th.sortable.asc::after { content: '▲'; }th.sortable.desc::after { content: '▼'; }.sev-dot { display: inline-block; width: 10px; height: 10px; border-radius: 999px; margin-right: 6px; vertical-align: middle; }.sev-4 { background: var(--danger); }.sev-3 { background: var(--danger); }.sev-2 { background: #ffaa3b; }.sev-1 { background: var(--low); }.sev-0 { background: var(--info); }.filters { display: flex; gap: 8px; align-items: center; margin-bottom: 8px; }.chip { background: var(--panel); border: 1px solid var(--border); border-radius: 999px; padding: 4px 10px; color: var(--muted); }.link { background: transparent; color: var(--accent); border: none; cursor: pointer; }.plugin-link { color: var(--accent); text-decoration: none; margin-left: 6px; }.plugin-link:hover { text-decoration: underline; }.ok { color: var(--accent-2); font-weight: 600; }.fail { color: var(--danger); font-weight: 600; }.details { margin-top: 12px; border: 1px solid var(--border); border-radius: 8px; padding: 12px; background: var(--panel); }.details h3 { margin: 0 0 6px 0; }.details pre { white-space: pre-wrap; background: #0b1220; padding: 8px; border-radius: 6px; border: 1px solid var(--border); }.app-footer {color: var(--muted);padding: 16px;display: flex;gap: 12px;align-items: center;justify-content: space-between;background: var(--panel);border-top: 1px solid var(--border);}.app-footer a { color: var(--muted); text-decoration: none; font-weight: 600; }.app-footer a:hover { color: var(--text); }.footer-right { display: flex; gap: 10px; align-items: center; }.icon-link {display: inline-flex;width: 24px;height: 24px;align-items: center;justify-content: center;color: var(--muted);background: #0f1623;border: 1px solid var(--border);border-radius: 6px;transition: color 120ms ease, border-color 120ms ease, background-color 120ms ease;}.icon-link svg { width: 16px; height: 16px; display: block; }.icon-link:hover { color: var(--text); border-color: var(--accent); background: #121b29; }.modal-root[hidden] { display: none; }.modal-root { position: fixed; inset: 0; display: grid; place-items: center; z-index: 50; }.modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,0.55); backdrop-filter: blur(2px); }.modal-dialog { position: relative; width: min(720px, 92vw); background: var(--panel); border: 1px solid var(--border); border-radius: 10px; padding: 16px; box-shadow: 0 10px 30px rgba(0,0,0,0.5); }.modal-title { font-weight: 700; margin-bottom: 8px; }.modal-content { color: var(--text); margin-bottom: 12px; max-height: 55vh; overflow: auto; }.modal-actions { display: flex; gap: 8px; justify-content: flex-end; }.btn { padding: 8px 12px; border-radius: 8px; border: 1px solid var(--border); background: #0e1623; color: var(--text); cursor: pointer; }.btn.primary { background: var(--accent); color: #001022; border-color: var(--accent); }.btn.danger { background: var(--danger); color: #fff; border-color: var(--danger); }.btn:hover { opacity: 0.95; }.toast-container {position: fixed;right: 16px;bottom: 16px;display: flex;flex-direction: column;gap: 10px;z-index: 60;max-width: min(380px, 92vw);}.toast {background: var(--panel);border: 1px solid var(--border);border-left-width: 4px;border-radius: 10px;padding: 10px 12px;color: var(--text);box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);animation: toast-in 180ms ease;}.toast-info { border-left-color: var(--info); }.toast-success { border-left-color: var(--accent-2); }.toast-warn { border-left-color: var(--warn); }.toast-hide { opacity: 0; transform: translateY(10px); transition: opacity 180ms ease, transform 180ms ease; }@keyframes toast-in {from { opacity: 0; transform: translateY(8px); }to { opacity: 1; transform: translateY(0); }}.details-row td { background: #0f1623; padding: 12px; border-top: 1px solid var(--border); }.details-row pre { white-space: pre-wrap; background: #0b1220; padding: 8px; border-radius: 6px; border: 1px solid var(--border); }