/* ════════════════════════════════════════════════════════════════════════
   ACTIVITIES & RELATIONS (LINKS) — Mobile & Tablet Responsive
   Loaded last so it overrides the desktop-first layout.
   ── Breakpoints ──
   1024px  : tablet — compact table, hide secondary columns
   768px   : mobile — card-based layout, compact toolbars
   480px   : small phone — tighter spacing
   ════════════════════════════════════════════════════════════════════════ */

/* ════════════════════════════════════════════════════════════════════════
   ACTIVITIES — TABLET (≤1024px): compact table
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  html body #tp-acts {
    overflow-x: hidden !important;
    max-width: 100% !important;
  }

  html body #tp-acts .acts-toolbar {
    padding: 8px 14px !important;
    gap: 10px !important;
  }
  html body #tp-acts .acts-toolbar-hint {
    display: none !important;
  }
  html body #tp-acts .acts-recalc-btn {
    padding: 6px 12px !important;
    font-size: 11px !important;
  }
  html body #tp-acts .acts-toggle-label {
    font-size: 11px !important;
  }
  html body #tp-acts .acts-filter-bar {
    padding: 8px 14px !important;
    gap: 6px !important;
  }
  html body #tp-acts .acts-search-wrap {
    min-width: 140px !important;
    max-width: 240px !important;
  }
  html body #tp-acts .acts-count-badge {
    font-size: 10px !important;
    padding: 3px 8px !important;
  }
  html body #tp-acts .acts-filter-chip {
    padding: 5px 10px !important;
    font-size: 11px !important;
  }
  html body #tp-acts .acts-icon-btn {
    width: 30px !important;
    height: 30px !important;
  }

  html body #tp-acts .tbl-wrap {
    max-height: none !important;
    border-radius: 0 !important;
    border-left: none !important;
    border-right: none !important;
    box-shadow: none !important;
    background: transparent !important;
  }
  html body #tp-acts .acts-tbl {
    min-width: 0 !important;
    width: 100% !important;
    overflow: visible !important;
    border-radius: 0 !important;
    border: none !important;
  }
  html body #tp-acts .acts-tbl thead th {
    padding: 8px 8px !important;
    font-size: 8.5px !important;
    letter-spacing: .5px !important;
  }
  html body #tp-acts .acts-tbl td {
    padding: 7px 8px !important;
    font-size: 11px !important;
  }
  html body #tp-acts .act-cell {
    min-width: 120px !important;
    gap: 6px !important;
  }
  html body #tp-acts .act-cell-icon {
    width: 20px !important;
    height: 20px !important;
  }
  html body #tp-acts .act-cell-name {
    font-size: 11px !important;
  }
  html body #tp-acts .act-cell-type {
    font-size: 9px !important;
  }
  html body #tp-acts .type-badge {
    padding: 2px 7px !important;
    font-size: 9px !important;
  }
  html body #tp-acts .act-duration-bar-wrap {
    display: none !important;
  }
  html body #tp-acts .float-dot {
    display: none !important;
  }
  html body #tp-acts .act-critical-badge {
    font-size: 7px !important;
    padding: 1px 4px !important;
  }

  /* Hide less important columns */
  html body #tp-acts .acts-tbl thead th:nth-child(9),
  html body #tp-acts .acts-tbl thead th:nth-child(10),
  html body #tp-acts .acts-tbl thead th:nth-child(11),
  html body #tp-acts .acts-tbl thead th:nth-child(12),
  html body #tp-acts .acts-tbl thead th:nth-child(13),
  html body #tp-acts .acts-tbl tbody td:nth-child(9),
  html body #tp-acts .acts-tbl tbody td:nth-child(10),
  html body #tp-acts .acts-tbl tbody td:nth-child(11),
  html body #tp-acts .acts-tbl tbody td:nth-child(12),
  html body #tp-acts .acts-tbl tbody td:nth-child(13) {
    display: none !important;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   ACTIVITIES — MOBILE (≤768px): professional card-based layout
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  html body #tp-acts {
    overflow-x: hidden !important;
  }

  html body #tp-acts #actsOut {
    padding: 0 6px !important;
  }

  /* ── Reset ALL table chrome ── */
  html body #tp-acts .tbl-wrap {
    overflow: visible !important;
    max-height: none !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  html body #tp-acts .acts-tbl {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: visible !important;
    border: none !important;
    border-radius: 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    background: transparent !important;
    display: table !important;
  }

  /* ── Hide header ── */
  html body #tp-acts .acts-tbl thead {
    display: none !important;
  }

  /* ── tbody becomes the card container ── */
  html body #tp-acts .acts-tbl tbody {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
  }

  /* ── Each tr is a card ── */
  html body #tp-acts .acts-tbl tbody tr {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    grid-template-rows: auto auto auto !important;
    gap: 4px 8px !important;
    width: 100% !important;
    background: #FFFFFF !important;
    border: 1px solid #E8ECEF !important;
    border-radius: 14px !important;
    padding: 14px 16px !important;
    box-shadow: 0 12px 34px rgba(26,29,33,.055) !important;
    transition: box-shadow .2s, border-color .2s !important;
    position: relative !important;
    box-sizing: border-box !important;
  }
  html body #tp-acts .acts-tbl tbody tr.act-critical {
    border-left: 3px solid #F4746B !important;
  }
  html body #tp-acts .acts-tbl tbody tr.act-near-critical {
    border-left: 3px solid #E5972A !important;
  }
  html body #tp-acts .acts-tbl tbody tr:active {
    box-shadow: 0 4px 14px rgba(36,180,126,.13) !important;
    border-color: rgba(36,180,126,.3) !important;
  }
  html body #tp-acts .acts-tbl tbody tr:nth-child(even) {
    background: #FFFFFF !important;
  }
  html body #tp-acts .acts-tbl tbody tr:hover td {
    background: transparent !important;
  }

  /* ── Reset all tds to work as grid items inside the card ── */
  html body #tp-acts .acts-tbl tbody td {
    display: block !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    text-align: left !important;
    vertical-align: middle !important;
    line-height: normal !important;
    font-style: normal !important;
    text-decoration: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    word-spacing: normal !important;
    white-space: normal !important;
    text-indent: 0 !important;
  }

  /* ── ID badge (cell 1) — grid row 1, col 1 ── */
  html body #tp-acts .acts-tbl tbody td:nth-child(1) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    grid-row: 1 !important;
    grid-column: 1 !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 10px !important;
    font-weight: 800 !important;
    color: #FFFFFF !important;
    background: #24B47E !important;
    padding: 2px 8px !important;
    border-radius: 6px !important;
    height: 22px !important;
    align-self: start !important;
    white-space: nowrap !important;
    letter-spacing: .3px !important;
  }
  /* Critical ID badge in mobile */
  html body #tp-acts .acts-tbl tbody tr.act-critical td:nth-child(1) {
    background: #F4746B !important;
  }
  html body #tp-acts .acts-tbl tbody tr.act-near-critical td:nth-child(1) {
    background: #E5972A !important;
  }

  /* ── Activity name (cell 2) — grid row 1, col 2 ── */
  html body #tp-acts .acts-tbl tbody td:nth-child(2) {
    display: block !important;
    grid-row: 1 !important;
    grid-column: 2 !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(2) .act-cell {
    min-width: 0 !important;
    width: 100% !important;
    gap: 6px !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(2) .act-cell-icon {
    display: none !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(2) .act-cell-info {
    flex-direction: row !important;
    align-items: center !important;
    gap: 6px !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(2) .act-cell-name {
    font-size: 15px !important;
    font-weight: 700 !important;
    color: #1A1D21 !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(2) .act-critical-badge {
    font-size: 8px !important;
    padding: 1px 5px !important;
    margin-left: 4px !important;
    color: #F4746B !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(2) .act-cell-type {
    display: inline-flex !important;
    font-size: 9px !important;
    color: #72777E !important;
    font-weight: 600 !important;
  }

  /* ── Type badge (cell 4) — grid row 2, col 1 ── */
  html body #tp-acts .acts-tbl tbody td:nth-child(4) {
    display: inline-flex !important;
    align-items: center !important;
    grid-row: 2 !important;
    grid-column: 1 !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(4) .type-badge {
    font-size: 9px !important;
    padding: 2px 8px !important;
    border-radius: 999px !important;
  }

  /* ── Duration (cell 5) — grid row 2, col 2 ── */
  html body #tp-acts .acts-tbl tbody td:nth-child(5) {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    grid-row: 2 !important;
    grid-column: 2 !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    color: #E5972A !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(5) .act-duration-bar-wrap {
    display: none !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(5) .act-duration-milestone {
    font-size: 11px !important;
    color: #72777E !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(5)::before {
    content: "" !important;
    display: none !important;
  }

  /* ── Total Float (cell 8) — grid row 2, col 3 ── */
  html body #tp-acts .acts-tbl tbody td:nth-child(8) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    grid-row: 2 !important;
    grid-column: 3 !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    padding: 2px 10px !important;
    border-radius: 8px !important;
    background: rgba(0,0,0,.04) !important;
    height: 26px !important;
    align-self: center !important;
    justify-self: end !important;
    white-space: nowrap !important;
  }
  html body #tp-acts .acts-tbl tbody tr.act-critical td:nth-child(8) {
    color: #F4746B !important;
    background: rgba(244,116,107,.08) !important;
  }
  html body #tp-acts .acts-tbl tbody tr.act-near-critical td:nth-child(8) {
    color: #E5972A !important;
    background: rgba(229,151,42,.08) !important;
  }

  /* ── Dates row: ES → EF (cells 6, 7) — grid row 3, col 1/2/3 ── */
  html body #tp-acts .acts-tbl tbody td:nth-child(6),
  html body #tp-acts .acts-tbl tbody td:nth-child(7) {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 11px !important;
    color: #4D6E91 !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(6) {
    grid-row: 3 !important;
    grid-column: 1 !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(7) {
    grid-row: 3 !important;
    grid-column: 2 / 4 !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(6)::after {
    content: "  →  " !important;
    color: #D1D5DB !important;
    font-weight: 400 !important;
    white-space: pre !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(7)::before {
    content: "" !important;
    display: none !important;
  }

  /* ── WBS, Source Refs, Resource, Crews, Workers, Actions ── */
  html body #tp-acts .acts-tbl tbody td:nth-child(3),
  html body #tp-acts .acts-tbl tbody td:nth-child(9),
  html body #tp-acts .acts-tbl tbody td:nth-child(10),
  html body #tp-acts .acts-tbl tbody td:nth-child(11),
  html body #tp-acts .acts-tbl tbody td:nth-child(12),
  html body #tp-acts .acts-tbl tbody td:nth-child(13) {
    display: none !important;
  }

  /* ── Toolbar: single compact row ── */
  html body #tp-acts .acts-toolbar {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 8px !important;
    padding: 8px 12px !important;
    scrollbar-width: none !important;
  }
  html body #tp-acts .acts-toolbar::-webkit-scrollbar { display: none !important; }
  html body #tp-acts .acts-toggle-label {
    font-size: 10px !important;
    white-space: nowrap !important;
  }
  html body #tp-acts .acts-recalc-btn {
    font-size: 10px !important;
    padding: 5px 10px !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
  }
  html body #tp-acts .acts-toolbar-hint {
    display: none !important;
  }

  /* ── Filter bar: scrollable chips + full-width search ── */
  html body #tp-acts .acts-filter-bar {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 8px 12px !important;
    gap: 6px !important;
    scrollbar-width: none !important;
  }
  html body #tp-acts .acts-filter-bar::-webkit-scrollbar { display: none !important; }
  html body #tp-acts .acts-filter-chip {
    flex-shrink: 0 !important;
    font-size: 10px !important;
    padding: 5px 9px !important;
  }
  html body #tp-acts .acts-count-badge {
    flex-shrink: 0 !important;
    font-size: 9px !important;
    padding: 3px 7px !important;
  }
  html body #tp-acts .acts-search-wrap {
    flex: 1 1 auto !important;
    min-width: 100px !important;
    max-width: none !important;
  }
  html body #tp-acts .acts-search {
    font-size: 11px !important;
    padding: 5px 10px 5px 28px !important;
  }
  html body #tp-acts .acts-search-icon {
    left: 8px !important;
    width: 12px !important;
    height: 12px !important;
  }
  html body #tp-acts .acts-icon-btn {
    width: 30px !important;
    height: 30px !important;
    flex-shrink: 0 !important;
  }

  /* ── Empty state ── */
  html body #tp-acts .empty {
    padding: 40px 16px !important;
  }
  html body #tp-acts .empty-icon {
    font-size: 32px !important;
  }
  html body #tp-acts .empty-t {
    font-size: 13px !important;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   ACTIVITIES — SMALL PHONE (≤480px): tighter cards
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
  html body #tp-acts .acts-tbl tbody tr {
    padding: 12px 14px !important;
    border-radius: 12px !important;
    gap: 3px 6px !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(2) .act-cell-name {
    font-size: 14px !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(1) {
    font-size: 9px !important;
    padding: 1px 6px !important;
    height: 20px !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(5),
  html body #tp-acts .acts-tbl tbody td:nth-child(8) {
    font-size: 11px !important;
  }
  html body #tp-acts .acts-tbl tbody td:nth-child(6),
  html body #tp-acts .acts-tbl tbody td:nth-child(7) {
    font-size: 10px !important;
  }
  html body #tp-acts .acts-toolbar {
    padding: 6px 10px !important;
    gap: 6px !important;
  }
  html body #tp-acts .acts-filter-bar {
    padding: 6px 10px !important;
    gap: 4px !important;
  }
  html body #tp-acts .acts-search-wrap {
    min-width: 80px !important;
  }
  html body #tp-acts .acts-search {
    font-size: 10px !important;
    padding: 4px 8px 4px 24px !important;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   RELATIONS (LINKS) — TABLET (≤1024px): compact stats + table
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {
  html body #tp-links {
    overflow-x: hidden !important;
    max-width: 100% !important;
  }

  html body #tp-links > .lk-page-hdr {
    padding: 14px 18px !important;
    gap: 10px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-page-title {
    font-size: 20px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-page-sub {
    font-size: 10.5px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-nqa-btn {
    padding: 6px 12px !important;
    font-size: 11px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-page-hdr-icon {
    width: 38px !important;
    height: 38px !important;
  }

  /* Stats: 4-column grid */
  html body #tp-links #linksOut .lk-stats {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 10px !important;
    padding: 12px 18px !important;
  }
  html body #tp-links #linksOut .lk-stat .sv {
    font-size: 18px !important;
  }
  html body #tp-links #linksOut .lk-stat .sl {
    font-size: 8px !important;
    letter-spacing: .5px !important;
  }
  html body #tp-links #linksOut .lk-actions {
    grid-column: 1 / -1 !important;
    margin-left: 0 !important;
    justify-content: flex-start !important;
  }
  html body #tp-links #linksOut .lk-copy-btn {
    padding: 5px 10px !important;
    font-size: 10px !important;
  }
  html body #tp-links #linksOut .lk-copy-status {
    font-size: 9px !important;
    min-width: 0 !important;
  }

  /* Coverage block: horizontal on tablet */
  html body #tp-links #linksOut .lk-coverage-block {
    padding: 12px 16px !important;
    margin: 10px 12px !important;
  }
  html body #tp-links #linksOut .lk-coverage-stats {
    gap: 16px !important;
  }
  html body #tp-links #linksOut .lk-cov-stat .cv {
    font-size: 18px !important;
  }
  html body #tp-links #linksOut .lk-cov-stat .cl {
    font-size: 8px !important;
  }

  /* Table: compact */
  html body #tp-links #linksOut .lk-tbl-wrap {
    max-height: none !important;
    border-radius: 0 !important;
    border-left: none !important;
    border-right: none !important;
  }
  html body #tp-links #linksOut .lk-tbl {
    min-width: 0 !important;
    width: 100% !important;
    border-radius: 0 !important;
    border: none !important;
  }
  html body #tp-links #linksOut .lk-tbl thead th {
    padding: 8px 8px !important;
    font-size: 8px !important;
    letter-spacing: .6px !important;
  }
  html body #tp-links #linksOut .lk-tbl td {
    padding: 6px 8px !important;
    font-size: 10.5px !important;
  }

  /* Hide less important columns: #, Source Logic, Reasoning, Action */
  html body #tp-links #linksOut .lk-tbl thead th:nth-child(1),
  html body #tp-links #linksOut .lk-tbl thead th:nth-child(9),
  html body #tp-links #linksOut .lk-tbl thead th:nth-child(10),
  html body #tp-links #linksOut .lk-tbl thead th:nth-child(11),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(1),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(9),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(10),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(11) {
    display: none !important;
  }

  /* Impact panel: stack vertically */
  html body #tp-links #linksOut .lk-impact-body {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 10px 14px !important;
  }
  html body #tp-links #linksOut .lk-impact-hdr {
    padding: 8px 14px !important;
    font-size: 10px !important;
    gap: 6px !important;
  }
  html body #tp-links #linksOut .lk-del-btn {
    padding: 4px 8px !important;
    font-size: 10px !important;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   RELATIONS (LINKS) — MOBILE (≤768px): professional card layout
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  html body #tp-links {
    overflow-x: hidden !important;
  }

  html body #tp-links #linksOut {
    padding: 0 6px !important;
  }

  /* ── Page header: compact ── */
  html body #tp-links > .lk-page-hdr {
    padding: 12px 14px !important;
    border-radius: 14px !important;
    margin: 0 0 10px !important;
    min-height: 0 !important;
  }
  html body #tp-links > .lk-page-hdr .lk-page-title {
    font-size: 18px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-page-sub {
    font-size: 10px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-page-hdr-icon {
    width: 34px !important;
    height: 34px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-page-hdr-icon svg {
    width: 18px !important;
    height: 18px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-nqa-btn {
    padding: 5px 10px !important;
    font-size: 10px !important;
    gap: 5px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-nqa-dot {
    display: none !important;
  }

  /* ── Stats: 2-column grid ── */
  html body #tp-links #linksOut .lk-stats {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    padding: 10px 14px !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    margin: 0 0 10px !important;
  }
  html body #tp-links #linksOut .lk-stat {
    min-height: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    background: #FFFFFF !important;
    border: 1px solid #E8ECEF !important;
    border-radius: 12px !important;
    padding: 12px 14px !important;
    box-shadow: 0 2px 6px rgba(0,0,0,.04) !important;
  }
  html body #tp-links #linksOut .lk-stat::before {
    display: none !important;
  }
  html body #tp-links #linksOut .lk-stat .sv {
    grid-column: auto !important;
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #1B1A17 !important;
  }
  html body #tp-links #linksOut .lk-stat .sl {
    grid-column: auto !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    color: #9CA3AF !important;
    text-transform: uppercase !important;
    letter-spacing: .5px !important;
  }
  html body #tp-links #linksOut .lk-stat .sl::after {
    display: none !important;
  }
  html body #tp-links #linksOut .lk-stat:nth-of-type(6),
  html body #tp-links #linksOut .lk-stat:nth-of-type(7) {
    display: flex !important;
  }

  html body #tp-links #linksOut .lk-actions {
    flex-wrap: wrap !important;
    gap: 6px !important;
    grid-column: 1 / -1 !important;
    margin-left: 0 !important;
    justify-content: stretch !important;
  }
  html body #tp-links #linksOut .lk-copy-btn {
    flex: 1 1 auto !important;
    justify-content: center !important;
    font-size: 10px !important;
    padding: 7px 10px !important;
  }
  html body #tp-links #linksOut .lk-copy-status {
    width: 100% !important;
    text-align: center !important;
    font-size: 9px !important;
  }

  /* ── Coverage block: stacked card ── */
  html body #tp-links #linksOut .lk-coverage-block {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    padding: 16px !important;
    margin: 0 0 10px !important;
    gap: 14px !important;
    background: #FFFFFF !important;
    border: 1px solid #E8ECEF !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.04) !important;
  }
  html body #tp-links #linksOut .lk-coverage-stats {
    justify-content: center !important;
    gap: 24px !important;
  }
  html body #tp-links #linksOut .lk-cov-stat {
    align-items: center !important;
  }

  /* ── Hide table header ── */
  html body #tp-links #linksOut .lk-tbl thead {
    display: none !important;
  }

  /* ── Reset table chrome ── */
  html body #tp-links #linksOut .lk-tbl-wrap {
    overflow: visible !important;
    max-height: none !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  html body #tp-links #linksOut .lk-tbl {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  /* ── tbody as flex column ── */
  html body #tp-links #linksOut .lk-tbl tbody {
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    width: 100% !important;
  }

  /* ── Each tr as card ── */
  html body #tp-links #linksOut .lk-tbl tbody tr {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 2px !important;
    width: 100% !important;
    background: #FFFFFF !important;
    border: 1px solid #E8ECEF !important;
    border-radius: 14px !important;
    padding: 14px 16px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.05) !important;
    cursor: pointer !important;
    transition: box-shadow .2s, border-color .2s !important;
    box-sizing: border-box !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody tr:nth-child(even) {
    background: #FFFFFF !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody tr:hover td {
    background: transparent !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody tr.lk-selected {
    border-color: rgba(59,130,246,.4) !important;
    box-shadow: 0 4px 14px rgba(59,130,246,.13) !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody tr:active {
    box-shadow: 0 4px 14px rgba(59,130,246,.13) !important;
    border-color: rgba(59,130,246,.3) !important;
  }

  /* ── Reset all tds to work as grid items inside the card ── */
  html body #tp-links #linksOut .lk-tbl tbody td {
    display: block !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: auto !important;
    height: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    text-align: left !important;
    vertical-align: middle !important;
    line-height: normal !important;
    font-style: normal !important;
    text-decoration: none !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    word-spacing: normal !important;
    white-space: normal !important;
    text-indent: 0 !important;
  }

  /* ── Line 1: Pred ID  →  Succ ID ── */
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(2),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(6) {
    display: inline !important;
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1.4 !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(2) {
    color: #3B82F6 !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(2)::after {
    content: "  →  " !important;
    color: #9CA3AF !important;
    font-weight: 400 !important;
    white-space: pre !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(6) {
    color: #10B981 !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(6)::after {
    content: "" !important;
    display: block !important;
  }

  /* ── Line 2: Pred Name  →  Succ Name ── */
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(3),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(7) {
    display: inline !important;
    font-size: 12px !important;
    color: #6B7280 !important;
    line-height: 1.3 !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(3)::after {
    content: "  →  " !important;
    color: #D1D5DB !important;
    white-space: pre !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(7)::after {
    content: "" !important;
    display: block !important;
  }

  /* ── Line 3: Type + Lag + Confidence ── */
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(4),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(5),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(8) {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin-top: 4px !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(4) { margin-right: 8px !important; }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(5) { margin-right: 8px !important; }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(4) .lt {
    font-size: 10px !important;
    padding: 3px 10px !important;
    border-radius: 999px !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(5) {
    font-family: 'JetBrains Mono', monospace !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    color: #D97706 !important;
  }

  /* ── Hide remaining ── */
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(1),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(9),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(10),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(11) {
    display: none !important;
  }

  /* ── Impact panel: full width ── */
  html body #tp-links #linksOut .lk-impact {
    margin-top: 8px !important;
    border-radius: 12px !important;
  }
  html body #tp-links #linksOut .lk-impact-body {
    grid-template-columns: 1fr !important;
    padding: 12px !important;
    gap: 8px !important;
  }
  html body #tp-links #linksOut .lk-impact-hdr {
    padding: 10px 12px !important;
    font-size: 10px !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
  }
  html body #tp-links #linksOut .lk-del-btn {
    margin-left: 0 !important;
    padding: 5px 10px !important;
    font-size: 10px !important;
  }
  html body #tp-links #linksOut .lk-gantt-hint {
    font-size: 10px !important;
    padding: 8px 12px !important;
  }
  html body #tp-links #linksOut .lk-act-card {
    padding: 10px 12px !important;
  }
  html body #tp-links #linksOut .lk-act-name {
    font-size: 11px !important;
  }
  html body #tp-links #linksOut .lk-act-dates {
    font-size: 9px !important;
    gap: 6px !important;
  }

  /* ── Empty state ── */
  html body #tp-links #linksOut .empty {
    padding: 40px 16px !important;
  }
  html body #tp-links #linksOut .empty-icon {
    font-size: 32px !important;
  }
  html body #tp-links #linksOut .empty-t {
    font-size: 13px !important;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   RELATIONS (LINKS) — SMALL PHONE (≤480px): tighter cards
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
  html body #tp-links > .lk-page-hdr {
    padding: 10px 12px !important;
    border-radius: 12px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-page-title {
    font-size: 16px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-page-hdr-icon {
    width: 30px !important;
    height: 30px !important;
  }
  html body #tp-links > .lk-page-hdr .lk-page-hdr-icon svg {
    width: 16px !important;
    height: 16px !important;
  }
  html body #tp-links #linksOut .lk-stats {
    padding: 8px 12px !important;
    gap: 6px !important;
  }
  html body #tp-links #linksOut .lk-stat {
    padding: 10px 12px !important;
  }
  html body #tp-links #linksOut .lk-stat .sv {
    font-size: 18px !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody tr {
    padding: 12px 14px !important;
    border-radius: 12px !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(2),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(6) {
    font-size: 12px !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(3),
  html body #tp-links #linksOut .lk-tbl tbody td:nth-child(7) {
    font-size: 11px !important;
  }
  html body #tp-links #linksOut .lk-coverage-block {
    padding: 14px !important;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   TOUCH DEVICES — kill hover-only affordances
   ════════════════════════════════════════════════════════════════════════ */
@media (hover: none) and (pointer: coarse) {
  html body #tp-acts .acts-tbl tbody tr:hover td {
    background: transparent !important;
  }
  html body #tp-acts .acts-row-action {
    opacity: 1 !important;
  }
  html body #tp-links #linksOut .lk-tbl tbody tr:hover td {
    background: transparent !important;
  }
}