/* Demerzel — application design system (tokens from the design brief). */
:root {
  --bg:#ffffff; --sidebar:#f7f7f5; --panel:#ffffff; --raised:#fbfaf7;
  --hover-row:#f7f6f3; --hover:#eceae6; --kbd:#edebe4; --chip:#efede7;
  --nav-active:#edebfb; --topbar:rgba(255,255,255,.82); --logo:#26241f;
  --track:#eeece7;
  --line05:rgba(15,15,15,.05); --line07:rgba(15,15,15,.07); --line08:rgba(15,15,15,.08);
  --line10:rgba(15,15,15,.10); --line14:rgba(15,15,15,.14); --line18:rgba(15,15,15,.18);
  --ink:#26241f; --ink2:#6b6560; --ink3:#9c968d; --faint:#a39d93; --faint2:#c1bbb1;
  --accent:#4b47c7; --accent-hover:#3733ad; --accent-bg:#eeedfb;
  --ok:#1e9e57; --ok-bg:#e6f4ec; --warn:#b0741a; --warn-bg:#f8efda;
  --crit:#ce4238; --crit-bg:#fbe7e4; --muted-bg:#f1efec;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:"SF Mono","JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
}
:root[data-theme="dark"] {
  --bg:#1a1a1a; --sidebar:#141414; --panel:#212121; --raised:#262625;
  --hover-row:#242423; --hover:#2e2e2c; --kbd:#333331; --chip:#2c2c2a;
  --nav-active:#2e2b46; --topbar:rgba(26,26,26,.82); --logo:#eceae5;
  --track:#333331;
  --line05:rgba(255,255,255,.055); --line07:rgba(255,255,255,.08); --line08:rgba(255,255,255,.10);
  --line10:rgba(255,255,255,.13); --line14:rgba(255,255,255,.17); --line18:rgba(255,255,255,.22);
  --ink:#eceae5; --ink2:#a8a29a; --ink3:#7e786f; --faint:#8a847b; --faint2:#5e5952;
  --accent:#8f8bee; --accent-hover:#a9a5f4; --accent-bg:#28253e;
  --ok:#54c48a; --ok-bg:rgba(64,175,112,.16); --warn:#d8a64c; --warn-bg:rgba(190,145,45,.17);
  --crit:#ee7c72; --crit-bg:rgba(214,84,74,.18); --muted-bg:rgba(255,255,255,.07);
}

* { box-sizing:border-box; }
html, body { height:100%; }
body {
  margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans);
  font-size:14px; -webkit-font-smoothing:antialiased;
  display:flex; height:100vh; overflow:hidden;
}
a { color:inherit; text-decoration:none; }
::selection { background:var(--accent-bg); }

/* Sidebar */
.sidebar {
  width:244px; flex:none; height:100vh; background:var(--sidebar);
  border-right:1px solid var(--line08); padding:12px 10px;
  display:flex; flex-direction:column; gap:2px;
}
.ws { display:flex; align-items:center; gap:9px; padding:6px 8px; }
.ws .mark { width:26px; height:26px; border-radius:7px; background:var(--logo);
  display:grid; place-items:center; flex:none; }
.ws .mark span { width:11px; height:11px; border:2px solid var(--bg); transform:rotate(45deg); }
.ws b { font-size:13.5px; font-weight:600; letter-spacing:-.01em; line-height:1.2; display:block; }
.ws small { font-size:11px; color:var(--ink3); }
.ws .chev { margin-left:auto; color:var(--ink3); }

.search {
  display:flex; align-items:center; gap:8px; width:100%; height:32px; margin-top:8px;
  background:var(--raised); border:1px solid var(--line10); border-radius:8px;
  padding:0 10px; color:var(--ink3); font-size:12.5px; cursor:pointer;
}
.search .kbd { margin-left:auto; font-family:var(--mono); font-size:10.5px;
  background:var(--kbd); border-radius:4px; padding:1px 5px; color:var(--ink2); }

