Lucas RayanandClaude Sonnet 5
1b974bb90d
Acauã: Network Detection & Threat Hunting, heuristic analysis over a rolling 7-day window using deterministic math (time series, graph theory, information theory) instead of opaque ML models. Third product in the Ciberfauna ecosystem, alongside Guará and Sabiá. Follows the ecosystem's established conventions: OpenWolf project memory, bilingual PT-BR/EN docs and UI, Gitea Actions CI/CD on the same self-hosted runners, Conventional Commits, SemVer, logo and productName handling, MIT OR Apache-2.0 licensing. Architecture decision (made with the project owner after a dedicated consultation, not the original blueprint's suggested stack): Rust throughout, not Python/FastAPI/React. Most of the statistics (Bowley skew, MADM, Shannon entropy, PCR, Z-score, novel-edge detection, pivot chains) reduces to SQL over an embedded DuckDB/Parquet store; only the spectral analysis and graph centrality need host-language code, and both have workable Rust crates. Documented in full, including six corrections to the original blueprint's math (Rayleigh/Schuster instead of a degenerate Lomb-Scargle over bare timestamps, an explicit sentinel for Bowley skew's Q3=Q1 case, Jensen-Shannon instead of unbounded KL, a dedicated long-connection detector, JA4 vs. JA4+ licensing caution, deterministic per-alert evidence), in docs/architecture.md. Skeleton only: crates/acaua-core has the four detection pillars, fusion, storage, zeek log parsing and the updater as typed stubs that compile and return a clear "skeleton" status rather than real detection logic — that is separate, future work. crates/acaua-cli has serve/analyze/doctor/update. apps/gui is a minimal Tauri shell. Also already includes the one-click desktop self-update mechanism shared with Guará and Sabiá (AppImage/.deb/Windows installer), even with no release published yet, for consistency across the ecosystem. No Gitea repository exists for this project yet; this is a local-only commit. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01VAyr8d7HuAdUGB6aA5xmDD
305 lines
9.9 KiB
CSS
305 lines
9.9 KiB
CSS
:root {
|
|
color-scheme: dark;
|
|
--bg: #071018;
|
|
--bg-2: #0b1722;
|
|
--panel: rgba(15, 30, 43, 0.78);
|
|
--panel-solid: #0f1e2b;
|
|
--line: rgba(148, 188, 205, 0.18);
|
|
--line-strong: rgba(148, 188, 205, 0.34);
|
|
--text: #e8f2f4;
|
|
--muted: #8fa8b3;
|
|
--accent: #45d6b0;
|
|
--accent-2: #f0b35b;
|
|
--danger: #f27878;
|
|
--shadow: 0 24px 60px rgba(0, 0, 0, 0.32);
|
|
--radius: 16px;
|
|
--mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
|
|
--sans: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
|
|
}
|
|
|
|
html[data-theme="light"] {
|
|
color-scheme: light;
|
|
--bg: #eef4f3;
|
|
--bg-2: #e2ece9;
|
|
--panel: rgba(255, 255, 255, 0.84);
|
|
--panel-solid: #ffffff;
|
|
--line: rgba(20, 58, 64, 0.14);
|
|
--line-strong: rgba(20, 58, 64, 0.28);
|
|
--text: #10262b;
|
|
--muted: #5d7479;
|
|
--accent: #087f68;
|
|
--accent-2: #a05b09;
|
|
--danger: #b42323;
|
|
--shadow: 0 20px 50px rgba(20, 58, 64, 0.12);
|
|
}
|
|
|
|
* { box-sizing: border-box; }
|
|
|
|
html, body { min-height: 100%; }
|
|
|
|
body {
|
|
margin: 0;
|
|
font-family: var(--sans);
|
|
color: var(--text);
|
|
background:
|
|
radial-gradient(900px 520px at 12% -8%, rgba(69, 214, 176, 0.15), transparent 60%),
|
|
radial-gradient(760px 480px at 95% 0%, rgba(240, 179, 91, 0.12), transparent 58%),
|
|
linear-gradient(150deg, var(--bg), var(--bg-2));
|
|
background-attachment: fixed;
|
|
}
|
|
|
|
button, input, select { font: inherit; color: inherit; }
|
|
button { cursor: pointer; }
|
|
h1, h2, p { margin: 0; }
|
|
|
|
.app {
|
|
display: grid;
|
|
grid-template-columns: 286px minmax(0, 1fr);
|
|
min-height: 100vh;
|
|
}
|
|
|
|
.sidebar {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 22px;
|
|
padding: 28px 22px;
|
|
border-right: 1px solid var(--line);
|
|
background: linear-gradient(180deg, rgba(8, 19, 28, 0.72), rgba(8, 19, 28, 0.36));
|
|
backdrop-filter: blur(18px);
|
|
position: sticky;
|
|
top: 0;
|
|
height: 100vh;
|
|
}
|
|
|
|
html[data-theme="light"] .sidebar {
|
|
background: linear-gradient(180deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.4));
|
|
}
|
|
|
|
.brand { display: flex; align-items: center; gap: 12px; }
|
|
.logo { width: 46px; height: 46px; object-fit: contain; filter: drop-shadow(0 8px 18px rgba(0, 0, 0, 0.25)); }
|
|
.brand strong { display: block; font-size: 1.18rem; letter-spacing: 0.01em; }
|
|
.brand small { display: block; color: var(--muted); font-size: 0.78rem; margin-top: 2px; }
|
|
|
|
.side-title {
|
|
color: var(--muted);
|
|
font-size: 0.7rem;
|
|
letter-spacing: 0.16em;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.nav { display: grid; gap: 6px; }
|
|
.nav-item {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
width: 100%;
|
|
padding: 11px 12px;
|
|
border: 1px solid transparent;
|
|
border-radius: 12px;
|
|
background: transparent;
|
|
text-align: left;
|
|
color: var(--muted);
|
|
transition: 160ms ease;
|
|
}
|
|
.nav-item:hover { border-color: var(--line); background: rgba(69, 214, 176, 0.06); color: var(--text); }
|
|
.nav-item.active { border-color: var(--line-strong); background: rgba(69, 214, 176, 0.1); color: var(--text); }
|
|
.nav-icon { width: 20px; color: var(--accent); text-align: center; }
|
|
.nav-label { display: block; font-size: 0.92rem; font-weight: 600; }
|
|
.nav-sub { display: block; font-size: 0.72rem; color: var(--muted); margin-top: 2px; }
|
|
|
|
.side-foot { margin-top: auto; display: grid; gap: 12px; }
|
|
.status-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
|
|
.pill {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 7px;
|
|
padding: 5px 9px;
|
|
border: 1px solid var(--line);
|
|
border-radius: 999px;
|
|
font-size: 0.72rem;
|
|
color: var(--text);
|
|
background: rgba(255, 255, 255, 0.03);
|
|
}
|
|
.pill.muted { color: var(--muted); }
|
|
.dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 12px var(--accent); }
|
|
.pill.offline .dot { background: var(--danger); box-shadow: 0 0 12px var(--danger); }
|
|
.mono { font-family: var(--mono); font-size: 0.75rem; color: var(--muted); }
|
|
|
|
.main { padding: 38px clamp(22px, 4vw, 56px) 42px; min-width: 0; }
|
|
.topbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 26px; }
|
|
.eyebrow { color: var(--accent); font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; margin-bottom: 8px; }
|
|
h1 { font-size: clamp(1.9rem, 3.3vw, 3.1rem); line-height: 1.04; letter-spacing: -0.035em; }
|
|
.sub { color: var(--muted); margin-top: 10px; font-size: 0.98rem; }
|
|
h2 { font-size: 1.08rem; letter-spacing: -0.01em; }
|
|
|
|
.icon-btn {
|
|
display: inline-grid;
|
|
place-items: center;
|
|
width: 40px;
|
|
height: 40px;
|
|
border: 1px solid var(--line);
|
|
border-radius: 12px;
|
|
background: var(--panel);
|
|
color: var(--text);
|
|
font-size: 1.05rem;
|
|
}
|
|
.icon-btn:hover { border-color: var(--line-strong); }
|
|
|
|
.notice {
|
|
display: flex;
|
|
gap: 10px;
|
|
align-items: baseline;
|
|
padding: 14px 16px;
|
|
margin-bottom: 14px;
|
|
border: 1px solid var(--line);
|
|
border-radius: 12px;
|
|
background: var(--panel);
|
|
color: var(--muted);
|
|
font-size: 0.86rem;
|
|
line-height: 1.5;
|
|
}
|
|
.notice strong { color: var(--text); white-space: nowrap; }
|
|
.notice-warn { border-color: rgba(240, 179, 91, 0.34); background: rgba(240, 179, 91, 0.07); }
|
|
|
|
.pillars {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
gap: 14px;
|
|
margin: 24px 0;
|
|
}
|
|
.card {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 9px;
|
|
min-height: 178px;
|
|
padding: 20px;
|
|
border: 1px solid var(--line);
|
|
border-radius: var(--radius);
|
|
background: linear-gradient(160deg, var(--panel), rgba(15, 30, 43, 0.36));
|
|
box-shadow: var(--shadow);
|
|
}
|
|
html[data-theme="light"] .card { background: linear-gradient(160deg, var(--panel), rgba(255, 255, 255, 0.5)); }
|
|
.card-kicker { color: var(--accent); font-size: 0.68rem; letter-spacing: 0.18em; text-transform: uppercase; }
|
|
.card h2 { font-size: 1.02rem; }
|
|
.card p { color: var(--muted); font-size: 0.83rem; line-height: 1.5; }
|
|
.tag { margin-top: auto; align-self: flex-start; color: var(--accent-2); font-size: 0.68rem; letter-spacing: 0.08em; text-transform: uppercase; }
|
|
|
|
.panel {
|
|
margin-top: 16px;
|
|
padding: 22px;
|
|
border: 1px solid var(--line);
|
|
border-radius: var(--radius);
|
|
background: var(--panel);
|
|
box-shadow: var(--shadow);
|
|
scroll-margin-top: 20px;
|
|
}
|
|
.panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 18px; }
|
|
.hint { color: var(--muted); font-size: 0.84rem; line-height: 1.5; margin-top: 5px; }
|
|
|
|
.field-row { display: flex; align-items: flex-end; gap: 10px; }
|
|
.field { display: grid; gap: 7px; flex: 1; }
|
|
.field > span { color: var(--muted); font-size: 0.74rem; letter-spacing: 0.08em; text-transform: uppercase; }
|
|
input, select {
|
|
width: 100%;
|
|
padding: 10px 12px;
|
|
border: 1px solid var(--line-strong);
|
|
border-radius: 10px;
|
|
background: rgba(0, 0, 0, 0.16);
|
|
outline: none;
|
|
}
|
|
html[data-theme="light"] input, html[data-theme="light"] select { background: rgba(255, 255, 255, 0.7); }
|
|
input:focus, select:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(69, 214, 176, 0.12); }
|
|
|
|
.btn {
|
|
padding: 10px 14px;
|
|
border: 1px solid var(--line-strong);
|
|
border-radius: 10px;
|
|
background: rgba(255, 255, 255, 0.04);
|
|
color: var(--text);
|
|
font-size: 0.84rem;
|
|
font-weight: 600;
|
|
white-space: nowrap;
|
|
}
|
|
.btn:hover { border-color: var(--accent); }
|
|
.btn.primary { background: var(--accent); border-color: var(--accent); color: #06211b; }
|
|
.btn.primary:hover { filter: brightness(1.06); }
|
|
.btn:disabled { opacity: 0.5; cursor: progress; }
|
|
|
|
.link-btn { border: 0; background: transparent; color: var(--accent); font-size: 0.75rem; padding: 0; }
|
|
.link-btn:hover { text-decoration: underline; }
|
|
|
|
.output {
|
|
min-height: 92px;
|
|
margin: 16px 0 0;
|
|
padding: 14px;
|
|
overflow: auto;
|
|
border: 1px solid var(--line);
|
|
border-radius: 10px;
|
|
background: rgba(0, 0, 0, 0.2);
|
|
color: var(--muted);
|
|
font-family: var(--mono);
|
|
font-size: 0.76rem;
|
|
line-height: 1.55;
|
|
white-space: pre-wrap;
|
|
}
|
|
html[data-theme="light"] .output { background: rgba(20, 58, 64, 0.04); }
|
|
|
|
.alert-list { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
|
|
.alert-list li {
|
|
padding: 12px 14px;
|
|
border: 1px solid var(--line);
|
|
border-radius: 10px;
|
|
background: rgba(255, 255, 255, 0.02);
|
|
font-size: 0.84rem;
|
|
}
|
|
.alert-list .empty { color: var(--muted); border-style: dashed; }
|
|
.alert-meta { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 4px; }
|
|
.alert-meta strong { font-size: 0.78rem; color: var(--accent-2); }
|
|
.alert-summary { color: var(--muted); line-height: 1.5; }
|
|
|
|
.foot {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
gap: 16px;
|
|
margin-top: 26px;
|
|
color: var(--muted);
|
|
font-size: 0.74rem;
|
|
}
|
|
|
|
dialog {
|
|
width: min(460px, calc(100vw - 32px));
|
|
padding: 22px;
|
|
border: 1px solid var(--line-strong);
|
|
border-radius: var(--radius);
|
|
background: var(--panel-solid);
|
|
color: var(--text);
|
|
box-shadow: var(--shadow);
|
|
}
|
|
dialog::backdrop { background: rgba(2, 8, 12, 0.62); backdrop-filter: blur(3px); }
|
|
.dialog-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
|
|
dialog .field { margin-bottom: 14px; }
|
|
dialog menu { display: flex; justify-content: flex-end; gap: 8px; margin: 20px 0 0; padding: 0; }
|
|
.segmented { display: flex; gap: 4px; padding: 3px; border: 1px solid var(--line); border-radius: 10px; }
|
|
.segmented button { flex: 1; padding: 7px 8px; border: 0; border-radius: 7px; background: transparent; color: var(--muted); font-size: 0.78rem; }
|
|
.segmented button.active { background: rgba(69, 214, 176, 0.16); color: var(--text); }
|
|
|
|
@media (max-width: 1120px) {
|
|
.pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
|
}
|
|
|
|
@media (max-width: 820px) {
|
|
.app { grid-template-columns: 1fr; }
|
|
.sidebar { position: static; height: auto; border-right: 0; border-bottom: 1px solid var(--line); }
|
|
.nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
|
|
.side-foot { margin-top: 0; }
|
|
.main { padding-top: 26px; }
|
|
}
|
|
|
|
@media (max-width: 560px) {
|
|
.pillars { grid-template-columns: 1fr; }
|
|
.field-row { flex-direction: column; align-items: stretch; }
|
|
.notice { flex-direction: column; gap: 4px; }
|
|
.panel-head { flex-direction: column; }
|
|
.foot { flex-direction: column; }
|
|
}
|