/* EU Regulation Tracker on the Planit skin.
   Loaded after the page's own <style> blocks and after shell/skin.css.
   Scope: body.pl-skin.pl-tracker. The page keeps its markup, data and scripts;
   this file only restyles. !important appears only where the page uses inline
   styles (status box, notices, footer boxes, flag) or where skin.css uses it. */

/* 1. Tokens: map the page's own variables onto Planit tokens.
      Specificity beats [data-theme="dark"], so a dark theme saved by the old
      toggle in localStorage can no longer switch the page to dark. */
body.pl-skin.pl-tracker {
  --primary-gradient: var(--pl-navy);
  --secondary-gradient: var(--pl-paper);
  --card-bg: #fff;
  --text-primary: var(--pl-ink);
  --text-secondary: var(--pl-ink-2);
  --text-muted: var(--pl-ink-2);
  --border-color: var(--pl-line);
  --hover-shadow: none;
  --section-bg: var(--pl-paper);
  --accent-blue: var(--pl-navy);
  --success-green: var(--pl-ok);
  --warning-orange: var(--pl-due);
  --error-red: var(--pl-bad);
  --info-purple: var(--pl-ink-2);
  --pl-gutter: clamp(1rem, 4vw, 2rem);
  --pl-wide: 87.5rem;
  line-height: 1.6;
  transition: none;
}
/* the page animated every colour change for its theme switch; keep it short and calm */
body.pl-skin.pl-tracker * {
  transition: background-color .15s var(--pl-ease), border-color .15s var(--pl-ease), color .15s var(--pl-ease);
}

/* 2. Focus ring: skin.css draws it navy on paper and gold only inside .pl-band.
      This page's own navy areas (masthead, dialog header) are not .pl-band. */
body.pl-skin.pl-tracker .header :focus-visible,
body.pl-skin.pl-tracker .modal-header :focus-visible { outline-color: var(--pl-gold) !important; }

/* 3. Masthead: solid navy band, eyebrow, Playfair title, search */
body.pl-skin.pl-tracker .header {
  background: var(--pl-navy);
  color: var(--pl-on-navy);
  padding: clamp(2rem, 5vw, 3.5rem) 0 clamp(2rem, 4.5vw, 3rem);
  overflow: visible; /* the search suggestions may drop below the band */
}
body.pl-skin.pl-tracker .header::before { content: none; }
body.pl-skin.pl-tracker .header-content {
  max-width: var(--pl-wide);
  padding: 0 var(--pl-gutter);
  display: flex;
  flex-direction: column;
}
body.pl-skin.pl-tracker .header-subtitle {
  order: -1; /* shown as the eyebrow above the title */
  font: 500 .75rem/1.4 var(--pl-sans);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--pl-gold);
  opacity: 1;
  margin: 0 0 1rem;
}
body.pl-skin.pl-tracker .header h1 {
  font: 600 clamp(1.875rem, 4.4vw, 3.125rem)/1.1 var(--pl-serif);
  color: #fff;
  letter-spacing: -.015em;
  margin: 0 0 1rem;
  text-wrap: balance;
}
body.pl-skin.pl-tracker .header h1 svg {
  width: .84em;
  height: .56em;
  margin-right: .2em !important;
  vertical-align: .02em !important;
  border-radius: 2px !important;
  box-shadow: none !important;
  outline: 1px solid oklch(0.42 0.03 265);
}
body.pl-skin.pl-tracker .header p {
  font-size: clamp(1rem, 1.5vw, 1.125rem);
  line-height: 1.6;
  color: var(--pl-on-navy);
  opacity: 1;
  max-width: 62ch;
  margin: 0 0 1.75rem;
}
body.pl-skin.pl-tracker .header-controls { gap: .75rem; }
body.pl-skin.pl-tracker .theme-toggle { display: none; } /* light only, like the hub */
body.pl-skin.pl-tracker .search-container { flex: 1 1 auto; max-width: 36rem; min-width: 0; }
body.pl-skin.pl-tracker .search-box {
  min-height: 3rem;
  padding: .7rem 1rem .7rem 2.75rem;
  font-size: 1rem;
}
body.pl-skin.pl-tracker .search-icon {
  left: .95rem;
  display: flex;
  align-items: center;
  color: var(--pl-ink-2);
  font-size: 0;
  line-height: 0;
  pointer-events: none;
}
body.pl-skin.pl-tracker .search-icon svg { width: 1.05rem; height: 1.05rem; }