nav.nav { margin-top:12px; display:flex; flex-direction:column; gap:1px; }
.nav a { display:flex; align-items:center; gap:10px; padding:6px 10px; border-radius:7px;
  font-size:13.5px; color:var(--ink2); }
.nav a svg { width:16px; height:16px; color:var(--ink3); flex:none; }
.nav a .count { margin-left:auto; font-family:var(--mono); font-size:10.5px; color:var(--ink3); }
.nav a:hover { background:var(--hover); color:var(--ink); }
.nav a.active { background:var(--nav-active); color:var(--ink); font-weight:600; }
.nav a.active svg { color:var(--accent); }

.userfoot { margin-top:auto; display:flex; align-items:center; gap:9px; padding:10px 8px 4px;
  border-top:1px solid var(--line08); }
.avatar { width:26px; height:26px; border-radius:50%; background:linear-gradient(135deg,#8A86E8,#5B57D6);
  color:#fff; font-size:11px; font-weight:600; display:grid; place-items:center; flex:none; }
.userfoot b { font-size:12.5px; font-weight:500; display:block; line-height:1.2; }
.userfoot small { font-size:10.5px; color:var(--ink3); }
.userfoot .dot { margin-left:auto; width:7px; height:7px; border-radius:50%; background:var(--ok); }

/* Main */
.main { flex:1; min-width:0; background:var(--bg); display:flex; flex-direction:column; }
.topbar { height:52px; flex:none; display:flex; align-items:center; gap:14px; padding:0 22px;
  border-bottom:1px solid var(--line07); background:var(--topbar); backdrop-filter:blur(8px); }
.crumb { font-size:13.5px; font-weight:500; }
.topbar .spacer { flex:1; }
.date { font-family:var(--mono); font-size:11.5px; color:var(--faint); }
.iconbtn { width:30px; height:30px; border:none; background:transparent; border-radius:7px;
  color:var(--ink2); display:grid; place-items:center; cursor:pointer; }
.iconbtn:hover { background:var(--kbd); color:var(--ink); }
.iconbtn svg { width:16px; height:16px; }
.divider { width:1px; height:18px; background:var(--line10); }
.newbtn { height:30px; padding:0 12px; background:var(--accent); color:#fff; border:none;
  border-radius:7px; font-size:12.5px; font-weight:500; display:flex; align-items:center; gap:6px;
  cursor:pointer; }
.newbtn:hover { background:var(--accent-hover); }

.content { flex:1; overflow:auto; padding:26px 34px 56px; }
.page { max-width:1180px; margin:0 auto; }
h1 { font-size:22px; font-weight:600; letter-spacing:-.025em; margin:0; }
.sub { font-size:12.5px; color:var(--ink3); margin-top:4px; }

/* Toolbar */
.toolbar { display:flex; align-items:center; gap:10px; margin:22px 0 14px; }
.filter { display:flex; align-items:center; gap:8px; height:34px; max-width:320px; flex:1;
  background:var(--panel); border:1px solid var(--line08); border-radius:8px; padding:0 12px; }
.filter svg { width:15px; height:15px; color:var(--ink3); flex:none; }
.filter input { border:none; background:transparent; outline:none; color:var(--ink); font-size:13px;
  width:100%; font-family:var(--sans); }
.filter input::placeholder { color:var(--ink3); }

/* Table */
.card { background:var(--panel); border:1px solid var(--line08); border-radius:12px; overflow:hidden;
  box-shadow:0 1px 2px rgba(0,0,0,.03); }
.tablewrap { overflow-x:auto; }
table.grid { width:100%; border-collapse:collapse; min-width:760px; font-size:12.5px; }
.grid thead th { text-align:left; height:38px; padding:0 16px; background:var(--raised);
  border-bottom:1px solid var(--line08); font-size:11px; font-weight:500; color:var(--ink3);
  white-space:nowrap; }
.grid tbody td { height:52px; padding:0 16px; border-bottom:1px solid var(--line05);
  vertical-align:middle; color:var(--ink2); }
.grid tbody tr:last-child td { border-bottom:none; }
.grid tbody tr:hover { background:var(--hover-row); }
.name { display:flex; flex-direction:column; gap:2px; }
.name b { font-size:12.5px; font-weight:500; color:var(--ink); }
.name .ip { font-family:var(--mono); font-size:10.5px; color:var(--faint); }
.mono { font-family:var(--mono); }
.dim { color:var(--faint); }

.pill { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:500;
  padding:2px 9px; border-radius:20px; }
.pill.observed { color:var(--ok); background:var(--ok-bg); }
.pill.unknown { color:var(--warn); background:var(--warn-bg); }
.pill.stale { color:var(--warn); background:var(--warn-bg); }
.pill.retired, .pill.deleted { color:var(--ink3); background:var(--muted-bg); }
.pill .d { width:6px; height:6px; border-radius:50%; background:currentColor; }

.empty { padding:56px 20px; text-align:center; color:var(--ink3); }
.empty b { color:var(--ink2); display:block; font-size:14px; margin-bottom:4px; }
.empty code { font-family:var(--mono); font-size:12px; background:var(--muted-bg);
  padding:2px 6px; border-radius:5px; color:var(--ink); }

.htmx-indicator { opacity:0; transition:opacity .15s; }
.htmx-request .htmx-indicator { opacity:1; }

/* Breadcrumb links */
.crumb-link { color:var(--ink2); }
.crumb-link:hover { color:var(--ink); }
.crumb-sep { color:var(--faint2); margin:0 4px; }

/* Clickable table rows */
.grid tbody tr.clickable { cursor:pointer; }

/* Server detail */
.srv-head { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.srv-head h1 { font-size:23px; font-weight:600; letter-spacing:-.02em; }
.srv-head .pill .d { margin:0; }
.srv-meta { font-size:12.5px; color:var(--ink3); margin-left:2px; }

.tabs { display:flex; gap:2px; margin:22px 0 20px; border-bottom:1px solid var(--line08);
  overflow-x:auto; }
.tab { padding:8px 12px; font-size:13px; color:var(--faint); border-bottom:2px solid transparent;
  margin-bottom:-1px; white-space:nowrap; }
.tab:hover { color:var(--ink); }
.tab.active { color:var(--ink); font-weight:600; border-bottom-color:var(--accent); }

.grid2 { display:grid; grid-template-columns:1.5fr 1fr; gap:16px; }
@media (max-width:900px) { .grid2 { grid-template-columns:1fr; } }
.card.pad { padding:20px 22px; }
.card-title { font-size:14px; font-weight:600; margin-bottom:16px; }

.kv { display:grid; grid-template-columns:auto 1fr; gap:9px 20px; align-items:baseline; }
.kv .k { font-size:11px; color:var(--ink3); white-space:nowrap; }
.kv .v { font-size:12.5px; color:var(--ink); word-break:break-all; }

.activity { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:14px; }
.activity li { display:flex; gap:11px; }
.a-dot { width:7px; height:7px; border-radius:50%; background:var(--accent); margin-top:5px; flex:none; }
.a-text { font-size:12.5px; }
.a-time { font-size:11px; color:var(--ink3); margin-top:2px; }
.activity-empty { font-size:12.5px; color:var(--ink3); }

/* Monitoring */
[x-cloak] { display:none !important; }
:root { --teal:#3a9e7a; }
:root[data-theme="dark"] { --teal:#54c099; }

.metric-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; }
.metric-card { background:var(--panel); border:1px solid var(--line08); border-radius:12px;
  padding:16px 18px; box-shadow:0 1px 2px rgba(0,0,0,.03); }
.metric-head { display:flex; align-items:center; justify-content:space-between; }
.metric-label { font-size:12.5px; color:var(--ink2); font-weight:500; }
.trend { font-family:var(--mono); font-size:10.5px; color:var(--ink3); }
.trend.high { color:var(--warn); }
.metric-value { font-size:24px; font-weight:600; letter-spacing:-.03em; margin:8px 0 12px; }
.metric-unit { font-family:var(--mono); font-size:12px; color:var(--ink3); font-weight:400; margin-left:2px;
  letter-spacing:0; }
.spark { display:flex; align-items:flex-end; gap:2px; height:38px; }
.spark .bar { flex:1; border-radius:1px; background:var(--track); min-height:2px; }

/* Health score */
.hchip { font-family:var(--mono); font-size:11.5px; font-weight:500; padding:2px 8px; border-radius:6px; }
.hchip.healthy { color:var(--ok); background:var(--ok-bg); }
.hchip.warning { color:var(--warn); background:var(--warn-bg); }
.hchip.critical { color:var(--crit); background:var(--crit-bg); }
.hchip.unknown { color:var(--ink3); background:var(--muted-bg); }
.hcov { font-size:10px; color:var(--ink3); margin-left:6px; }

.srv-health { margin-left:auto; display:flex; align-items:center; gap:11px; }
.donut { flex:none; }
.donut-num { font-family:var(--mono); font-weight:600; font-size:13px; fill:var(--ink); }
.srv-health-label b { font-size:12.5px; display:block; line-height:1.3; }
.srv-health-label small { font-size:10.5px; color:var(--ink3); }

/* Software & updates */
.sw-stats { display:flex; flex-wrap:wrap; gap:34px; }
.sw-stat { display:flex; flex-direction:column; gap:3px; }
.sw-num { font-size:22px; font-weight:600; letter-spacing:-.02em; }
.sw-num.is-warn { color:var(--warn); }
.sw-num.is-crit { color:var(--crit); }
.sw-lbl { font-size:11px; color:var(--ink3); }

/* Dashboard */
.greeting-sub { font-size:12.5px; color:var(--ink3); }
.greeting h1 { margin-top:6px; }
.dash-row1 { display:grid; grid-template-columns:1.55fr 1fr; gap:16px; margin:24px 0 16px; }
@media (max-width:900px) { .dash-row1 { grid-template-columns:1fr; } }

.health-card { display:flex; align-items:center; gap:24px; }
.donut-lg { flex:none; }
.donut-lg-num { font-family:var(--mono); font-weight:600; font-size:30px; fill:var(--ink); }
.donut-lg-sub { font-family:var(--mono); font-size:11px; fill:var(--ink3); }
.health-detail { flex:1; min-width:0; }
.health-note { font-size:12.5px; color:var(--ink2); margin:2px 0 14px; }
.factors { display:grid; grid-template-columns:1fr 1fr; gap:12px 22px; }
.factor { display:grid; grid-template-columns:1fr auto; gap:5px 8px; align-items:center; }
.factor-label { font-size:11.5px; color:var(--ink2); }
.factor-val { font-size:11.5px; text-align:right; }
.factor-track { grid-column:1 / -1; height:4px; background:var(--track); border-radius:2px; overflow:hidden; }
.factor-fill { display:block; height:100%; border-radius:2px; }

.stat-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.stat-card { background:var(--panel); border:1px solid var(--line08); border-radius:12px; padding:14px 15px;
  display:flex; flex-direction:column; gap:2px; box-shadow:0 1px 2px rgba(0,0,0,.03); }
a.stat-card { transition:border-color .12s, transform .12s; }
a.stat-card:hover { border-color:var(--line18); transform:translateY(-1px); }
.stat-label { font-size:12px; color:var(--ink2); }
.stat-value { font-size:26px; font-weight:600; letter-spacing:-.03em; }
.stat-sub { font-size:11.5px; }

.actions-head { display:flex; align-items:center; gap:10px; padding:16px 20px; border-bottom:1px solid var(--line07); }
.count-badge { font-family:var(--mono); font-size:11px; font-weight:500; color:var(--crit); background:var(--crit-bg);
  border-radius:20px; padding:1px 8px; }
.actions-hint { margin-left:auto; font-size:12px; color:var(--ink3); }
.action-row { display:flex; align-items:center; gap:12px; padding:13px 20px; border-bottom:1px solid var(--line05); }
.action-row:last-child { border-bottom:none; }
.action-row:hover { background:var(--hover-row); }
.sev-dot { width:8px; height:8px; border-radius:50%; flex:none; }
.sev-dot.critical { background:var(--crit); box-shadow:0 0 0 3px var(--crit-bg); }
.sev-dot.warning { background:var(--warn); box-shadow:0 0 0 3px var(--warn-bg); }
.action-title { font-size:13px; font-weight:500; color:var(--ink); }
.action-meta { font-size:11.5px; color:var(--ink3); margin-top:2px; }
.dot-sep { color:var(--faint2); margin:0 4px; }

/* Action rows (dismiss) */
.action-body { flex:1; min-width:0; }
.action-body:hover .action-title { color:var(--accent); }
.occ { font-size:10.5px; color:var(--ink3); margin-left:4px; }
.dismiss { flex:none; width:26px; height:26px; border:none; background:transparent; color:var(--ink3);
  border-radius:6px; cursor:pointer; font-size:13px; line-height:1; }
.dismiss:hover { background:var(--kbd); color:var(--ink); }

/* Tab badge */
.tab-badge { font-family:var(--mono); font-size:10px; color:var(--ink3); background:var(--muted-bg);
  border-radius:10px; padding:0 5px; margin-left:2px; }

/* Failed service units */
.failed-units { display:flex; flex-wrap:wrap; gap:6px; margin-top:14px; }
.unit-chip { font-family:var(--mono); font-size:11px; color:var(--crit); background:var(--crit-bg);
  border-radius:6px; padding:2px 8px; }

/* Vulnerability tab badge + high severity */
.tab-badge.crit { color:var(--crit); background:var(--crit-bg); }
:root { --sev-high:#d9662b; }
:root[data-theme="dark"] { --sev-high:#e5844f; }

/* Action controls (acknowledge / snooze / dismiss) */
.action-ctrls { display:flex; align-items:center; gap:2px; flex:none; }
.act-btn { width:26px; height:26px; border:none; background:transparent; color:var(--ink3);
  border-radius:6px; cursor:pointer; font-size:12px; line-height:1; display:grid; place-items:center; }
.act-btn:hover { background:var(--kbd); color:var(--ink); }
.acked { width:26px; height:26px; display:grid; place-items:center; color:var(--ok); font-size:13px; }
.action-row.is-acked { opacity:.7; }
.snooze-wrap { position:relative; }
.snooze-menu { position:absolute; right:0; top:30px; z-index:10; background:var(--panel);
  border:1px solid var(--line10); border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,.18);
  padding:4px; display:flex; flex-direction:column; min-width:112px; }
.snooze-menu button { text-align:left; border:none; background:transparent; color:var(--ink2);
  font-size:12.5px; padding:6px 10px; border-radius:6px; cursor:pointer; font-family:var(--sans); }
.snooze-menu button:hover { background:var(--hover); color:var(--ink); }
.resolved-card { margin-top:16px; padding:14px 20px; }
.resolved-head { font-size:12px; color:var(--ink3); font-weight:500; margin-bottom:10px; }
.resolved-row { display:flex; align-items:center; gap:10px; padding:5px 0; font-size:12.5px; }
.resolved-check { color:var(--ok); }
.resolved-title { color:var(--ink2); }

/* Provenance conflict badge */
.conflict-badge { color:var(--crit); background:var(--crit-bg); border-radius:5px; padding:0 5px;
  font-size:9.5px; font-weight:500; margin-left:4px; text-transform:uppercase; letter-spacing:.04em; }

/* ── Authentication screens ─────────────────────────────────────────────── */
.auth-body { display:flex; align-items:center; justify-content:center; overflow:auto; padding:32px 20px; }
.auth-wrap { width:100%; max-width:400px; display:flex; flex-direction:column; align-items:center; gap:16px; }
.auth-card { width:100%; background:var(--panel); border:1px solid var(--line08); border-radius:14px;
  padding:30px 30px 26px; box-shadow:0 1px 2px var(--line05), 0 8px 30px var(--line05); }
.auth-brand { display:flex; align-items:center; gap:9px; margin-bottom:22px; }
.auth-brand .mark { width:26px; height:26px; border-radius:7px; background:var(--logo);
  display:grid; place-items:center; flex:none; }
.auth-brand .mark span { width:11px; height:11px; border:2px solid var(--bg); transform:rotate(45deg); }
.auth-brand b { font-size:15px; font-weight:600; letter-spacing:-.01em; }
.auth-title { font-size:20px; font-weight:600; letter-spacing:-.02em; margin:0 0 6px; }
.auth-sub { font-size:13px; color:var(--ink2); margin:0 0 20px; line-height:1.5; }
.auth-form { display:flex; flex-direction:column; gap:6px; }
.auth-label { font-size:12px; font-weight:500; color:var(--ink2); margin-top:8px; }
.auth-input { width:100%; height:40px; background:var(--raised); border:1px solid var(--line14);
  border-radius:9px; padding:0 12px; color:var(--ink); font-size:14px; font-family:var(--sans);
  transition:border-color .12s, box-shadow .12s; }
.auth-input:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-bg); }
.auth-code { font-family:var(--mono); font-size:22px; letter-spacing:.12em; text-align:center; height:52px; }
.otp { display:flex; align-items:center; gap:8px; margin-top:2px; }
.otp-box { width:100%; height:54px; min-width:0; flex:1; background:var(--raised); border:1px solid var(--line14);
  border-radius:10px; text-align:center; font-family:var(--mono); font-size:24px; font-weight:500; color:var(--ink);
  transition:border-color .12s, box-shadow .12s; }
.otp-box:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-bg); }
.otp-dash { color:var(--ink3); font-size:20px; flex:none; }
.auth-btn { margin-top:16px; height:40px; background:var(--accent); color:#fff; border:none;
  border-radius:9px; font-size:14px; font-weight:500; cursor:pointer; transition:background .12s; }
.auth-btn:hover { background:var(--accent-hover); }
.auth-alt { font-size:13px; color:var(--ink2); margin:18px 0 0; text-align:center; }
.auth-alt a { color:var(--accent); font-weight:500; }
.auth-alt-link { display:block; text-align:center; margin-top:16px; font-size:13px; color:var(--ink3); }
.auth-devnote { margin:16px 0 0; padding-top:14px; border-top:1px solid var(--line07);
  font-size:12px; color:var(--ink3); text-align:center; }
.auth-devnote a { color:var(--accent); }
.auth-foot { font-size:12px; color:var(--ink3); text-align:center; margin:0; }

/* Social sign-in buttons */
.auth-or { display:flex; align-items:center; gap:12px; margin:20px 0; color:var(--ink3); font-size:12px; }
.auth-or::before, .auth-or::after { content:""; flex:1; height:1px; background:var(--line08); }
.auth-social { display:flex; flex-direction:column; gap:8px; }
.auth-social a { display:flex; align-items:center; justify-content:center; gap:9px; height:40px;
  background:var(--raised); border:1px solid var(--line14); border-radius:9px; color:var(--ink);
  font-size:13.5px; font-weight:500; transition:background .12s, border-color .12s; }
.auth-social a:hover { background:var(--hover); border-color:var(--line18); }
.auth-social svg { width:17px; height:17px; flex:none; }

/* Dev mailbox */
.devmail-list { display:flex; flex-direction:column; gap:12px; }
.devmail { border:1px solid var(--line08); border-radius:10px; padding:12px 14px; background:var(--raised); }
.devmail-head { display:flex; justify-content:space-between; font-size:11.5px; color:var(--ink3); }
.devmail-subj { font-size:13px; font-weight:600; margin:4px 0 6px; }
.devmail-body { font-family:var(--mono); font-size:12px; color:var(--ink2); white-space:pre-wrap;
  margin:0; line-height:1.5; }

/* ── Sidebar: org switcher + user menu ──────────────────────────────────── */
[x-cloak] { display:none !important; }
.ws-wrap { position:relative; }
.ws { display:flex; align-items:center; gap:9px; padding:6px 8px; width:100%;
  background:none; border:none; cursor:pointer; border-radius:8px; text-align:left; color:inherit; }
.ws:hover { background:var(--hover); }
.ws .ws-text { min-width:0; }
.ws b { font-size:13.5px; font-weight:600; letter-spacing:-.01em; line-height:1.2; display:block; }
.ws small { font-size:11px; color:var(--ink3); display:block; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; max-width:150px; }
.ws .chev { margin-left:auto; color:var(--ink3); flex:none; width:16px; height:16px; }
.ws-menu, .user-menu { position:absolute; z-index:40; background:var(--panel);
  border:1px solid var(--line10); border-radius:10px; padding:5px;
  box-shadow:0 8px 30px var(--line10), 0 2px 8px var(--line07); }
.ws-menu { top:calc(100% + 4px); left:4px; right:4px; }
.ws-menu-label { font-size:10.5px; text-transform:uppercase; letter-spacing:.05em;
  color:var(--ink3); padding:6px 8px 4px; }
.ws-org { display:flex; align-items:center; gap:8px; width:100%; padding:7px 8px;
  border-radius:7px; font-size:13px; color:var(--ink); background:none; border:none;
  cursor:pointer; text-align:left; }
.ws-org:hover { background:var(--hover); }
.ws-org.active { background:var(--nav-active); }
.ws-org-name { font-weight:500; }
.ws-org-role { margin-left:auto; font-size:10.5px; color:var(--ink3); }
.ws-org-check { color:var(--accent); font-weight:600; }
.ws-menu-item, .user-menu-item { display:flex; align-items:center; gap:8px; width:100%;
  padding:7px 8px; border-radius:7px; font-size:13px; color:var(--ink2); background:none;
  border:none; cursor:pointer; text-align:left; }
.ws-menu-item:hover, .user-menu-item:hover { background:var(--hover); color:var(--ink); }
.ws-menu-item { margin-top:3px; border-top:1px solid var(--line07); padding-top:9px; border-radius:0 0 7px 7px; }

.userfoot { margin-top:auto; position:relative; padding:6px 0 2px; border-top:1px solid var(--line08); }
.userfoot-btn { display:flex; align-items:center; gap:9px; width:100%; padding:8px;
  background:none; border:none; cursor:pointer; border-radius:8px; text-align:left; color:inherit; }
.userfoot-btn:hover { background:var(--hover); }
.userfoot-text { min-width:0; }
.userfoot b { font-size:12.5px; font-weight:500; display:block; line-height:1.2; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; max-width:130px; }
.userfoot small { font-size:10.5px; color:var(--ink3); }
.userfoot .dot { margin-left:auto; width:7px; height:7px; border-radius:50%; background:var(--ok); flex:none; }
.user-menu { bottom:calc(100% + 4px); left:4px; right:4px; }
.user-menu-email { font-size:11.5px; color:var(--ink3); padding:6px 8px; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; }
.user-menu-item { color:var(--crit); }

/* ── Team / members page ────────────────────────────────────────────────── */
.section-h { font-size:13px; font-weight:600; color:var(--ink2); margin:6px 0 0; }
.ta-right { text-align:right; }
.invite-form { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.invite-email { flex:1; min-width:200px; height:38px; background:var(--raised);
  border:1px solid var(--line14); border-radius:8px; padding:0 12px; color:var(--ink);
  font-size:13.5px; font-family:var(--sans); }
.invite-email:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-bg); }
.invite-role, .role-select { height:38px; background:var(--raised); border:1px solid var(--line14);
  border-radius:8px; padding:0 8px; color:var(--ink); font-size:13px; font-family:var(--sans); cursor:pointer; }
