:root {
  color-scheme: light;
  --ink: #18201b;
  --muted: #667069;
  --line: #dce2dd;
  --soft: #f4f6f3;
  --paper: #fcfdfb;
  --green: #21684b;
  --green-soft: #dff0e7;
  --amber: #9b5b08;
  --amber-soft: #fff0d4;
  --red: #a33b35;
  --red-soft: #fde8e5;
  --blue: #315f9e;
  --blue-soft: #e7eef8;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); }
button, input, select { font: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: clamp(2rem, 4vw, 3rem); line-height: 1; letter-spacing: -.045em; margin-bottom: .65rem; }
.muted { color: var(--muted); }
.metric { font-variant-numeric: tabular-nums; }
.eyebrow { color: var(--green); font-size: .75rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }

.brand { display: flex; align-items: center; gap: .7rem; font-weight: 780; letter-spacing: -.02em; }
.brand-centered { justify-content: center; margin-bottom: 2rem; }
.brand-mark { width: 2rem; height: 2rem; border: 1px solid #aab6ae; border-radius: .65rem; background: white; display: grid; place-items: center; }
.brand-mark::before { content: ""; width: .9rem; height: .9rem; border: 2px solid var(--green); border-radius: 50%; box-shadow: 7px 7px 0 -5px var(--green); }

.topbar { min-height: 4.25rem; border-bottom: 1px solid var(--line); background: rgba(252, 253, 251, .96); display: flex; align-items: center; justify-content: space-between; padding: 0 1.5rem; position: sticky; top: 0; z-index: 20; backdrop-filter: blur(10px); }
.topbar-actions, .source-health { display: flex; align-items: center; gap: .75rem; }
.source-health { color: var(--muted); font-size: .82rem; }
.health-dot { width: .5rem; height: .5rem; background: #38a169; border-radius: 50%; box-shadow: 0 0 0 4px #e5f5eb; }
.health-dot.warn { background: #d28a24; box-shadow: 0 0 0 4px #fff1dc; }

.primary-button, .ghost-button, .sidebar-collapse { border: 0; cursor: pointer; border-radius: .6rem; min-height: 2.4rem; padding: 0 .85rem; font-weight: 720; }
.primary-button { background: var(--green); color: white; }
.ghost-button { background: #edf1ee; color: #314139; }
.toolbar-input, .select-control { width: 100%; min-height: 2.65rem; border: 1px solid #cfd7d1; background: white; color: var(--ink); border-radius: .65rem; padding: 0 .8rem; outline: none; }
.toolbar-input:focus, .select-control:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgba(33, 104, 75, .12); }

.catalog-page { max-width: 96rem; margin: auto; padding: 2.2rem 1.5rem 5rem; }
.catalog-heading { display: flex; justify-content: space-between; gap: 2rem; align-items: end; margin-bottom: 1.5rem; }
.catalog-heading > div:first-child { max-width: 45rem; }
.summary-card { min-width: 25rem; display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid var(--line); border-radius: .9rem; overflow: hidden; background: white; }
.summary-card div { padding: .9rem 1rem; border-right: 1px solid var(--line); }
.summary-card div:last-child { border-right: 0; }
.summary-card strong, .summary-card span { display: block; }
.summary-card strong { font-size: 1.45rem; }
.summary-card span { color: var(--muted); font-size: .66rem; text-transform: uppercase; letter-spacing: .08em; }

.data-ownership-card { display: grid; grid-template-columns: minmax(16rem, 1fr) minmax(22rem, 1.35fr); gap: 1.25rem; align-items: center; margin-bottom: 1rem; padding: 1rem 1.15rem; border: 1px solid var(--line); border-radius: .9rem; background: white; }
.data-ownership-copy h2 { margin-bottom: .35rem; font-size: 1.05rem; }
.data-ownership-copy .eyebrow { margin-bottom: .35rem; }
.data-ownership-copy .muted { margin-bottom: 0; font-size: .78rem; line-height: 1.45; }
.data-ownership-actions { display: grid; gap: .55rem; min-width: 0; }
.data-ownership-action-group { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .45rem; min-width: 0; }
.ownership-link { display: inline-flex; align-items: center; min-height: 2.25rem; max-width: 100%; padding: .45rem .7rem; border-radius: .55rem; background: #edf1ee; color: #314139; font-size: .75rem; font-weight: 720; line-height: 1.2; text-align: center; text-decoration: none; overflow-wrap: anywhere; }
.ownership-link:hover { background: #dfe7e1; }
.ownership-link:focus-visible { outline: 3px solid rgba(33, 104, 75, .25); outline-offset: 2px; }
.ownership-link-danger { border: 1px solid #edc9c5; background: #fff8f7; color: var(--red); }
.ownership-link-danger:hover { background: var(--red-soft); }

.catalog-workspace { display: grid; grid-template-columns: 16rem minmax(0, 1fr); gap: 1rem; align-items: start; }
.catalog-workspace.filters-collapsed { grid-template-columns: 1fr; }
.catalog-workspace.filters-collapsed .filter-sidebar { display: none; }
.filter-sidebar { background: white; border: 1px solid var(--line); border-radius: .9rem; padding: 1rem; position: sticky; top: 5.25rem; }
.sidebar-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: .75rem; }
.sidebar-heading h2 { margin: 0; font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; }
.sidebar-collapse { width: 2rem; min-height: 2rem; padding: 0; border: 1px solid var(--line); background: white; }
.filter-form input[type="checkbox"] { width: 1rem; height: 1rem; flex: 0 0 auto; }
.filter-form { display: grid; gap: .9rem; }
.filter-form label { color: var(--muted); font-size: .75rem; }
.filter-form label .select-control, .filter-form label .toolbar-input { margin-top: .35rem; }
.check-row { display: flex; gap: .55rem; align-items: start; color: #465049 !important; line-height: 1.35; }
.check-row input { margin-top: .15rem; accent-color: var(--green); }
.catalog-results { min-width: 0; }
.search-bar { display: grid; grid-template-columns: auto minmax(15rem, 1fr) auto; gap: .55rem; margin-bottom: .75rem; }
.show-filters { display: none; }
.filters-collapsed .show-filters { display: block; }

.table-shell { border: 1px solid var(--line); border-radius: 1rem; background: white; overflow: auto; box-shadow: 0 8px 28px rgba(20, 35, 26, .05); }
.listing-table { border-collapse: collapse; width: 100%; min-width: 70rem; font-size: .88rem; }
.listing-table th { text-align: left; color: #4f5c54; background: #f7f9f7; padding: .75rem; border-bottom: 1px solid var(--line); font-size: .7rem; letter-spacing: .075em; text-transform: uppercase; }
.listing-table td { padding: .75rem; border-bottom: 1px solid #edf0ed; vertical-align: middle; }
.listing-row:hover td { background: #fafcf9; }
.listing-row[aria-expanded="true"] td { background: #edf5f0; border-bottom-color: #d7e5dc; }
.table-product { display: grid; grid-template-columns: 3.6rem minmax(15rem, 1fr); gap: .7rem; align-items: center; }
.product-thumb { overflow: hidden; background: linear-gradient(140deg, #edf1ed, #dce5df); }
.product-placeholder { min-height: 3rem; border-radius: .55rem; display: grid; place-items: center; color: #5d6b62; font-size: .65rem; font-weight: 760; text-align: center; padding: .35rem; }
.table-title { font-weight: 760; line-height: 1.25; margin-bottom: .25rem; }
.row-link { color: var(--ink); text-decoration: none; }
.row-link:hover { color: var(--green); }
.table-sub { color: #59645d; font-size: .75rem; margin-top: .2rem; }
.external-link { color: var(--green); font-weight: 750; text-decoration: none; }
.external-link:hover { text-decoration: underline; }
.pill { display: inline-flex; align-items: center; border-radius: 999px; padding: .32rem .55rem; font-size: .68rem; font-weight: 760; line-height: 1; white-space: nowrap; }
.pill-broken { background: var(--red-soft); color: var(--red); }
.pill-untested { background: var(--amber-soft); color: var(--amber); }
.pill-both { background: #f2e6f7; color: #764390; }
.pill-active { background: var(--green-soft); color: var(--green); }
.pill-unknown { background: var(--amber-soft); color: var(--amber); }
.pill-unavailable { background: #ecefec; color: #657169; }
.pill-source { background: var(--blue-soft); color: var(--blue); }
.empty { padding: 3rem; text-align: center; color: var(--muted); }

.expanded-row td { padding: 0; background: #f3f6f3; }
.expanded-listing { display: grid; grid-template-columns: 12rem minmax(0, 1fr); gap: 1rem; padding: 1.1rem; }
.expanded-gallery { background: white; border: 1px solid var(--line); border-radius: .9rem; padding: .65rem; align-self: start; }
.expanded-gallery .product-thumb { height: 9rem; }
.gallery-thumbs { display: grid; grid-template-columns: repeat(3, 1fr); gap: .4rem; margin-top: .45rem; }
.gallery-thumbs span { height: 2.4rem; border-radius: .4rem; background: #e2ebe5; border: 1px solid #d1ddd5; }
.expanded-source { display: flex; justify-content: space-between; gap: .7rem; align-items: center; margin-top: .65rem; font-size: .75rem; }
.expanded-panels { display: grid; grid-template-columns: repeat(4, minmax(10rem, 1fr)); gap: .65rem; }
.evidence-panel { background: white; border: 1px solid var(--line); border-radius: .85rem; padding: .8rem; }
.evidence-panel h3 { color: var(--muted); font-size: .65rem; text-transform: uppercase; letter-spacing: .08em; }
.condition-copy { min-height: 3.25rem; font-size: .75rem; line-height: 1.4; }
.evidence-line { border-top: 1px solid #edf0ed; padding: .45rem 0; font-size: .7rem; }
.evidence-line span, .evidence-line strong { display: block; }
.evidence-line span { color: var(--muted); }
.evidence-line strong { margin-top: .12rem; overflow-wrap: anywhere; }

.auth-shell { min-height: 100vh; display: grid; place-items: center; padding: 1rem; background: linear-gradient(145deg, #edf3ee, #fbfcfa 55%); }
.auth-card { width: min(28rem, 100%); background: white; border: 1px solid var(--line); border-radius: 1.25rem; padding: 2rem; box-shadow: 0 18px 55px rgba(23, 35, 27, .1); }
.auth-card h1 { font-size: 2rem; }
.auth-form { display: grid; gap: .55rem; margin-top: 1.5rem; }
.auth-form label { color: var(--muted); font-size: .78rem; font-weight: 700; }
.auth-form input:not([type="submit"]) { min-height: 2.8rem; border: 1px solid #cfd7d1; border-radius: .65rem; padding: 0 .8rem; }
.auth-form .primary-button { margin-top: .75rem; }
.flash { border-radius: .65rem; padding: .75rem; margin: 1rem 0; font-size: .82rem; }
.flash-alert { background: var(--red-soft); color: var(--red); }
.flash-notice { background: var(--green-soft); color: var(--green); }

.data-ownership-link { display: inline-flex; align-items: center; text-decoration: none; }
.data-deletion-page { max-width: 52rem; margin: auto; padding: 3rem 1.5rem 5rem; }
.data-deletion-card { background: white; border: 1px solid var(--line); border-radius: 1.25rem; padding: clamp(1.25rem, 4vw, 2.5rem); box-shadow: 0 12px 40px rgba(20, 35, 26, .07); }
.deletion-counts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin: 1.5rem 0; }
.deletion-counts div { display: flex; justify-content: space-between; gap: 1rem; padding: .75rem .85rem; border: 1px solid var(--line); border-radius: .65rem; background: var(--soft); }
.deletion-counts dt { color: var(--muted); }
.deletion-counts dd { margin: 0; font-weight: 800; }
.deletion-total { padding: .85rem; border-left: 4px solid var(--red); background: var(--red-soft); }
.audit-exception { margin: 1rem 0; padding: .85rem; border: 1px solid #e4cc9f; border-radius: .65rem; background: var(--amber-soft); color: #704606; }
.audit-exception p { margin: .3rem 0 0; }
.deletion-form { display: grid; gap: .65rem; margin-top: 1.5rem; }
.deletion-form label { color: var(--muted); font-size: .82rem; }
.deletion-form input[type="text"] { min-height: 2.8rem; border: 1px solid #cfd7d1; border-radius: .65rem; padding: 0 .8rem; }
.danger-button { border: 0; border-radius: .65rem; min-height: 2.8rem; padding: 0 1rem; background: var(--red); color: white; font-weight: 760; cursor: pointer; }
.danger-button:hover { background: #842f2a; }

@media (max-width: 70rem) {
  .catalog-heading { align-items: start; flex-direction: column; }
  .summary-card { width: 100%; min-width: 0; }
  .expanded-panels { grid-template-columns: 1fr 1fr; }
  .data-ownership-card { grid-template-columns: 1fr; align-items: start; }
  .data-ownership-action-group { justify-content: flex-start; }
}

@media (max-width: 48rem) {
  .topbar { padding: 0 .9rem; }
  .source-health { display: none; }
  .catalog-page { padding: 1.5rem .85rem 4rem; }
  .catalog-workspace { grid-template-columns: 1fr; }
  .filter-sidebar { display: none; position: static; }
  .catalog-workspace:not(.filters-collapsed) .filter-sidebar { display: block; }
  .show-filters { display: block; }
  .search-bar { grid-template-columns: auto 1fr; }
  .search-bar .primary-button { grid-column: 1 / -1; }
  .expanded-listing, .expanded-panels { grid-template-columns: 1fr; }
  .summary-card { grid-template-columns: 1fr; }
  .summary-card div { border-right: 0; border-bottom: 1px solid var(--line); }
  .data-ownership-action-group { display: grid; grid-template-columns: 1fr; }
  .ownership-link { justify-content: center; width: 100%; }
}