/* search suggestions */
body.pl-skin.pl-tracker .search-autocomplete {
  top: calc(100% + .375rem);
  background: #fff;
  border: 1px solid var(--pl-line);
  border-radius: var(--pl-radius);
  box-shadow: 0 14px 34px oklch(0.2 0.04 265 / .25);
  color: var(--pl-ink);
}
body.pl-skin.pl-tracker .autocomplete-item { padding: .75rem 1rem; gap: 0; border-bottom: 1px solid var(--pl-line); }
body.pl-skin.pl-tracker .autocomplete-item:last-child { border-bottom: 0; }
body.pl-skin.pl-tracker .autocomplete-item:hover { background: var(--pl-paper-2); }
body.pl-skin.pl-tracker .autocomplete-item.selected {
  background: var(--pl-paper-2);
  outline: 2px solid var(--pl-navy);
  outline-offset: -2px;
}
body.pl-skin.pl-tracker .autocomplete-icon { display: none; }
body.pl-skin.pl-tracker .autocomplete-title { font: 600 .9375rem/1.35 var(--pl-sans); color: var(--pl-navy); }
body.pl-skin.pl-tracker .autocomplete-subtitle { font: 400 .75rem/1.5 var(--pl-mono); font-style: normal; color: var(--pl-ink-2); }
body.pl-skin.pl-tracker .autocomplete-match {
  font-size: .75rem;
  color: var(--pl-ink-2);
  background: var(--pl-paper-2);
  border-radius: 3px;
  padding: .2rem .45rem;
}
body.pl-skin.pl-tracker .autocomplete-empty { color: var(--pl-ink-2); }

/* 4. Content column */
body.pl-skin.pl-tracker .container {
  max-width: var(--pl-wide);
  padding: clamp(1.75rem, 4.5vw, 3rem) var(--pl-gutter);
}
body.pl-skin.pl-tracker .last-updated {
  background: none;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0 0 2rem;
  text-align: left;
  font: 400 .8125rem/1.6 var(--pl-mono);
  color: var(--pl-ink-2);
}

/* 5. "Current Implementation Status": the purple panel with glass cards
      becomes a heading plus question-style rows, as on the hub. Inline styles. */
body.pl-skin.pl-tracker .container > .last-updated + div {
  background: none !important;
  color: var(--pl-ink) !important;
  padding: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 0 clamp(2.25rem, 5vw, 3rem) !important;
}
body.pl-skin.pl-tracker .container > .last-updated + div > h2 {
  font: 600 clamp(1.5rem, 3vw, 2.125rem)/1.15 var(--pl-serif) !important;
  color: var(--pl-navy) !important;
  text-shadow: none !important;
  margin: 0 0 1.25rem !important;
  text-wrap: balance;
}
body.pl-skin.pl-tracker .container > .last-updated + div > div:first-of-type {
  display: block !important;
  margin: 0 !important;
  border-top: 2px solid var(--pl-navy);
}
body.pl-skin.pl-tracker .container > .last-updated + div > div:first-of-type > div {
  display: grid;
  grid-template-columns: minmax(13rem, 19rem) minmax(0, 1fr);
  gap: .35rem 2rem;
  align-items: start;
  background: none !important;
  border: 0 !important;
  border-bottom: 1px solid var(--pl-line) !important;
  border-radius: 0 !important;
  padding: 1.1rem 0 !important;
}
body.pl-skin.pl-tracker .container > .last-updated + div > div:first-of-type > div > div:first-child {
  display: flex;
  align-items: flex-start;
  font: 600 1rem/1.45 var(--pl-sans) !important;
  color: var(--pl-navy) !important;
  text-shadow: none !important;
  margin: 0 !important;
}
body.pl-skin.pl-tracker .container > .last-updated + div > div:first-of-type > div > div:last-child {
  font-size: .9375rem !important;
  line-height: 1.6 !important;
  color: var(--pl-ink) !important;
  max-width: 75ch;
}
body.pl-skin.pl-tracker .container > .last-updated + div strong { color: var(--pl-navy); font-weight: 600; }
/* "Breaking Development" note */
body.pl-skin.pl-tracker .container > .last-updated + div > div:last-child {
  margin-top: 1.5rem !important;
  padding: 1rem 1.25rem !important;
  background: var(--pl-paper-2) !important;
  border: 0 !important;
  border-radius: var(--pl-radius) !important;
  color: var(--pl-ink) !important;
  font-size: .9375rem !important;
  line-height: 1.65 !important;
  max-width: 54rem;
}
body.pl-skin.pl-tracker .container > .last-updated + div > div:last-child > strong:first-child { font-size: 1rem !important; }

