/* ucs-correct.css — UCS Chip Correction (DH #459). Chip interactive states +
   anchored popover. Tokens fall back to the app's teal/dark values. */

/* chip states */
.ucs-chip.ssucs-act { cursor: pointer; border-radius: 3px; }
.ucs-chip.ssucs-act:hover .ssucs-badge { box-shadow: 0 0 0 3px var(--teal-glow, rgba(53,197,199,.18)); }
.ucs-chip.ssucs-act:hover .ssucs-badge.med { box-shadow: inset 0 0 0 1px var(--teal, #35c5c7), 0 0 0 3px var(--teal-glow, rgba(53,197,199,.18)); }
.ssucs-open .ssucs-badge { box-shadow: 0 0 0 3px var(--teal-glow, rgba(53,197,199,.18)), 0 0 0 1px var(--teal, #35c5c7) !important; }
.ssucs-badge { display: inline-flex; align-items: center; height: 15px; padding: 0 5px; border-radius: 2px;
  background: var(--teal, #35c5c7); color: #08211f; font-family: var(--mono, monospace);
  font-size: 8.5px; font-weight: 700; letter-spacing: .16em; flex-shrink: 0; }
.ssucs-badge.med { background: transparent; color: var(--teal, #35c5c7); box-shadow: inset 0 0 0 1px var(--teal-line, rgba(53,197,199,.34)); }
.ssucs-path { display: inline-flex; align-items: baseline; gap: 5px; min-width: 0; font-size: 10.5px; font-family: var(--mono, monospace); margin-left: 7px; }
.ssucs-cat { color: var(--fg-strong, #e6e9f0); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; flex-shrink: 0; }
.ssucs-sep { color: var(--teal, #35c5c7); font-weight: 600; flex-shrink: 0; opacity: .9; }
.ssucs-sub { color: var(--fg-mute, #9aa3b2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ssucs-path.med .ssucs-cat { color: var(--fg-mute, #9aa3b2); }
.ssucs-path.med .ssucs-sub { color: var(--fg-dim, #6b7280); }
.ssucs-path.med .ssucs-sep { opacity: .6; }
.ssucs-ck { width: 11px; height: 11px; border-radius: 50%; background: var(--teal, #35c5c7); color: #08211f;
  display: inline-flex; align-items: center; justify-content: center; align-self: center; margin-left: 6px;
  font-size: 8px; font-weight: 700; flex-shrink: 0; line-height: 1; }
@keyframes ssucs-pulse { 0% { box-shadow: 0 0 0 0 var(--teal-glow, rgba(53,197,199,.28)); } 70% { box-shadow: 0 0 0 6px rgba(53,197,199,0); } 100% { box-shadow: 0 0 0 0 rgba(53,197,199,0); } }
.ssucs-saving .ssucs-badge, .ucs-chip.ssucs-saving { animation: ssucs-pulse .9s ease-out infinite; border-radius: 3px; }

/* ghost add / cleared marker — quiet at rest */
.ssucs-add { display: inline-flex; align-items: center; gap: 5px; font-family: var(--mono, monospace); font-size: 9px;
  letter-spacing: .14em; text-transform: uppercase; color: var(--fg-dim, #6b7280); cursor: pointer;
  border: 1px dashed var(--line-strong, rgba(255,255,255,.14)); border-radius: 3px; height: 17px; padding: 0 7px;
  flex-shrink: 0; user-select: none; opacity: .25; vertical-align: middle; }
.ssucs-add:hover { color: var(--teal, #35c5c7); border-color: var(--teal-line, rgba(53,197,199,.34)); opacity: 1; }
.ssucs-add.none { border-style: solid; opacity: .4; }
tr:hover .ssucs-add, [class*="row"]:hover .ssucs-add, [class*="Row"]:hover .ssucs-add { opacity: .8; }

/* retry pill (write failed) */
.ssucs-retry { font-family: var(--mono, monospace); font-size: 8.5px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--st-flagged, #e5a53a); border: 1px solid currentColor; border-radius: 3px; padding: 1px 6px;
  cursor: pointer; margin-left: 8px; vertical-align: middle; }

/* popover */
.ssucs-pop { width: 336px; background: var(--bg-panel, #14171c); border: 1px solid var(--line-strong, rgba(255,255,255,.14));
  border-radius: 6px; box-shadow: var(--float, 0 18px 48px rgba(0,0,0,.55)); overflow: hidden; text-align: left;
  font-family: var(--ui, system-ui, sans-serif); }
.ssucs-head { padding: 10px 13px 9px; border-bottom: 1px solid var(--line-soft, rgba(255,255,255,.06)); }
.ssucs-eyrow { display: flex; align-items: center; gap: 8px; }
.ssucs-ey { font-family: var(--mono, monospace); font-size: 8px; letter-spacing: .2em; text-transform: uppercase; color: var(--fg-dim, #6b7280); }
.ssucs-conf { margin-left: auto; font-family: var(--mono, monospace); font-size: 8px; letter-spacing: .12em; text-transform: uppercase; color: var(--fg-dim, #6b7280); }
.ssucs-conf.hi { color: var(--teal, #35c5c7); }
.ssucs-cur { display: flex; align-items: baseline; gap: 6px; margin-top: 7px; font-family: var(--mono, monospace); font-size: 11.5px; }
.ssucs-cur-c { color: var(--fg-strong, #e6e9f0); font-weight: 600; letter-spacing: .06em; }
.ssucs-cur-s { color: var(--teal, #35c5c7); font-weight: 600; }
.ssucs-cur-u { color: var(--fg-mute, #9aa3b2); }
.ssucs-cur-id { margin-left: auto; font-size: 9.5px; color: var(--fg-dim, #6b7280); letter-spacing: .04em; }
.ssucs-body { max-height: 254px; overflow-y: auto; padding-bottom: 4px; }
.ssucs-lbl { font-family: var(--mono, monospace); font-size: 8px; letter-spacing: .18em; text-transform: uppercase; color: var(--fg-dim, #6b7280); padding: 9px 13px 5px; }
.ssucs-rg { font-family: var(--mono, monospace); font-size: 8.5px; letter-spacing: .16em; text-transform: uppercase; color: var(--fg-dim, #6b7280); padding: 8px 13px 3px; display: flex; align-items: baseline; gap: 7px; }
.ssucs-rg-n { color: var(--fg-faint, #4b5563); letter-spacing: .04em; }
.ssucs-rr { display: flex; align-items: center; gap: 8px; padding: 5px 9px; margin: 0 4px; border-radius: 4px; cursor: pointer; }
.ssucs-rr:hover, .ssucs-rr.on { background: var(--bg-row-hover, rgba(255,255,255,.045)); }
.ssucs-rr.on { box-shadow: inset 2px 0 0 var(--teal, #35c5c7); }
.ssucs-rr-main { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ssucs-rr-sub { font-family: var(--mono, monospace); font-size: 11px; color: var(--fg, #c7cdd8); }
.ssucs-rr-sub b { color: var(--fg-strong, #e6e9f0); font-weight: 600; letter-spacing: .04em; }
.ssucs-rr-sc { font-family: var(--mono, monospace); font-size: 8.5px; color: var(--fg-faint, #4b5563); }
.ssucs-rr-id { margin-left: auto; font-family: var(--mono, monospace); font-size: 9px; color: var(--fg-dim, #6b7280); letter-spacing: .03em; flex-shrink: 0; }
.ssucs-rr.on .ssucs-rr-id { color: var(--teal, #35c5c7); }
.ssucs-empty { font-family: var(--ui, system-ui, sans-serif); font-size: 11px; color: var(--fg-dim, #6b7280); padding: 10px 13px; }
.ssucs-search { margin: 8px 12px 4px; display: flex; align-items: center; background: var(--bg-deep, #0a0b0d);
  border: 1px solid var(--line, rgba(255,255,255,.09)); border-radius: 5px; padding: 0 10px;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.45); }
.ssucs-search:focus-within { border-color: var(--teal-line, rgba(53,197,199,.34)); box-shadow: inset 0 1px 2px rgba(0,0,0,.45), 0 0 0 3px var(--teal-glow, rgba(53,197,199,.18)); }
.ssucs-q { flex: 1; background: transparent; border: 0; outline: 0; font-family: var(--mono, monospace); font-size: 11.5px; color: var(--fg, #c7cdd8); padding: 7px 0; }
.ssucs-q::placeholder { color: var(--fg-dim, #6b7280); }
.ssucs-foot { padding: 8px 13px; border-top: 1px solid var(--line-soft, rgba(255,255,255,.06)); display: flex; align-items: center; gap: 8px; }
.ssucs-notag { font-family: var(--ui, system-ui, sans-serif); font-size: 11px; color: var(--fg-mute, #9aa3b2); cursor: pointer; padding: 3px 7px; margin-left: -7px; border-radius: 4px; }
.ssucs-notag:hover { color: var(--st-danger, #e0566b); background: var(--st-danger-bg, rgba(224,86,107,.09)); }
.ssucs-keys { margin-left: auto; font-family: var(--ui, system-ui, sans-serif); font-size: 9.5px; color: var(--fg-dim, #6b7280); }