/* ==========================================================
   ASTRAAL MNEMOS(TM) - Brand System
   Palette: Emerald Green / Aqua Blue / White / Silver-Grey
   ========================================================== */

:root {
  --mnemos-emerald: #0B6E4F;
  --mnemos-emerald-dark: #084F39;
  --mnemos-emerald-light: #E4F3EC;
  --mnemos-aqua: #17B6C4;
  --mnemos-aqua-dark: #0E8E9A;
  --mnemos-aqua-light: #E3F8FA;
  --mnemos-white: #FFFFFF;
  --mnemos-silver: #C9D1D9;
  --mnemos-grey: #6B7480;
  --mnemos-grey-dark: #3C4552;
  --mnemos-bg: #F5F8F8;
  --mnemos-border: #E1E7E9;
  --mnemos-danger: #C4453C;
  --mnemos-warning: #C88A1E;
  --mnemos-success: #0B6E4F;
  --sidebar-w: 250px;
}

* { box-sizing: border-box; }

body {
  background: var(--mnemos-bg);
  font-family: 'Segoe UI', -apple-system, BlinkMacSystemFont, Roboto, Arial, sans-serif;
  color: var(--mnemos-grey-dark);
  font-size: 14.5px;
}

a { color: var(--mnemos-aqua-dark); text-decoration: none; }
a:hover { color: var(--mnemos-emerald); }

/* ---------- Layout shell ---------- */
.mnemos-shell { display: flex; min-height: 100vh; }

.mnemos-sidebar {
  width: var(--sidebar-w);
  background: linear-gradient(180deg, var(--mnemos-emerald-dark) 0%, var(--mnemos-emerald) 100%);
  color: #EAF6F0;
  flex-shrink: 0;
  position: fixed;
  top: 0; bottom: 0; left: 0;
  overflow-y: auto;
}

.mnemos-sidebar .brand {
  padding: 22px 20px 18px;
  border-bottom: 1px solid rgba(255,255,255,0.15);
}
.mnemos-sidebar .brand .brand-name {
  font-size: 20px; font-weight: 700; color: #fff; letter-spacing: .5px;
}
.mnemos-sidebar .brand .brand-kicker {
  font-size: 11px; color: var(--mnemos-aqua-light); text-transform: uppercase; letter-spacing: 1.2px; margin-top: 2px;
}