/* status marks that replace the coloured emoji */
body.pl-skin.pl-tracker .pl-mark {
  display: inline-block;
  flex: none;
  width: .5rem;
  height: .5rem;
  margin: .5em .65rem 0 0;
  border-radius: 50%;
}
body.pl-skin.pl-tracker .pl-mark-ok { background: var(--pl-ok); }
body.pl-skin.pl-tracker .pl-mark-due { background: var(--pl-due); }
/* "Adopted" keeps its tick, drawn as a masked shape in the status colour */
body.pl-skin.pl-tracker .pl-mark-done {
  width: .75rem;
  height: .75rem;
  margin: .375em .525rem 0 -.125rem;
  border-radius: 0;
  background: var(--pl-ok);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.4 4.9 9.2 10 3.2' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 6.4 4.9 9.2 10 3.2' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* 6. Filters: plain row, no card; reset as a pill like the hub */
body.pl-skin.pl-tracker .filters {
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  margin: 0 0 1rem;
}
body.pl-skin.pl-tracker .filter-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .625rem;
}
body.pl-skin.pl-tracker .filter-select {
  flex: 1 1 13rem;
  min-width: 0;
  min-height: 2.75rem;
  padding: .55rem .75rem;
  font-size: .9375rem;
  font-weight: 400;
  cursor: pointer;
}
body.pl-skin.pl-tracker .filter-select:hover { border-color: var(--pl-ink-2) !important; }
body.pl-skin.pl-tracker .reset-btn,
body.pl-skin.pl-tracker .no-results .pl-reset {
  flex: none;
  font: 500 .875rem/1 var(--pl-sans);
  min-height: 2.75rem;
  padding: .6rem 1.1rem;
  border-radius: 999px;
  border: 1px solid var(--pl-line);
  background: #fff;
  color: var(--pl-navy);
  text-transform: none;
  letter-spacing: 0;
  box-shadow: none;
  cursor: pointer;
}
body.pl-skin.pl-tracker .reset-btn:hover,
body.pl-skin.pl-tracker .no-results .pl-reset:hover {
  border-color: var(--pl-navy);
  background: var(--pl-paper-2);
  transform: none;
  box-shadow: none;
}

/* 7. Stat tiles become one calm facts row */
body.pl-skin.pl-tracker .stats-overview {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .4rem 2.25rem;
  margin: 0 0 1.75rem;
  padding: .8rem 0;
  border-top: 1px solid var(--pl-line);
  border-bottom: 1px solid var(--pl-line);
}
body.pl-skin.pl-tracker .stat-card {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  padding: 0;
  background: none;
  border: 0;
  border-radius: 0;
  text-align: left;
  overflow: visible;
}
body.pl-skin.pl-tracker .stat-card::before { content: none; }
body.pl-skin.pl-tracker .stat-card:hover { transform: none; box-shadow: none; }
body.pl-skin.pl-tracker .stat-number {
  display: inline;
  margin: 0;
  font: 600 1.0625rem/1.3 var(--pl-mono);
  color: var(--pl-navy);
}
body.pl-skin.pl-tracker .stat-label {
  font: 400 .875rem/1.4 var(--pl-sans);
  text-transform: none;
  letter-spacing: 0;
  color: var(--pl-ink-2);
}