.invite-btn { height:38px; padding:0 16px; background:var(--accent); color:#fff; border:none;
  border-radius:8px; font-size:13.5px; font-weight:500; cursor:pointer; }
.invite-btn:hover { background:var(--accent-hover); }
.inline-form { margin:0; }
.member-cell { display:flex; align-items:center; gap:10px; }
.member-avatar { width:30px; height:30px; border-radius:50%; flex:none;
  background:linear-gradient(135deg,#8A86E8,#5B57D6); color:#fff; font-size:11px; font-weight:600;
  display:grid; place-items:center; }
.you-tag { font-size:10px; font-weight:500; color:var(--ink3); background:var(--chip);
  border-radius:4px; padding:1px 5px; margin-left:2px; }
.pill.role-owner { color:var(--accent); background:var(--accent-bg); }
.pill.role-admin { color:var(--ink); background:var(--chip); }
.pill.role-readonly { color:var(--ink3); background:var(--muted-bg); }
.link-danger { color:var(--crit); font-size:12.5px; font-weight:500; }
.link-danger:hover { text-decoration:underline; }
.danger-card { border-color:var(--crit-bg); }
.danger-row { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.danger-row b { display:block; font-size:13.5px; }
.btn-danger { height:36px; padding:0 14px; background:var(--crit-bg); color:var(--crit); border:1px solid var(--crit);
  border-radius:8px; font-size:13px; font-weight:500; cursor:pointer; white-space:nowrap; }
.btn-danger:hover { background:var(--crit); color:#fff; }
.danger-confirm { margin-top:14px; padding-top:14px; border-top:1px solid var(--line08); }
.danger-confirm-row { display:flex; gap:10px; margin-top:6px; }

/* Notification channels */
.chan-form { display:flex; flex-direction:column; gap:2px; max-width:520px; }
.chan-form-row { display:flex; flex-direction:column; gap:4px; margin-bottom:10px; }
.chan-form .invite-btn { align-self:flex-start; margin-top:4px; }
.chan-actions { display:flex; gap:14px; justify-content:flex-end; align-items:center; }
.link-muted { color:var(--ink2); font-size:12.5px; font-weight:500; }
.link-muted:hover { color:var(--ink); text-decoration:underline; }
.pill-btn { border:none; cursor:pointer; border-radius:20px; padding:2px 10px; font-size:11px;
  font-weight:500; font-family:var(--sans); }
.pill-btn.on { color:var(--ok); background:var(--ok-bg); }
.pill-btn.off { color:var(--ink3); background:var(--muted-bg); }
.page-head-row { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.pill.st-sent { color:var(--ok); background:var(--ok-bg); }
.pill.st-pending { color:var(--warn); background:var(--warn-bg); }
.pill.st-failed { color:var(--crit); background:var(--crit-bg); }

/* Agents page */
.add-agent { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.add-agent b { display:block; font-size:13.5px; }
.token-card { border:1px solid var(--accent); background:var(--accent-bg); }
.token-head b { display:block; font-size:14px; }
.token-value { display:flex; align-items:center; gap:12px; margin:12px 0; }
.token-value code { font-family:var(--mono); font-size:15px; background:var(--panel); border:1px solid var(--line10);
  border-radius:8px; padding:9px 13px; letter-spacing:.02em; word-break:break-all; flex:1; }
.token-cmd { padding-top:12px; border-top:1px solid var(--line10); }
.token-cmd pre { background:var(--panel); border:1px solid var(--line08); border-radius:9px; padding:11px 13px;
  overflow-x:auto; margin:6px 0; }
.token-cmd code { font-family:var(--mono); font-size:12.5px; color:var(--ink); }