/* CK Metrics restrained over-budget marker — Aug. 29, 2026 */
.over-marker{
  position:absolute;
  left:calc(100% + 3px);
  top:50%;
  transform:translateY(-51%);
  width:14px;
  height:18px;
  border:0;
  padding:0;
  margin:0;
  background:transparent;
  color:var(--teal-dark);
  font-size:16px;
  line-height:18px;
  font-weight:950;
  text-align:center;
  cursor:pointer;
  z-index:12;
}
.over-marker.pace-over-marker{color:var(--teal2)}
.over-marker:hover{transform:translateY(-51%) scale(1.06)}
.over-marker:focus-visible{outline:2px solid #153e57;outline-offset:2px;border-radius:3px}

/* Replace the old burst legend with the same quiet exclamation indicator. */
.swatch.over-spent{
  position:relative;
  width:10px!important;
  height:13px!important;
  border-radius:0!important;
  background:transparent!important;
  clip-path:none!important;
  overflow:visible;
}
.swatch.over-spent::after{
  content:'!';
  position:absolute;
  inset:-2px 0 auto 0;
  color:var(--teal-dark);
  font-size:13px;
  line-height:13px;
  font-style:normal;
  font-weight:950;
  text-align:center;
}

/* Keep small overage explanations close to the marker and above every modal. */
.floating-tip{z-index:10000!important}
.floating-tip.overage-tip{
  position:fixed!important;
  width:164px!important;
  max-width:calc(100vw - 16px)!important;
  padding:8px 9px!important;
  border-radius:9px;
  box-shadow:0 7px 18px rgba(13,48,70,.16);
  pointer-events:none!important;
}
.floating-tip.overage-tip h4{margin:0 0 2px;font-size:11.5px}
.floating-tip.overage-tip .overage-tip-pct{font-size:10px;color:#5d7083;font-weight:850;line-height:1.2}

@media(max-width:820px){
  /* Every mobile bar reserves a small indicator lane. A 100% bar therefore
     ends before the right edge, and an over-budget ! lives in that lane. */
  .combined-bar .bar-main{width:calc(100% - 22px)!important}
  .over-marker{
    left:auto;
    right:1px;
    width:18px;
    height:22px;
    font-size:18px;
    line-height:22px;
    transform:translateY(-51%);
  }
  .over-marker:hover{transform:translateY(-51%)}
  .floating-tip.overage-tip{width:154px!important}
}

@media(max-width:590px){
  /* The desktop header row conflicts with the mobile per-cell labels. */
  .cat-row.cat-head,
  .cat-row.cat-head.closed-cat{display:none!important}
}