/* 8. Notices with a yellow side stripe become quiet paper notes (inline styles).
      Here: the "June 2026 Status Update" between the facts row and the table. */
body.pl-skin.pl-tracker .container > .stats-overview + div {
  background: var(--pl-paper-2) !important;
  border: 0 !important;
  border-radius: var(--pl-radius) !important;
  color: var(--pl-ink) !important;
  padding: 1rem 1.25rem !important;
  margin: 0 0 2rem !important;
  font-size: .9375rem;
  line-height: 1.65;
  max-width: 54rem;
}
body.pl-skin.pl-tracker .container > .stats-overview + div > strong { color: var(--pl-navy) !important; font-weight: 600; }
body.pl-skin.pl-tracker .container > .stats-overview + div > strong:first-child { color: var(--pl-due) !important; }

/* 9. Regulation table: open table with a navy top rule and hairlines.
      The nine columns need about 1,490px, more than the content column ever
      offers (1,336px at most), so the table scrolls inside its wrapper at every
      width: the regulation name stays pinned left and, from 900px, the Details
      button stays pinned right. */
body.pl-skin.pl-tracker .table-container {
  background: none;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}
/* the page's own hint ("Scroll for more", same words), as a quiet caption instead of a gradient fade */
body.pl-skin.pl-tracker .table-wrapper::after { content: none; }
body.pl-skin.pl-tracker .table-wrapper::before {
  content: "\2192\00a0 Scroll for more";
  display: block;
  position: sticky;
  left: 0;
  padding: 0 0 .5rem;
  text-align: right;
  font: 400 .75rem/1.4 var(--pl-mono);
  color: var(--pl-ink-2);
}
body.pl-skin.pl-tracker .regulations-table {
  border-collapse: separate;
  border-spacing: 0;
  font-size: .875rem;
}
body.pl-skin.pl-tracker .regulations-table th {
  background: var(--pl-paper);
  color: var(--pl-navy);
  font: 600 .6875rem/1.35 var(--pl-sans);
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .85rem .75rem;
  border-top: 2px solid var(--pl-navy);
  border-bottom: 1px solid var(--pl-line);
  vertical-align: bottom;
  white-space: normal;
  cursor: default;
}
body.pl-skin.pl-tracker .regulations-table th.sortable { cursor: pointer; white-space: nowrap; }
body.pl-skin.pl-tracker .regulations-table th.sortable:hover { background: var(--pl-paper-2); }
body.pl-skin.pl-tracker .regulations-table th .sort-icon {
  display: inline-block;
  margin-left: .3rem;
  color: var(--pl-ink-2);
  opacity: .7;
  line-height: 0;
  vertical-align: -1px;
}
body.pl-skin.pl-tracker .regulations-table th .sort-icon svg { width: .5rem; height: .625rem; }
body.pl-skin.pl-tracker .regulations-table th.sortable:hover .sort-icon { opacity: 1; color: var(--pl-navy); }
body.pl-skin.pl-tracker .regulations-table td {
  padding: 1rem .75rem;
  border-bottom: 1px solid var(--pl-line);
  color: var(--pl-ink);
  line-height: 1.5;
}
body.pl-skin.pl-tracker .regulations-table tr:hover { background: none; }
body.pl-skin.pl-tracker .regulations-table tbody tr:hover td { background: var(--pl-paper-2); }
/* keep the regulation name in view while the other columns scroll */
body.pl-skin.pl-tracker .regulations-table th:first-child,
body.pl-skin.pl-tracker .regulations-table td:first-child {
  position: sticky;
  left: 0;
  min-width: 12.5rem;
  background: var(--pl-paper);
  box-shadow: inset -1px 0 0 var(--pl-line);
}
body.pl-skin.pl-tracker .regulations-table td:first-child { z-index: 1; }
/* every header cell is sticky with z-index 10, so the pinned ones need to sit above their neighbours */
body.pl-skin.pl-tracker .regulations-table th:first-child { z-index: 12; }
body.pl-skin.pl-tracker .regulations-table tbody tr:hover td:first-child { background: var(--pl-paper-2); }
@media (min-width: 900px) {
  body.pl-skin.pl-tracker .regulations-table th:last-child,
  body.pl-skin.pl-tracker .regulations-table td:last-child {
    position: sticky;
    right: 0;
    background: var(--pl-paper);
    box-shadow: inset 1px 0 0 var(--pl-line);
  }
  body.pl-skin.pl-tracker .regulations-table th:last-child { z-index: 12; }
  body.pl-skin.pl-tracker .regulations-table td:last-child { z-index: 1; }
  body.pl-skin.pl-tracker .regulations-table tbody tr:hover td:last-child { background: var(--pl-paper-2); }
}

