/* ============================================================
   HBCE — PROTOCOL UI (critical / evidence / terminal)
   Add-on stylesheet. Import after hbce.css
   ============================================================ */

:root{
  --hbce-green: rgba(0,255,195,.95);
  --hbce-blue: rgba(0,183,255,.95);
  --hbce-red: rgba(255,45,85,.95);
  --hbce-yellow: rgba(255,209,102,.95);

  --hbce-bg0: rgba(0,0,0,.28);
  --hbce-bg1: rgba(0,0,0,.36);
  --hbce-line: rgba(255,255,255,.10);
  --hbce-line2: rgba(0,255,195,.22);
}

/* ---------- critical banner ---------- */
.hbce-critical{
  margin-top: 16px;
  border: 1px solid rgba(255,45,85,.28);
  background:
    radial-gradient(900px 320px at 15% 10%, rgba(255,45,85,.14) 0%, rgba(0,0,0,0) 58%),
    linear-gradient(180deg, rgba(255,255,255,.02), rgba(0,0,0,0)),
    rgba(10,12,16,.70);
  border-radius: 18px;
  padding: 14px 14px;
  box-shadow: 0 14px 44px rgba(0,0,0,.50);
}

.hbce-critical__kicker{
  font-size: 11px;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: rgba(255,45,85,.92);
}

.hbce-critical__title{
  margin: 8px 0 6px;
  font-size: 15px;
  letter-spacing: .2px;
  color: rgba(230,237,246,.96);
}

.hbce-critical__text{
  margin: 0;
  color: rgba(230,237,246,.70);
  font-size: 13.5px;
}

/* ---------- protocol callouts ---------- */
.hbce-callout{
  margin-top: 14px;
  border: 1px solid var(--hbce-line);
  background: rgba(0,0,0,.26);
  border-radius: 16px;
  padding: 12px 12px;
}

.hbce-callout--ok{ border-color: rgba(0,255,195,.22); background: rgba(0,255,195,.04); }
.hbce-callout--warn{ border-color: rgba(255,209,102,.22); background: rgba(255,209,102,.04); }
.hbce-callout--bad{ border-color: rgba(255,45,85,.22); background: rgba(255,45,85,.04); }

.hbce-callout__h{
  margin: 0 0 6px;
  font-size: 12px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: rgba(230,237,246,.86);
}

/* ---------- terminal block ---------- */
.hbce-terminal{
  margin-top: 14px;
  border: 1px solid rgba(0,255,195,.20);
  background:
    radial-gradient(900px 360px at 15% 0%, rgba(0,255,195,.10) 0%, rgba(0,0,0,0) 60%),
    rgba(0,0,0,.34);
  border-radius: 18px;
  overflow: hidden;
}

.hbce-terminal__bar{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
}

.hbce-terminal__title{
  font-size: 12px;
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: rgba(230,237,246,.82);
}

.hbce-terminal__status{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
  font-size: 11px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.hbce-terminal__status.is-pass{
  border-color: rgba(0,255,195,.26);
  background: rgba(0,255,195,.06);
  color: rgba(0,255,195,.92);
}
.hbce-terminal__status.is-fail{
  border-color: rgba(255,45,85,.30);
  background: rgba(255,45,85,.06);
  color: rgba(255,45,85,.92);
}
.hbce-terminal__status.is-warn{
  border-color: rgba(255,209,102,.30);
  background: rgba(255,209,102,.06);
  color: rgba(255,209,102,.92);
}

.hbce-terminal__body{
  padding: 12px 12px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 12.5px;
  line-height: 1.45;
  color: rgba(230,237,246,.88);
}

.hbce-terminal__line{
  display:flex;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px dashed rgba(255,255,255,.06);
}
.hbce-terminal__line:last-child{ border-bottom: 0; }

.hbce-terminal__k{
  min-width: 160px;
  color: rgba(230,237,246,.65);
}
.hbce-terminal__v{
  flex: 1;
  word-break: break-word;
  color: rgba(230,237,246,.90);
}

.hbce-terminal__v.is-hash{
  color: rgba(0,255,195,.92);
}

/* ---------- evidence strip ---------- */
.hbce-evidence{
  margin-top: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.28);
  border-radius: 16px;
  padding: 12px 12px;
}

.hbce-evidence__top{
  display:flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.hbce-evidence__h{
  margin: 0;
  font-size: 12px;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: rgba(230,237,246,.86);
}

.hbce-mini{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,255,195,.18);
  background: rgba(0,255,195,.05);
  color: rgba(0,255,195,.92);
  font-size: 11px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.hbce-evidence__row{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  padding: 10px 10px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.02);
  border-radius: 14px;
}

.hbce-evidence__label{
  min-width: 110px;
  font-size: 12px;
  color: rgba(230,237,246,.65);
  letter-spacing: .4px;
  padding-top: 1px;
}

.hbce-evidence__value{
  flex:1;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 12.5px;
  color: rgba(230,237,246,.90);
  word-break: break-word;
}

.hbce-evidence__value.is-hash{
  color: rgba(0,255,195,.92);
}

.hbce-copy{
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
  color: rgba(230,237,246,.85);
  border-radius: 12px;
  padding: 9px 10px;
  font-size: 12px;
  cursor: pointer;
  transition: transform .12s ease, border-color .12s ease, background .12s ease, opacity .12s ease;
  user-select: none;
}
.hbce-copy:hover{
  transform: translateY(-1px);
  border-color: rgba(0,183,255,.35);
  background: rgba(0,183,255,.06);
}
.hbce-copy:active{ transform: translateY(0); opacity: .9; }

.hbce-copy.is-done{
  border-color: rgba(0,255,195,.30);
  background: rgba(0,255,195,.06);
  color: rgba(0,255,195,.92);
}

/* ---------- severity tags ---------- */
.hbce-sev{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
  font-size: 11px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.hbce-sev--critical{
  border-color: rgba(255,45,85,.30);
  background: rgba(255,45,85,.06);
  color: rgba(255,45,85,.92);
}
.hbce-sev--high{
  border-color: rgba(255,209,102,.30);
  background: rgba(255,209,102,.06);
  color: rgba(255,209,102,.92);
}
.hbce-sev--info{
  border-color: rgba(0,183,255,.30);
  background: rgba(0,183,255,.06);
  color: rgba(0,183,255,.92);
}