/* ============================================================
   Tool Analytics: the parts the Hub shell and explorer do not have.
   Tables and sentences, no tiles. Tokens from sf-tokens.css.
   ============================================================ */

/* ---------- The data strip under the page head ---------- */
.au-strip {
  background: var(--sf-surface);
  border-bottom: 1.5px solid var(--sf-line);
}
.au-strip .sf-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sf-sp-3) var(--sf-sp-6);
  padding-top: var(--sf-sp-3);
  padding-bottom: var(--sf-sp-3);
}
.au-asof { font-size: 13.5px; color: var(--sf-ink-2); }
.au-asof strong { color: var(--sf-ink); font-weight: 600; }
.au-flag {
  display: inline-block;
  margin-right: 6px;
  padding: 1px 7px;
  font-family: var(--sf-font-mono);
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #6B4E00;
  background: #FFF4D1;
  border: 1.5px solid #F1D27A;
  border-radius: var(--sf-radius-sm);
}

.au-windows { display: flex; gap: 0; margin-left: auto; }
.au-windows a {
  padding: 5px 12px;
  font-size: 13px;
  font-weight: 500;
  color: var(--sf-ink-2);
  background: var(--sf-surface);
  border: 1.5px solid var(--sf-line);
  margin-left: -1.5px;
}
.au-windows a:first-child { border-radius: var(--sf-radius-sm) 0 0 var(--sf-radius-sm); margin-left: 0; }
.au-windows a:last-child { border-radius: 0 var(--sf-radius-sm) var(--sf-radius-sm) 0; }
.au-windows a:hover { background: var(--sf-sunk); color: var(--sf-ink); }
.au-windows a[aria-current] {
  position: relative;
  z-index: 1;
  color: #fff;
  background: var(--sf-teal-deep);
  border-color: var(--sf-teal-deep);
}
.au-windows a:focus-visible { outline: none; box-shadow: var(--sf-focus); position: relative; z-index: 2; }

/* ---------- Sections ---------- */
.au-section { margin-top: var(--sf-sp-8); }
.au-section:first-child { margin-top: 0; }
.au-section > h2, .au-h2 {
  font-family: var(--sf-font-display);
  font-weight: 600;
  font-size: 18px;
  letter-spacing: -0.01em;
  color: var(--sf-ink);
  margin-bottom: var(--sf-sp-2);
}
.au-section > .au-note { max-width: 80ch; margin-bottom: var(--sf-sp-4); font-size: 13.5px; line-height: 1.6; color: var(--sf-grey); }
.au-lede { max-width: 92ch; font-size: 15px; line-height: 1.7; color: var(--sf-ink); }
.au-lede + .au-lede { margin-top: var(--sf-sp-2); }
.au-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); gap: var(--sf-sp-6) var(--sf-sp-7); }
.au-cols .au-section { margin-top: 0; }
.au-cols + .au-section, .au-section + .au-cols { margin-top: var(--sf-sp-8); }

/* ---------- Small multiples ---------- */
.au-multiples {
  border: 1.5px solid var(--sf-line);
  border-radius: var(--sf-radius-md);
  background: var(--sf-surface);
}
.au-mrow {
  display: grid;
  grid-template-columns: minmax(130px, 200px) 1fr minmax(90px, 120px);
  align-items: center;
  gap: var(--sf-sp-4);
  padding: 6px var(--sf-sp-4);
  border-bottom: 1.5px solid var(--sf-line-soft);
}
.au-mrow:last-child { border-bottom: none; }
.au-mname { font-size: 14px; font-weight: 500; color: var(--sf-ink); }
.au-mname a { color: inherit; }
.au-mname a:hover { color: var(--sf-teal-deep); text-decoration: underline; text-underline-offset: 2px; }
.au-mtotal { text-align: right; font-size: 13.5px; font-variant-numeric: tabular-nums; color: var(--sf-ink); }
.au-mtotal span { display: block; font-size: 11.5px; color: var(--sf-grey); }
.au-maxis {
  display: grid;
  grid-template-columns: minmax(130px, 200px) 1fr minmax(90px, 120px);
  gap: var(--sf-sp-4);
  padding: 6px var(--sf-sp-4) 8px;
  font-size: 11.5px;
  color: var(--sf-grey);
  border-top: 1.5px solid var(--sf-line-soft);
}
.au-maxis > span:nth-child(2) { display: flex; justify-content: space-between; }