body.pl-skin.pl-tracker .regulation-title {
  display: block;
  margin: 0;
  font: 600 1rem/1.3 var(--pl-serif);
  color: var(--pl-navy);
}
body.pl-skin.pl-tracker .title-icon { display: none; }
body.pl-skin.pl-tracker .regulation-subtitle {
  margin-top: .3rem;
  font: 400 .75rem/1.4 var(--pl-sans);
  font-style: normal;
  color: var(--pl-ink-2);
}

/* status: coloured dot plus label; priority: outlined tag as on the hub */
body.pl-skin.pl-tracker .status-badge {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .2rem 0;
  border: 0;
  border-radius: 0;
  background: none;
  font: 600 .6875rem/1.3 var(--pl-sans);
  letter-spacing: .06em;
  text-transform: uppercase;
}
body.pl-skin.pl-tracker .status-badge::before {
  content: "";
  flex: none;
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background: currentColor;
}
body.pl-skin.pl-tracker .status-in-force { color: var(--pl-ok); background: none; border: 0; }
body.pl-skin.pl-tracker .status-pending,
body.pl-skin.pl-tracker .status-development { color: var(--pl-due); background: none; border: 0; }
body.pl-skin.pl-tracker .status-consultation,
body.pl-skin.pl-tracker .status-proposed { color: var(--pl-ink-2); background: none; border: 0; }

body.pl-skin.pl-tracker .priority-badge {
  display: inline-block;
  padding: .3rem .5rem;
  border: 1px solid currentColor;
  border-radius: 3px;
  background: none;
  font: 600 .6875rem/1 var(--pl-sans);
  letter-spacing: .06em;
  text-transform: uppercase;
}
body.pl-skin.pl-tracker .priority-critical { color: var(--pl-bad); background: none; border: 1px solid currentColor; }
body.pl-skin.pl-tracker .priority-high { color: var(--pl-due); background: none; border: 1px solid currentColor; }
body.pl-skin.pl-tracker .priority-medium { color: var(--pl-navy); background: none; border: 1px solid currentColor; }
body.pl-skin.pl-tracker .priority-low { color: var(--pl-ink-2); background: none; border: 1px solid currentColor; }

