/* Intel's own styles: only what the house shell does not already provide.
   The shell gives us .signin, .field, .hint, .links, .section, .sheet, .btn and
   the --sh-* tokens. Everything here is the reading surface, which is the one
   thing Intel does that no other tool does.

   Nothing in here sets a colour by hand. Intel's lime comes from brand-intel.css
   through --sh-accent, so retinting the tool is still a one-line pack change.

   House style: UK English, no em dashes. */

/* ---------- sign-in extras ---------- */
/* The eyebrow is in the brand-packs sign-in reference but not in shell.css. */
.signin__eyebrow {
  font-family: var(--sh-mono);
  font-size: 11px; letter-spacing: .16em; text-transform: uppercase;
  color: var(--sh-accent-2); margin-bottom: 10px;
}
.signin .gate-status { font-size: 12.5px; color: var(--sh-muted); margin: 14px 0 0; min-height: 1.2em; }
.signin .gate-status.is-err { color: #f0866f; }
.signin .gate-foot { margin: 26px 0 0; font-size: 12px; color: var(--sh-faint); }
.signin .gate-foot a { color: var(--sh-faint); text-decoration: none; }
.signin .gate-foot a:hover { color: var(--sh-accent-2); }

/* ---------- page furniture ---------- */
.stamp {
  font-family: var(--sh-mono); font-size: 11px; color: var(--sh-faint);
  white-space: nowrap; padding-top: 6px;
}
.lede {
  color: var(--sh-muted); font-size: 15px; line-height: 1.6;
  max-width: 68ch; margin: 0 0 20px;
}
.loading { color: var(--sh-faint); font-size: 13.5px; }
.loading.is-err { color: #f0866f; }
.sidebar-foot a { color: inherit; text-decoration: none; }
.sidebar-foot a:hover { color: var(--sh-accent-2); }

/* ---------- prose ---------- */
.prose {
  color: var(--sh-fog); font-size: 14.5px; line-height: 1.65;
  max-width: 72ch; margin: 0 0 14px;
}
.prose-list {
  color: var(--sh-fog); font-size: 14.5px; line-height: 1.6;
  max-width: 72ch; margin: 0 0 14px; padding-left: 20px;
}
.prose-list li { margin-bottom: 9px; }
.prose-list li::marker { color: var(--sh-accent); }

/* ---------- call-outs ---------- */
.note-block {
  border-radius: var(--sh-radius-sm);
  padding: 12px 14px; margin: 0 0 16px;
  font-size: 13.5px; line-height: 1.6; max-width: 76ch;
  border: 1px solid var(--sh-rule);
  border-left-width: 3px;
  background: var(--sh-surface-2);
  color: var(--sh-muted);
}
.note-block.is-info { border-left-color: var(--sh-accent); }
/* Warnings are the one place a second colour is allowed: a warning that is the
   same lime as everything else is not a warning. */
.note-block.is-warn {
  border-left-color: #E8A13C;
  color: var(--sh-fog);
}

/* ---------- tables ---------- */
/* Intel is mostly tables, and they are wide. Scroll the table, never the page. */
.table-wrap {
  overflow-x: auto;
  margin: 0 0 18px;
  border: 1px solid var(--sh-rule);
  border-radius: var(--sh-radius-sm);
}
.intel-table {
  width: 100%; border-collapse: collapse;
  font-size: 13px; line-height: 1.5;
}
.intel-table th {
  text-align: left; font-weight: 600;
  font-family: var(--sh-mono); font-size: 10.5px;
  letter-spacing: .07em; text-transform: uppercase;
  color: var(--sh-faint);
  background: var(--sh-surface-3);
  padding: 9px 12px;
  border-bottom: 1px solid var(--sh-rule);
  white-space: nowrap;
}
.intel-table td {
  padding: 10px 12px;
  color: var(--sh-muted);
  border-bottom: 1px solid var(--sh-rule-soft);
  vertical-align: top;
}
.intel-table td.k { color: var(--sh-fog); font-weight: 600; white-space: nowrap; }
.intel-table tr:last-child td { border-bottom: 0; }
.intel-table tbody tr:hover td { background: var(--sh-surface-2); }

@media (max-width: 640px) {
  .intel-table td.k { white-space: normal; }
  .stamp { display: none; }
}

/* ---------- toast ---------- */
.toast {
  position: fixed; left: 50%; bottom: 26px; transform: translateX(-50%) translateY(8px);
  background: var(--sh-surface-3); color: var(--sh-fog);
  border: 1px solid var(--sh-rule); border-radius: 999px;
  padding: 9px 18px; font-size: 13px; box-shadow: var(--sh-shadow);
  opacity: 0; pointer-events: none; transition: opacity .16s, transform .16s;
  z-index: 60;
}
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }