#modal .v83-clock-history, #modal .v83-incident-detail {
  display: grid;
  gap: 1rem;
  min-inline-size: 0;
}
#modal .v83-history-summary, #modal .v83-reading, #modal .v83-detail-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .5rem 1rem;
}
#modal .v83-history-summary p, #modal .v83-reading p {
  margin: 0;
  color: #263e51;
  font-weight: 700;
}
#modal .v83-history-summary > span {
  color: #4c6370;
  font-size: .84rem;
}
#modal .v83-table-frame {
  overflow: hidden;
  border: 1px solid #b7cbd5;
  border-radius: 12px;
}
#modal .v83-clock-history [hidden] { display: none; }
#modal .v83-clock-history table {
  width: 100%;
  min-width: 0;
  border-collapse: collapse;
  color: #263e51;
  font-size: .9rem;
  line-height: 1.32;
}
#modal .v83-clock-history :is(th,td) {
  padding: .5rem .65rem;
  text-align: start;
  vertical-align: middle;
  white-space: normal;
  overflow-wrap: anywhere;
}
#modal .v83-clock-history th {
  background: #dce8ef;
  color: #354e5c;
  font-weight: 700;
  font-size: .77rem;
}
#modal .v83-clock-history td {
  background: #fff;
  border-top: 1px solid #d5e0e6;
}
#modal .v83-clock-history tr:nth-child(even) td { background: #f4f8f9; }
#modal .v83-clock-history tr.v81-alert-danger td { background: transparent; }
#modal .v83-incident-label { font-weight: 700; overflow-wrap: anywhere; }
#modal .v83-clock-history .v83-action {
  width: 1%;
  text-align: end;
  white-space: nowrap;
}
#modal .v83-clock-history .v83-action button { white-space: nowrap; }
#modal .v83-mobile-context { display: none; }
#modal .v83-read-badge {
  display: inline-block;
  width: max-content;
  padding: .13rem .52rem;
  border: 1px solid;
  border-radius: 1rem;
  font-size: .77rem;
  font-weight: 700;
  white-space: nowrap;
}
#modal .v83-read-badge.is-unread {
  color: #771e35;
  background: #ffedef;
  border-color: #cb8491;
}
#modal .v83-read-badge.is-read {
  color: #305449;
  background: #eaf3ef;
  border-color: #a6c4b8;
}
#modal [data-clock-more] { justify-self: start; }

#modal .v83-finding {
  padding: .85rem 1rem;
  border: 1px solid #d8b5bc;
  border-inline-start: 5px solid #96354b;
  border-radius: 8px;
  color: #532536;
  background: #fff3f4;
}
#modal .v83-finding h3, #modal .v83-detail-section h3 {
  margin: 0;
  font-size: 1.1rem;
  line-height: 1.35;
}
#modal .v83-finding h3 { color: #6a283b; }
#modal .v83-finding p {
  margin: .3rem 0 0;
  color: #532536;
  font-size: .94rem;
}
#modal .v83-detail-section {
  min-width: 0;
  border: 1px solid #c3d2d8;
  border-radius: 10px;
  background: #fff;
}
#modal .v83-detail-section h3 {
  padding: .55rem .85rem;
  border-radius: 9px 9px 0 0;
  background: #e6eef2;
  color: #2b4c60;
  font-size: 1rem;
}
#modal .v83-detail-section dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: .7rem 1.25rem;
  margin: 0;
  padding: .75rem .85rem;
}
#modal .v83-detail-section dt { color: #4d6671; font-size: .79rem; font-weight: 650; }
#modal .v83-detail-section dd {
  margin: .1rem 0 0;
  font-size: .92rem;
  line-height: 1.4;
  overflow-wrap: anywhere;
  color: #253a4a;
}
#modal .v83-detail-section code { white-space: normal; font-size: .86em; color: inherit; }
#modal .v83-reading { justify-content: start; }
#modal .v83-detail-actions { border-top: 1px solid #cad7db; padding-top: .8rem; }
#modal .v83-clock-error { margin: 0; color: #8c213a; }
#modal .v83-clock-error:empty { display: none; }
#modal :is(.v83-clock-history,.v83-incident-detail) button:focus-visible {
  outline: 2px solid #175879;
  outline-offset: 2px;
}
@media (max-width: 720px) {
  #modal .v83-clock-history table { table-layout: fixed; }
  #modal .v83-clock-history .v83-column { display: none; }
  #modal .v83-clock-history .v83-action { width: 5.6rem; }
  #modal .v83-mobile-name { min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  #modal .v83-mobile-context {
    display: grid;
    gap: .1rem;
    margin-top: .15rem;
    color: #384b56;
    font-size: .83rem;
  }
  #modal .v83-mobile-context .v83-read-badge { margin-top: .15rem; }
  #modal .v83-clock-history :is(th,td) { padding: .45rem .6rem; }
}
@media (max-width: 550px) {
  #modal .v83-detail-section dl { grid-template-columns: minmax(0,1fr); }
  #modal .v83-detail-actions { align-items: stretch; flex-direction: column; }
}
@media (max-width: 1024px), (pointer: coarse) {
  #modal :is(.v83-clock-history,.v83-incident-detail) button { min-height: 44px; }
}