body.pl-skin.pl-tracker .regulations-table td:nth-child(4) strong {
  font: 500 .8125rem/1.5 var(--pl-mono);
  color: var(--pl-navy);
  white-space: nowrap;
}
body.pl-skin.pl-tracker .practice-tags { gap: .375rem; }
body.pl-skin.pl-tracker .practice-tag {
  background: #fff;
  color: var(--pl-ink);
  border: 1px solid var(--pl-line);
  border-radius: 999px;
  padding: .2rem .6rem;
  font: 500 .75rem/1.4 var(--pl-sans);
  letter-spacing: 0;
}
body.pl-skin.pl-tracker .legal-ref {
  font: 400 .75rem/1.55 var(--pl-mono);
  color: var(--pl-ink-2);
  background: none;
  border: 0;
  border-radius: 0;
  padding: 0;
  margin: 0 0 .5rem;
  min-width: 9rem;
}
body.pl-skin.pl-tracker .german-law {
  font-weight: 600;
  font-size: .875rem;
  line-height: 1.45;
  color: var(--pl-navy);
  margin-bottom: .35rem;
  min-width: 12rem;
}
body.pl-skin.pl-tracker .authorities { font-size: .75rem; color: var(--pl-ink-2); }
body.pl-skin.pl-tracker .authority-tag {
  background: none;
  color: var(--pl-ink-2);
  border: 1px solid var(--pl-line);
  border-radius: 3px;
  padding: .15rem .45rem;
  margin: 0 .25rem .35rem 0;
  font: 500 .6875rem/1.4 var(--pl-sans);
}
body.pl-skin.pl-tracker .details-btn {
  font: 500 .8125rem/1 var(--pl-sans);
  min-height: 2.5rem;
  padding: .55rem .95rem;
  border-radius: 999px;
  border: 1px solid var(--pl-line);
  background: #fff;
  color: var(--pl-navy);
  text-transform: none;
  letter-spacing: 0;
  white-space: nowrap;
  box-shadow: none;
}
body.pl-skin.pl-tracker .details-btn:hover {
  background: var(--pl-navy);
  border-color: var(--pl-navy);
  color: #fff;
  transform: none;
  box-shadow: none;
}

@media (max-width: 600px) {
  body.pl-skin.pl-tracker .regulations-table th:first-child,
  body.pl-skin.pl-tracker .regulations-table td:first-child { min-width: 8.5rem; }
  body.pl-skin.pl-tracker .regulation-title { font-size: .9375rem; }
}

/* 10. Empty state */
body.pl-skin.pl-tracker .no-results {
  background: none;
  border: 1px dashed var(--pl-line);
  border-radius: var(--pl-radius);
  padding: 1.75rem 1.5rem;
  text-align: left;
  color: var(--pl-ink-2);
}
body.pl-skin.pl-tracker .no-results h3 {
  font: 600 1.375rem/1.2 var(--pl-serif);
  color: var(--pl-navy);
  margin: 0 0 .4rem;
}

