/* Data workspaces: the existing site palette, content and behaviour are preserved. */
html[data-page="live"][data-live-visual] {
  --pd-ui-bg: #0B1117;
  --pd-ui-surface: #111A22;
  --pd-ui-raised: #192630;
  --pd-ui-action: #3EE6B5;
  --pd-ui-action-hover: #74DFBF;
  --pd-ui-signal: #3EE6B5;
  --pd-ui-accent-rgb: 62, 230, 181;
  --live-ink: var(--pd-ui-text);
  --live-muted: var(--pd-ui-secondary);
  --live-mint: var(--pd-ui-action);
  --live-edge: var(--pd-ui-line);
}

@layer pd-quality {
  html:is([data-page="dataset"], [data-page="impact-metrics"], [data-page="registrar-accountability"], [data-page="registrar-stats"], [data-page="threat-pipeline"], [data-page="live"], [data-data-page="dns"], [data-data-page="registrars"]) body main :is(a, button, input, select, summary, [tabindex="0"]):focus-visible {
    outline: 2px solid var(--pd-ui-action) !important;
    outline-offset: 4px !important;
  }

  /* Download cards retain every source, licence and action. */
  html[data-page="dataset"] body main .pd-download-library { gap: 20px !important; }
  html[data-page="dataset"] body main .pd-download-card {
    padding: 28px !important;
    border-color: var(--pd-ui-line) !important;
    background: radial-gradient(ellipse at 100% 0, rgba(var(--pd-ui-accent-rgb), .045), transparent 60%), var(--pd-ui-surface) !important;
    box-shadow: inset 0 1px rgba(241, 245, 244, .035) !important;
    transition: border-color 180ms ease, box-shadow 180ms ease !important;
  }
  html[data-page="dataset"] body main .pd-download-card:is(:hover, :focus-within) {
    border-color: rgba(var(--pd-ui-accent-rgb), .6) !important;
    box-shadow: inset 0 1px rgba(var(--pd-ui-accent-rgb), .1), 0 10px 26px rgba(4, 11, 16, .16) !important;
  }
  html[data-page="dataset"] body main :is(h2 > i, .pd-download-top i) { color: var(--pd-ui-action) !important; }
  html[data-page="dataset"] body main .pd-download-top { color: var(--pd-ui-muted) !important; }
  html[data-page="dataset"] body main .pd-download-description { font-size: 15px !important; line-height: 1.7 !important; color: var(--pd-ui-secondary) !important; }
  html[data-page="dataset"] body main .pd-download-meta { font-size: 12px !important; gap: 9px !important; border-color: var(--pd-ui-line) !important; }
  html[data-page="dataset"] body main .pd-download-meta dt { color: var(--pd-ui-muted) !important; }
  html[data-page="dataset"] body main .pd-download-meta dd { color: var(--pd-ui-secondary) !important; }
  html[data-page="dataset"] body main .pd-download-actions { gap: 10px !important; }
  html[data-page="dataset"] body main .pd-download-actions > a { color: var(--pd-ui-action) !important; }
  html[data-page="dataset"] body main .pd-data-disclosure { border-color: var(--pd-ui-line) !important; background: var(--pd-ui-surface) !important; }
  html[data-page="dataset"] body main .pd-data-disclosure > summary small { font-size: 12px !important; line-height: 1.65 !important; color: var(--pd-ui-muted) !important; }
  html[data-page="dataset"] body main .pd-data-disclosure > summary::after { border-color: var(--pd-ui-line) !important; color: var(--pd-ui-action) !important; }
  html[data-page="dataset"] body main .pd-field { background: var(--pd-ui-surface) !important; }
  html[data-page="dataset"] body main .pd-field > p { font-size: 13px !important; }
  html[data-page="dataset"] body main .pd-field-meta { font-size: 11px !important; color: var(--pd-ui-muted) !important; }

  /* Impact numbers stay readable as a coordinated set at phone widths. */
  html[data-page="impact-metrics"] body main .live-counter-banner {
    background: radial-gradient(ellipse at 100% 0, rgba(var(--pd-ui-accent-rgb), .07), transparent 75%), var(--pd-ui-surface) !important;
    border-color: var(--pd-ui-line) !important;
    border-top: 2px solid var(--pd-ui-action) !important;
  }
  html[data-page="impact-metrics"] body main :is(.live-counter-value, .stat-number.live-data, .live-indicator) { color: var(--pd-ui-action) !important; -webkit-text-fill-color: currentColor !important; }
  html[data-page="impact-metrics"] body main .stats-grid { gap: 16px !important; }
  html[data-page="impact-metrics"] body main .stat-card {
    padding: 26px !important;
    text-align: start !important;
    border-color: var(--pd-ui-line) !important;
    background: var(--pd-ui-surface) !important;
    box-shadow: inset 0 1px rgba(241, 245, 244, .035) !important;
  }
  html[data-page="impact-metrics"] body main .stat-icon {
    width: 42px !important;
    height: 42px !important;
    margin: 0 0 20px !important;
    border-radius: 10px !important;
    color: var(--pd-ui-action) !important;
    background: rgba(var(--pd-ui-accent-rgb), .075) !important;
    font-size: 20px !important;
  }
  html[data-page="impact-metrics"] body main .stat-label { min-height: 36px !important; line-height: 1.5 !important; color: var(--pd-ui-secondary) !important; }
  html[data-page="impact-metrics"] body main .stat-number { margin: 12px 0 !important; font-family: var(--pd-ui-display) !important; font-variant-numeric: tabular-nums !important; line-height: 1.12 !important; letter-spacing: -.04em !important; }
  html[data-page="impact-metrics"] body main .stat-note { margin: 0 !important; font-size: 13px !important; line-height: 1.65 !important; color: var(--pd-ui-muted) !important; }
  html[data-page="impact-metrics"] body main :is(.method-card, .chart-card, .simulator-container) { border-color: var(--pd-ui-line) !important; }

  /* Evidence summaries use one rhythm; the full table remains independently scrollable. */
  html[data-page="registrar-accountability"] body main .ra-cards { gap: 12px !important; }
  html[data-page="registrar-accountability"] body main .ra-card {
    padding: 22px 20px !important;
    text-align: start !important;
    background: var(--pd-ui-surface) !important;
    border-color: var(--pd-ui-line) !important;
    border-radius: 12px !important;
    box-shadow: inset 0 1px rgba(241, 245, 244, .035) !important;
  }
  html[data-page="registrar-accountability"] body main .ra-card .ci { color: var(--pd-ui-action) !important; margin-bottom: 16px !important; }
  html[data-page="registrar-accountability"] body main .ra-card .num { font-family: var(--pd-ui-display) !important; font-weight: 600 !important; font-size: 34px !important; line-height: 1.15 !important; letter-spacing: -.035em !important; font-variant-numeric: tabular-nums !important; }
  html[data-page="registrar-accountability"] body main .ra-card .lbl { color: var(--pd-ui-secondary) !important; font-size: 13px !important; line-height: 1.65 !important; margin-top: 10px !important; }
  html[data-page="registrar-accountability"] body main .ra-method { max-width: none !important; margin-inline: 0 !important; background: var(--pd-ui-surface) !important; border-color: var(--pd-ui-line) !important; }
  html[data-page="registrar-accountability"] body main .ra-table { font-variant-numeric: tabular-nums !important; }
  html[data-page="registrar-accountability"] body main .ra-table thead th { position: sticky !important; top: 0 !important; z-index: 2 !important; background: var(--pd-ui-raised) !important; }
  html[data-page="registrar-accountability"] body main .ra-table tbody > tr:hover > td { background-color: rgba(var(--pd-ui-accent-rgb), .035) !important; }

  /* Registrar tables: eliminate the nested frame and align the section hierarchy. */
  html[data-page="registrar-stats"] body main .stitle {
    text-align: start !important;
    font: 600 clamp(24px, 2.25vw, 30px)/1.25 var(--pd-ui-display) !important;
    letter-spacing: -.025em !important;
    color: var(--pd-ui-text) !important;
    background: none !important;
    -webkit-text-fill-color: currentColor !important;
    text-wrap: balance !important;
  }
  html[data-page="registrar-stats"] body main .stats .st { text-align: start !important; padding: 18px 20px !important; }
  html[data-page="registrar-stats"] body main .stats .n { font-family: var(--pd-ui-display) !important; font-weight: 600 !important; letter-spacing: -.025em !important; }
  html[data-page="registrar-stats"] body main .stats .lb { color: var(--pd-ui-secondary) !important; margin-top: 7px !important; }
  html[data-page="registrar-stats"] body main .sb input { background: var(--pd-ui-surface) !important; border-color: var(--pd-ui-control-line) !important; }
  html[data-page="registrar-stats"] body main .rs-column-choice { border: 1px solid var(--pd-ui-line) !important; border-radius: 8px !important; background: var(--pd-ui-surface) !important; }
  html[data-page="registrar-stats"] body main .rs-column-choice > summary { padding: 14px 18px !important; min-height: 48px !important; color: var(--pd-ui-secondary) !important; }
  html[data-page="registrar-stats"] body main .rs-table-help { color: var(--pd-ui-muted) !important; font-size: 13px !important; margin-bottom: 12px !important; }
  html[data-page="registrar-stats"] body main .tbl-wrap { overflow: visible !important; max-height: none !important; border: 0 !important; background: transparent !important; }
  html[data-page="registrar-stats"] body main .tbl-wrap > .pd-table-scroll { border: 1px solid var(--pd-ui-line) !important; border-radius: 12px !important; background: var(--pd-ui-surface) !important; scrollbar-color: var(--pd-ui-control-line) var(--pd-ui-surface); scrollbar-width: thin; }
  html[data-page="registrar-stats"] body main .tbl-wrap table { margin: 0 !important; border: 0 !important; font-variant-numeric: tabular-nums !important; }
  html[data-page="registrar-stats"] body main .tbl-wrap table th { position: sticky !important; top: 0 !important; z-index: 2 !important; background: var(--pd-ui-raised) !important; }
  html[data-page="registrar-stats"] body main .tbl-wrap table td { padding-block: 15px !important; }
  html[data-page="registrar-stats"] body main .tbl-wrap tbody > tr.xr:hover > td { background-color: rgba(var(--pd-ui-accent-rgb), .045) !important; }
  html[data-page="registrar-stats"] body main .grid2 { gap: 24px !important; }
  html[data-page="registrar-stats"] body main .card { border-color: var(--pd-ui-line) !important; background: var(--pd-ui-surface) !important; border-radius: 12px !important; }

  /* Pipeline: remove the duplicate header offset and give the source labels room. */
  html[data-page="threat-pipeline"] body > .pd-crumbs { margin-top: 0 !important; }
  html[data-page="threat-pipeline"] body main .head .pd-page-h1 { text-wrap: balance !important; }
  html[data-page="threat-pipeline"] body main .tile { border-color: var(--pd-ui-line) !important; border-radius: 10px !important; background: var(--pd-ui-surface) !important; }
  html[data-page="threat-pipeline"] body main .tile-name { font-family: var(--pd-ui-font) !important; font-size: 14px !important; line-height: 1.45 !important; letter-spacing: -.01em !important; }
  html[data-page="threat-pipeline"] body main .tile-name small { font-family: var(--pd-ui-font) !important; font-size: 12px !important; line-height: 1.6 !important; margin-top: 4px !important; color: var(--pd-ui-muted) !important; }
  html[data-page="threat-pipeline"] body main .tile-hint { font-size: 10px !important; line-height: 1.65 !important; letter-spacing: .04em !important; opacity: 1 !important; }
  html[data-page="threat-pipeline"] body main .tile-stat { font-size: 11px !important; line-height: 1.65 !important; }
  html[data-page="threat-pipeline"] body main .ep-name small { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; }
  html[data-page="threat-pipeline"] body main .layer-head .name { font-family: var(--pd-ui-display) !important; font-weight: 600 !important; }

  /* Live keeps its illustration, with the same mint controls and legible metadata as the site. */
  html[data-page="live"][data-live-visual] body main .hero-stats { background: rgba(11, 17, 23, .5) !important; }
  html[data-page="live"][data-live-visual] body main .hero-stat .num { font-variant-numeric: tabular-nums !important; }
  html[data-page="live"][data-live-visual] body main .hero-stat .lbl { font-size: 11px !important; letter-spacing: .035em !important; line-height: 1.6 !important; color: var(--pd-ui-secondary) !important; }
  html[data-page="live"][data-live-visual] body main .hero-stat .delta { font-size: 11px !important; color: var(--pd-ui-muted) !important; }
  html[data-page="live"][data-live-visual] body main .hero-eyebrow { font-size: 11px !important; line-height: 1.8 !important; }
  html[data-page="live"][data-live-visual] body main .pd-live-hero-copy .pd-button { font-size: 13px !important; min-height: 46px !important; }
  html[data-page="live"][data-live-visual] body main :is(.sec-head h2, .daily h2, .pd-live-feed-title) { font-family: var(--pd-ui-display) !important; font-weight: 600 !important; letter-spacing: -.035em !important; text-wrap: balance !important; }
  html[data-page="live"][data-live-visual] body main .pd-live-observatory { border-color: var(--pd-ui-line) !important; background: radial-gradient(ellipse at 70% 20%, rgba(var(--pd-ui-accent-rgb), .07), transparent 70%), var(--pd-ui-surface) !important; border-radius: 18px !important; }

  /* Chart values stay aligned; two-digit ranks no longer split across lines. */
  html[data-data-page="dns"] body main .chart-box,
  html[data-data-page="registrars"] body main .panel { border-color: var(--pd-ui-line) !important; background: var(--pd-ui-surface) !important; }
  html[data-data-page="dns"] body main .bar-item,
  html[data-data-page="registrars"] body main :is(.bar-item, .response-item) { align-items: center !important; }
  html[data-data-page="dns"] body main :is(.bar-rank, .bar-value),
  html[data-data-page="registrars"] body main :is(.bar-rank, .response-rank, .bar-value, .response-time) { font-variant-numeric: tabular-nums !important; }
  html[data-data-page="dns"] body main .bar-rank,
  html[data-data-page="registrars"] body main :is(.bar-rank, .response-rank) { min-width: 24px !important; white-space: nowrap !important; overflow-wrap: normal !important; }
  html[data-data-page="dns"] body main .bar,
  html[data-data-page="registrars"] body main .bar-fill:not(.red) { background: linear-gradient(90deg, rgba(var(--pd-ui-accent-rgb), .55), var(--pd-ui-action)) !important; }
  html[data-data-page="dns"] body main .bar-name,
  html[data-data-page="registrars"] body main :is(.bar-name, .response-name) { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; overflow-wrap: anywhere !important; }
  html[data-data-page="registrars"] body main .stat-value.warning { padding: 0 !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; }
  html[data-data-page="registrars"] body main .highlight-card { padding: 28px !important; gap: 24px !important; border-color: rgba(255, 59, 59, .28) !important; }

  @media (min-width: 1060px) {
    html[data-page="dataset"] body main .pd-download-description { min-height: 5.1em !important; }
  }
  @media (min-width: 701px) {
    html[data-data-page="registrars"] body main :is(.bar-item, .response-item) { grid-template-columns: 26px minmax(100px, 1fr) minmax(24px, 1fr) 106px !important; }
  }
  @media (min-width: 900px) and (max-width: 1200px) {
    html[data-page="threat-pipeline"] body main .layer.t-mid .row { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  }
  @media (min-width: 768px) and (max-width: 1023px) {
    html[data-page="registrar-accountability"] body main .ra-cards { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  }
  @media (max-width: 767px) {
    html[data-page="dataset"] body main .pd-download-card { padding: 22px !important; }
    html[data-page="dataset"] body main .badges { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px 16px !important; }
    html[data-page="impact-metrics"] body main .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
    html[data-page="impact-metrics"] body main .stat-card { padding: 18px 15px !important; }
    html[data-page="impact-metrics"] body main .stat-icon { margin-bottom: 18px !important; width: 36px !important; height: 36px !important; font-size: 17px !important; }
    html[data-page="impact-metrics"] body main .stat-label { min-height: 3em !important; font-size: 11px !important; letter-spacing: .025em !important; }
    html[data-page="impact-metrics"] body main .stat-number { font-size: clamp(24px, 7vw, 36px) !important; overflow-wrap: normal !important; }
    html[data-page="impact-metrics"] body main .stat-note { font-size: 12px !important; }
    html[data-page="registrar-accountability"] body main .ra-cards { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    html[data-page="registrar-accountability"] body main .ra-card { padding: 18px 16px !important; }
    html[data-page="registrar-accountability"] body main .ra-card:last-child:nth-child(odd) { grid-column: 1 / -1 !important; }
    html[data-page="registrar-accountability"] body main .ra-card .num { font-size: 29px !important; }
    html[data-page="registrar-accountability"] body main .ra-card .lbl { font-size: 12px !important; }
    html[data-page="registrar-stats"] body main .stats .st { padding: 16px 14px !important; }
    html[data-page="registrar-stats"] body main .stats .n { font-size: clamp(19px, 5vw, 26px) !important; white-space: nowrap !important; }
    html[data-page="registrar-stats"] body main .stats .st { border-bottom: 1px solid var(--pd-ui-line) !important; }
    html[data-page="registrar-stats"] body main .stats .st:nth-last-child(-n+2) { border-bottom: 0 !important; }
    html[data-page="registrar-stats"] body main .divider { margin-block: 28px !important; }
    html[data-page="live"][data-live-visual] body main .hero-eyebrow { font-size: 10px !important; letter-spacing: .05em !important; }
    html[data-page="live"][data-live-visual] body main .hero-stat .lbl { font-size: 10px !important; }
    html[data-data-page="registrars"] body main :is(.bar-item, .response-item) { grid-template-columns: 26px minmax(0, 1fr) auto !important; }
    html[data-data-page="registrars"] body main .highlight-card { padding: 22px !important; gap: 18px !important; }
  }
  @media (prefers-reduced-motion: reduce) {
    html[data-page="dataset"] body main .pd-download-card { transition: none !important; }
  }
}