.mnemos-nav { padding: 14px 0; }
.mnemos-nav .nav-section-label {
  font-size: 10.5px; text-transform: uppercase; letter-spacing: 1px;
  color: rgba(234,246,240,0.55); padding: 14px 20px 6px;
}
.mnemos-nav a.nav-link {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 20px; color: #DCEFE7; font-size: 13.8px; border-left: 3px solid transparent;
}
.mnemos-nav a.nav-link:hover { background: rgba(255,255,255,0.08); color: #fff; }
.mnemos-nav a.nav-link.active {
  background: rgba(23,182,196,0.18); color: #fff; border-left-color: var(--mnemos-aqua);
  font-weight: 600;
}
.mnemos-nav a.nav-link .badge-count {
  margin-left: auto; background: var(--mnemos-aqua); color: #06333a; font-size: 11px; padding: 1px 7px; border-radius: 20px; font-weight: 700;
}

.mnemos-main { margin-left: var(--sidebar-w); flex: 1; min-width: 0; }

.mnemos-topbar {
  background: #fff; border-bottom: 1px solid var(--mnemos-border);
  padding: 14px 26px; display: flex; align-items: center; justify-content: space-between;
  position: sticky; top: 0; z-index: 20;
}
.mnemos-topbar h1 { font-size: 19px; font-weight: 700; color: var(--mnemos-grey-dark); margin: 0; }
.mnemos-topbar .page-kicker { font-size: 12px; color: var(--mnemos-grey); text-transform: uppercase; letter-spacing: .8px; }

.mnemos-content { padding: 24px 26px 60px; }

.user-chip {
  display: flex; align-items: center; gap: 10px; font-size: 13px;
}
.user-chip .avatar {
  width: 34px; height: 34px; border-radius: 50%;
  background: linear-gradient(135deg, var(--mnemos-emerald), var(--mnemos-aqua));
  color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px;
}
.user-chip .role-tag { font-size: 11px; color: var(--mnemos-grey); }

/* ---------- Cards ---------- */
.mn-card {
  background: #fff; border: 1px solid var(--mnemos-border); border-radius: 10px;
  padding: 20px; margin-bottom: 20px;
}
.mn-card h2, .mn-card h3 { color: var(--mnemos-emerald-dark); }
.mn-card-header {
  display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px;
}
.mn-card-header h3 { font-size: 15.5px; margin: 0; font-weight: 700; }

.stat-card {
  background: #fff; border: 1px solid var(--mnemos-border); border-radius: 10px; padding: 18px;
  border-top: 3px solid var(--mnemos-aqua);
}
.stat-card .stat-value { font-size: 26px; font-weight: 800; color: var(--mnemos-emerald-dark); }
.stat-card .stat-label { font-size: 12px; color: var(--mnemos-grey); text-transform: uppercase; letter-spacing: .5px; }
.stat-card.accent-emerald { border-top-color: var(--mnemos-emerald); }
.stat-card.accent-warning { border-top-color: var(--mnemos-warning); }
.stat-card.accent-danger { border-top-color: var(--mnemos-danger); }

/* ---------- Buttons ---------- */
.btn-mnemos {
  background: var(--mnemos-emerald); border-color: var(--mnemos-emerald); color: #fff;
}
.btn-mnemos:hover { background: var(--mnemos-emerald-dark); border-color: var(--mnemos-emerald-dark); color: #fff; }
.btn-mnemos-aqua { background: var(--mnemos-aqua); border-color: var(--mnemos-aqua); color: #06333a; font-weight: 600; }
.btn-mnemos-aqua:hover { background: var(--mnemos-aqua-dark); border-color: var(--mnemos-aqua-dark); color: #fff; }
.btn-outline-mnemos { border: 1px solid var(--mnemos-emerald); color: var(--mnemos-emerald); background: #fff; }
.btn-outline-mnemos:hover { background: var(--mnemos-emerald-light); }

/* ---------- Badges / tiers / status ---------- */
.badge-tier { font-size: 10.5px; font-weight: 700; padding: 3px 9px; border-radius: 20px; text-transform: uppercase; letter-spacing: .4px; }
.tier-public { background: #E4F3EC; color: var(--mnemos-emerald-dark); }
.tier-internal { background: #E3F8FA; color: var(--mnemos-aqua-dark); }
.tier-restricted { background: #FCEFDD; color: #A2650F; }
.tier-confidential { background: #FBE7E5; color: var(--mnemos-danger); }

.badge-status { font-size: 10.5px; font-weight: 700; padding: 3px 9px; border-radius: 20px; text-transform: uppercase; letter-spacing: .3px; }
.status-published { background: #E4F3EC; color: var(--mnemos-emerald-dark); }
.status-draft { background: #EEF1F3; color: var(--mnemos-grey-dark); }
.status-conflict_flagged { background: #FBE7E5; color: var(--mnemos-danger); }
.status-deprecated { background: #ECECEC; color: #888; }
.status-stale { background: #FCEFDD; color: #A2650F; }
.status-open { background: #FBE7E5; color: var(--mnemos-danger); }
.status-resolved, .status-acknowledged, .status-completed, .status-synthesized, .status-closed { background: #E4F3EC; color: var(--mnemos-emerald-dark); }
.status-pending, .status-scheduled, .status-in_progress, .status-pending_classification, .status-in_synthesis, .status-assigned { background: #FCEFDD; color: #A2650F; }
.status-conflicting { background: #FBE7E5; color: var(--mnemos-danger); }
.status-active { background: #E3F8FA; color: var(--mnemos-aqua-dark); }
.status-ended, .status-inactive, .status-rejected { background: #ECECEC; color: #888; }

/* ---------- Tables ---------- */
.table-mnemos thead th {
  background: var(--mnemos-emerald-light); color: var(--mnemos-emerald-dark);
  font-size: 12px; text-transform: uppercase; letter-spacing: .4px; border-bottom: none;
  font-weight: 700;
}
.table-mnemos td { vertical-align: middle; font-size: 13.5px; }
.table-mnemos tbody tr:hover { background: #FAFDFC; }

/* ---------- Login page ---------- */
.login-wrap {
  min-height: 100vh; display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--mnemos-emerald-dark) 0%, var(--mnemos-emerald) 45%, var(--mnemos-aqua-dark) 100%);
}
.login-card {
  background: #fff; border-radius: 14px; padding: 40px; width: 100%; max-width: 420px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.25);
}
.login-card .brand-lockup { text-align: center; margin-bottom: 24px; }
.login-card .brand-lockup .m-name { font-size: 26px; font-weight: 800; color: var(--mnemos-emerald-dark); }
.login-card .brand-lockup .m-kicker { font-size: 12px; color: var(--mnemos-grey); text-transform: uppercase; letter-spacing: 1.4px; }
.demo-creds {
  background: var(--mnemos-aqua-light); border: 1px solid #BEEBEF; border-radius: 8px; padding: 12px 14px; font-size: 12px; margin-top: 18px;
}
.demo-creds code { color: var(--mnemos-emerald-dark); }

/* ---------- Misc ---------- */
.mn-divider { border: none; border-top: 1px solid var(--mnemos-border); margin: 18px 0; }
.text-mnemos-grey { color: var(--mnemos-grey); }
.provenance-box {
  background: #FAFAFA; border-left: 3px solid var(--mnemos-aqua); padding: 10px 14px; font-size: 12.5px; color: var(--mnemos-grey-dark);
}
.trace-link { font-size: 12px; color: var(--mnemos-aqua-dark); }
.kicker-label { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: var(--mnemos-grey); }

.workflow-step {
  display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px dashed var(--mnemos-border);
}
.workflow-step .step-num {
  width: 26px; height: 26px; border-radius: 50%; background: var(--mnemos-emerald-light); color: var(--mnemos-emerald-dark);
  display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 12px; flex-shrink: 0;
}

.empty-state { text-align: center; padding: 40px 20px; color: var(--mnemos-grey); }

@media (max-width: 900px) {
  .mnemos-sidebar { transform: translateX(-100%); transition: transform .2s; z-index: 40; }
  .mnemos-sidebar.open { transform: translateX(0); }
  .mnemos-main { margin-left: 0; }
}