.au-spark { display: block; width: 100%; overflow: visible; }
.au-spark .au-base { stroke: var(--sf-line); stroke-width: 1; vector-effect: non-scaling-stroke; }
.au-spark .au-line { fill: none; stroke: var(--sf-teal-deep); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.au-spark .au-area { fill: var(--sf-teal); opacity: .10; }
.au-spark .au-hit { fill: transparent; cursor: crosshair; }
.au-spark .au-hit:hover { fill: rgba(15, 150, 143, .12); }

.au-chartbox {
  padding: var(--sf-sp-4);
  border: 1.5px solid var(--sf-line);
  border-radius: var(--sf-radius-md);
  background: var(--sf-surface);
}

.au-tip {
  position: fixed;
  z-index: 300;
  max-width: min(340px, calc(100vw - 16px));
  padding: 7px 10px;
  font-family: var(--sf-font-body);
  font-size: 12.5px;
  font-weight: 400;
  line-height: 1.45;
  letter-spacing: normal;
  text-transform: none;
  text-align: left;
  font-variant-numeric: tabular-nums;
  color: var(--sf-on-navy);
  background: var(--sf-navy);
  border-radius: var(--sf-radius-sm);
  box-shadow: 0 4px 14px rgba(14, 28, 34, 0.18);
  pointer-events: none;
}

/* The ⓘ: an explanation on hover or focus instead of a paragraph on the page. */
.au-i {
  display: inline-flex;
  align-items: center;
  margin-left: 5px;
  vertical-align: -2px;
  color: var(--sf-muted);
  cursor: help;
  border-radius: 50%;
}
.au-i:hover, .au-i:focus-visible { color: var(--sf-teal-deep); outline: none; }
.au-i:focus-visible { box-shadow: var(--sf-focus); }
.au-i--dark { color: rgba(234, 242, 242, .6); }
.au-i--dark:hover, .au-i--dark:focus-visible { color: var(--sf-on-navy); }
th .au-i { margin-left: 3px; vertical-align: -3px; }

/* ---------- The person x system matrix ---------- */
.au-matrix td.au-cell { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.au-matrix td.au-cell a { color: var(--sf-ink); }
.au-matrix td.au-cell a:hover { color: var(--sf-teal-deep); text-decoration: underline; text-underline-offset: 2px; }
.au-matrix td.au-empty { color: var(--sf-line); text-align: right; }
.au-matrix th.au-sys { text-align: right; }
.au-matrix .au-who a { color: var(--sf-ink); font-weight: 500; }
.au-matrix .au-who a:hover { color: var(--sf-teal-deep); text-decoration: underline; text-underline-offset: 2px; }
.au-who .ex-sub { white-space: nowrap; }
.au-total { font-weight: 600; }

.au-bar {
  display: inline-block;
  height: 6px;
  min-width: 2px;
  margin-left: 8px;
  vertical-align: middle;
  background: var(--sf-teal);
  border-radius: 0 3px 3px 0;
  opacity: .55;
}

.au-status { white-space: nowrap; font-size: 13px; }
.au-status::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 50%; vertical-align: 1px; }
.au-status--snapshot::before { background: #E0A800; }
.au-status--connected::before { background: var(--sf-teal); }
.au-status--not_connected::before { background: transparent; border: 1.5px solid var(--sf-grey); }

.au-ok { color: var(--sf-teal-deeper); }
.au-bad { color: var(--sf-restricted); font-weight: 500; }
.au-quote { font-size: 13.5px; color: var(--sf-ink); }
.au-muted { color: var(--sf-grey); font-size: 13px; }
.au-mono { font-family: var(--sf-font-mono); font-size: 12.5px; }

.au-pending { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 13.5px; color: var(--sf-ink-2); }

/* ---------- Sign-in ---------- */
.au-signin { min-height: 100vh; display: grid; place-items: center; padding: var(--sf-sp-6); background: var(--sf-navy); }
.au-signin-card {
  max-width: 520px;
  padding: var(--sf-sp-7);
  background: var(--sf-surface);
  border-radius: var(--sf-radius-lg);
  box-shadow: var(--sf-e3);
  border-top: 3px solid transparent;
  border-image: var(--sf-grad) 1;
}
.au-signin-card h1 { font-family: var(--sf-font-display); font-size: 22px; font-weight: 700; color: var(--sf-ink); margin: var(--sf-sp-2) 0 var(--sf-sp-3); }
.au-signin-card p { color: var(--sf-ink-2); line-height: 1.6; margin-bottom: var(--sf-sp-4); }
.au-kicker { font-family: var(--sf-font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--sf-muted); }
.au-btn {
  display: inline-block;
  padding: 9px 18px;
  font: inherit;
  font-weight: 500;
  font-size: 14px;
  color: #fff;
  background: var(--sf-teal-deep);
  border: 1.5px solid var(--sf-teal-deep);
  border-radius: var(--sf-radius-sm);
  cursor: pointer;
}
.au-btn:hover { background: var(--sf-teal-deeper); }
.au-btn:focus-visible { outline: none; box-shadow: var(--sf-focus); }
.au-btn--quiet { color: var(--sf-ink); background: var(--sf-surface); border-color: var(--sf-line); }
.au-btn--quiet:hover { background: var(--sf-sunk); }
.au-devlogin { display: flex; flex-wrap: wrap; gap: var(--sf-sp-3); align-items: center; padding-top: var(--sf-sp-4); border-top: 1.5px solid var(--sf-line-soft); }

.au-signout { margin: 0; }
.au-signout button {
  font: inherit;
  font-size: 13px;
  color: var(--sf-on-navy-dim, rgba(255,255,255,.7));
  background: none;
  border: 0;
  cursor: pointer;
  padding: 6px 8px;
  border-radius: var(--sf-radius-sm);
}
.au-signout button:hover { color: var(--sf-on-navy); }

@media (max-width: 700px) {
  .au-mrow, .au-maxis { grid-template-columns: 110px 1fr 70px; gap: var(--sf-sp-2); }
  .au-cols { grid-template-columns: 1fr; }
  .au-windows { margin-left: 0; }
}

/* Key/value tables (one row in full) */
.ex-table th.au-key {
  width: 1%;
  white-space: nowrap;
  text-align: left;
  vertical-align: top;
  padding: 7px var(--sf-sp-4);
  font-family: var(--sf-font-mono);
  font-size: 11.5px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--sf-grey);
  background: none;
  border-bottom: 1.5px solid var(--sf-line-soft);
}
.au-h2link { margin-left: var(--sf-sp-3); font-family: var(--sf-font-body); font-size: 13px; font-weight: 500; }
.au-pending .au-status { margin-right: var(--sf-sp-3); cursor: help; }