/* 11. Detail dialog */
body.pl-skin.pl-tracker .modal {
  z-index: 2147483001; /* the breadcrumb bar uses 2147483000 and would sit on top of the dialog */
  background: oklch(0.2 0.04 265 / .55);
}
body.pl-skin.pl-tracker .modal-content {
  width: min(56rem, calc(100% - 2rem));
  max-height: calc(100vh - 3rem);
  max-height: calc(100dvh - 3rem);
  margin: 1.5rem auto;
  background: #fff;
  border: 1px solid var(--pl-line);
  border-radius: var(--pl-radius);
  box-shadow: 0 24px 60px oklch(0.2 0.04 265 / .3);
}
body.pl-skin.pl-tracker .modal-header {
  position: sticky;
  top: 0;
  z-index: 1;
  gap: 1rem;
  padding: 1.25rem clamp(1.25rem, 3vw, 2rem);
  background: var(--pl-navy);
  color: #fff;
  border-radius: var(--pl-radius) var(--pl-radius) 0 0;
  border-bottom: 2px solid var(--pl-gold);
}
body.pl-skin.pl-tracker .modal-title {
  gap: 0;
  font: 600 clamp(1.25rem, 2.6vw, 1.625rem)/1.2 var(--pl-serif);
  color: #fff;
  letter-spacing: -.01em;
}
body.pl-skin.pl-tracker #modalIcon { display: none; }
body.pl-skin.pl-tracker .close-btn {
  flex: none;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
  border-radius: 50%;
  border: 1px solid oklch(0.45 0.03 265);
  background: transparent;
  color: #fff;
  font: 400 1.375rem/1 var(--pl-sans);
}
body.pl-skin.pl-tracker .close-btn:hover {
  background: var(--pl-navy-2);
  border-color: var(--pl-gold);
  transform: none;
}
body.pl-skin.pl-tracker .modal-body { padding: clamp(1.25rem, 3vw, 2rem); color: var(--pl-ink); }
body.pl-skin.pl-tracker .detail-section {
  margin-bottom: 1.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--pl-line);
}
body.pl-skin.pl-tracker .detail-section:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }
body.pl-skin.pl-tracker .detail-section h4 {
  font: 600 .75rem/1.4 var(--pl-sans);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--pl-gold-ink);
  margin-bottom: .75rem;
}
body.pl-skin.pl-tracker .detail-section p { max-width: 72ch; font-size: .9375rem; line-height: 1.65; }
body.pl-skin.pl-tracker .detail-section p + p { margin-top: .75rem; }
body.pl-skin.pl-tracker .detail-section li {
  color: var(--pl-ink);
  font-size: .9375rem;
  line-height: 1.6;
  padding: .6rem 0 .6rem 1.25rem;
  border-bottom: 1px solid var(--pl-line);
}
body.pl-skin.pl-tracker .detail-section li:last-child { border-bottom: 0; }
body.pl-skin.pl-tracker .detail-section li::before {
  content: "";
  top: 1.2rem;
  left: .2rem;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--pl-gold-ink);
}
body.pl-skin.pl-tracker .detail-section a { overflow-wrap: anywhere; }

/* 12. "About This Tracker": reading content on paper. The shell footer below
       is the only navy footer. Inline styles throughout. */
body.pl-skin.pl-tracker .footer {
  background: none;
  color: var(--pl-ink);
  text-align: left;
  padding: 0;
  margin-top: clamp(1rem, 3vw, 2rem);
  border-top: 1px solid var(--pl-line);
}
body.pl-skin.pl-tracker .footer .container { padding: clamp(2.25rem, 5vw, 3.5rem) var(--pl-gutter) 0; }
body.pl-skin.pl-tracker .footer h3 {
  font: 600 clamp(1.5rem, 3vw, 2.125rem)/1.15 var(--pl-serif);
  color: var(--pl-navy);
  margin-bottom: .75rem !important;
}
body.pl-skin.pl-tracker .footer p { opacity: 1; line-height: 1.65; margin-bottom: .5rem; }
body.pl-skin.pl-tracker .footer .container > p:first-of-type {
  text-align: left !important;
  margin-bottom: 1.75rem !important;
  color: var(--pl-ink-2);
  max-width: 68ch;
}
/* Critical Update Notice and Verification and Sources */
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(1),
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(2) {
  background: var(--pl-paper-2) !important;
  border: 0 !important;
  border-radius: var(--pl-radius) !important;
  color: var(--pl-ink) !important;
  padding: 1.25rem 1.5rem !important;
  margin: 0 0 1.25rem !important;
  max-width: 54rem;
  font-size: .9375rem;
}
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(1) :is(p, ul, li, strong),
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(2) :is(p, ul, li, strong) { color: var(--pl-ink) !important; }
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(1) li strong,
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(2) strong { color: var(--pl-navy) !important; font-weight: 600; }
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(1) > p:first-child strong { color: var(--pl-due) !important; font-weight: 600; }
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(1) ul,
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(2) ul { padding-left: 1.25rem !important; margin: .6rem 0 !important; }
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(1) li,
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(2) li { margin: .3rem 0; }
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(1) li::marker,
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(2) li::marker { color: var(--pl-gold-ink); }
/* Direct Contact */
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(3) {
  display: block !important;
  margin: 1.75rem 0 0 !important;
}
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(3) > div {
  text-align: left !important;
  padding: 0 !important;
  background: none !important;
  border-radius: 0 !important;
  max-width: 54rem;
}
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(3) h4 {
  font: 600 .75rem/1.4 var(--pl-sans);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--pl-ink-2);
  margin-bottom: .4rem !important;
}
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(3) p { margin-bottom: .35rem !important; }
/* version, links and disclaimer */
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(4) {
  text-align: left !important;
  margin-top: 1.75rem !important;
  padding-top: 1.25rem !important;
  border-top: 1px solid var(--pl-line) !important;
  font-size: .8125rem !important;
  opacity: 1 !important;
  color: var(--pl-ink-2);
}
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(4) p { max-width: 80ch; }
body.pl-skin.pl-tracker .footer .container > div:nth-of-type(4) strong { color: var(--pl-ink); font-weight: 600; }
body.pl-skin.pl-tracker .footer a {
  color: var(--pl-navy) !important;
  font-weight: 600;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px;
}
body.pl-skin.pl-tracker .footer a:hover { color: var(--pl-gold-ink) !important; }
body.pl-skin.pl-tracker .pl-foot { margin-top: clamp(2.5rem, 6vw, 4rem); }

/* 13. Narrow screens */
@media (max-width: 480px) {
  body.pl-skin.pl-tracker .header-subtitle { letter-spacing: .1em; }
}
@media (max-width: 760px) {
  body.pl-skin.pl-tracker .container > .last-updated + div > div:first-of-type > div {
    grid-template-columns: minmax(0, 1fr);
    gap: .3rem;
  }
  body.pl-skin.pl-tracker .search-container { max-width: none; width: 100%; }
  body.pl-skin.pl-tracker .stats-overview { gap: .4rem 1.5rem; }
}

/* 14. Print: results only, legible on white */
@media print {
  body.pl-skin.pl-tracker .header {
    background: #fff !important;
    color: #000 !important;
    padding: 0 0 .75rem !important;
    border-bottom: 1px solid #000;
  }
  body.pl-skin.pl-tracker .header h1,
  body.pl-skin.pl-tracker .header p,
  body.pl-skin.pl-tracker .header-subtitle { color: #000 !important; }
  body.pl-skin.pl-tracker .header-controls,
  body.pl-skin.pl-tracker .filters,
  body.pl-skin.pl-tracker .table-wrapper::before { display: none !important; }
  body.pl-skin.pl-tracker .container { padding: 1rem 0; max-width: none; }
  body.pl-skin.pl-tracker .table-wrapper { overflow: visible; }
  body.pl-skin.pl-tracker .regulations-table { font-size: 7.5pt; }
  body.pl-skin.pl-tracker .regulations-table th,
  body.pl-skin.pl-tracker .regulations-table td { padding: 4pt 3pt; background: #fff !important; position: static; min-width: 0; box-shadow: none; }
  body.pl-skin.pl-tracker .regulations-table th:last-child,
  body.pl-skin.pl-tracker .regulations-table td:last-child { display: none; }
  body.pl-skin.pl-tracker .regulations-table tr { break-inside: avoid; }
  body.pl-skin.pl-tracker .regulation-title { font-size: 8.5pt; }
  body.pl-skin.pl-tracker .practice-tag,
  body.pl-skin.pl-tracker .status-badge,
  body.pl-skin.pl-tracker .priority-badge { white-space: normal; }
  body.pl-skin.pl-tracker .legal-ref,
  body.pl-skin.pl-tracker .german-law { min-width: 0; overflow-wrap: anywhere; }
  body.pl-skin.pl-tracker .stats-overview,
  body.pl-skin.pl-tracker .container > .last-updated + div > div:first-of-type > div { break-inside: avoid; }
  body.pl-skin.pl-tracker .footer { border-top: 1px solid #000; }
  /* status dots and the tick are backgrounds: print them like the text next to them */
  body.pl-skin.pl-tracker .pl-mark,
  body.pl-skin.pl-tracker .status-badge::before { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}