/* =========================================================
   ALLEGEDLY — Accountability DB
   Self-contained stylesheet. No imports from /prototype.
   When this surface breaks off into its own repo, this file
   moves with it untouched.
   Bureau Gris palette. Case-file chrome. Dossier density.
   ========================================================= */

:root{
  /* Type stack — same families as the pitch site, redeclared here */
  --sans:'Bebas Neue','Impact',sans-serif;
  --mono:'Departure Mono','Space Mono','Courier New',monospace;
  --data:'Departure Mono','Share Tech Mono',monospace;
  --serif:'Instrument Serif',Georgia,serif;

  /* Bureau Gris — gunmetal, platinum, silver */
  --dark:oklch(8% 0.006 252);
  --panel:oklch(13% 0.007 252);
  --panel-2:oklch(18% 0.008 255);
  --panel-3:oklch(22% 0.008 255);
  --silver:oklch(56% 0.008 252);
  --silver-bright:oklch(72% 0.007 250);
  --line:oklch(56% 0.008 252 / 0.16);
  --line-soft:oklch(56% 0.008 252 / 0.08);
  --light:oklch(93% 0.004 248);
  --light-2:oklch(82% 0.006 248);
  --light-3:oklch(68% 0.006 248);
  --ink:oklch(10% 0.008 252);

  /* footnote-only red, grade-fail signal */
  --red:oklch(55% 0.22 28);
  --red-deep:oklch(42% 0.20 28);
  --amber:#c9a832;
  --teal:#1a8c68;
  --green:oklch(62% 0.16 142);

  --max:1320px;
  --gutter:clamp(16px, 4vw, 56px);
  --pad-y:clamp(48px, 8vw, 96px);
  --bezier:cubic-bezier(.16,1,.3,1);
}

*,*::before,*::after{box-sizing:border-box; margin:0; padding:0;}
html,body{background:var(--dark); color:var(--light); min-height:100%;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--mono);
  font-size:13px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
::selection{background:var(--silver); color:var(--dark);}
a{color:inherit; text-decoration:none;}
button{font:inherit; color:inherit; background:none; border:none; cursor:pointer;}
img{max-width:100%; display:block;}

/* graph-paper grid + scanlines — always-on chrome */
body::before{
  content:''; position:fixed; inset:0; pointer-events:none; z-index:1;
  background-image:
    linear-gradient(to right, oklch(56% 0.008 252 / 0.035) 1px, transparent 1px),
    linear-gradient(to bottom, oklch(56% 0.008 252 / 0.035) 1px, transparent 1px);
  background-size:80px 80px;
}
body::after{
  content:''; position:fixed; inset:0; pointer-events:none; z-index:1;
  background:repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent 3px,
    oklch(93% 0.004 248 / 0.018) 3px,
    oklch(93% 0.004 248 / 0.018) 4px
  );
}
main, .classified-bar, .filter-bar{position:relative; z-index:2;}

/* =========================================================
   Classified bar
   ========================================================= */
.classified-bar{
  position:sticky; top:0; z-index:50;
  background:oklch(13% 0.007 252 / 0.92);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  font-family:var(--data);
  font-size:10px;
  letter-spacing:0.18em;
  text-transform:uppercase;
  color:var(--silver);
}
.bar-inner{
  max-width:var(--max);
  margin:0 auto;
  padding:8px var(--gutter);
  display:flex; flex-wrap:wrap; gap:18px;
  align-items:center; justify-content:space-between;
}
.bar-inner > span{display:inline-flex; align-items:center; gap:8px;}
.bar-mark{color:var(--red); font-style:italic; font-family:var(--serif); font-size:14px; letter-spacing:0;}
.bar-link{color:var(--silver-bright); border-bottom:1px solid currentColor; padding-bottom:1px;}
.bar-link:hover{color:var(--light);}
.hide-sm{display:none;}
@media (min-width:900px){ .hide-sm{display:inline-flex;} }

/* =========================================================
   Section chrome
   ========================================================= */
.wrap{max-width:var(--max); margin:0 auto; padding:0 var(--gutter);}
.section{padding:var(--pad-y) 0;}

.eyebrow{
  font-family:var(--data); font-size:10px;
  letter-spacing:0.22em; text-transform:uppercase;
  color:var(--silver); display:inline-flex; gap:10px; align-items:baseline;
}
.eyebrow .e-n{
  font-family:var(--data); color:var(--light-3);
  border:1px solid var(--line); padding:1px 6px;
}

.h-mega{
  font-family:var(--sans);
  font-size:clamp(48px, 10vw, 132px);
  line-height:0.92;
  letter-spacing:-0.02em;
  text-transform:uppercase;
  color:var(--light);
}
.disp{
  font-family:var(--serif);
  font-size:clamp(28px, 5vw, 64px);
  line-height:1.02;
  letter-spacing:-0.01em;
  color:var(--light);
}
.disp em{font-style:italic;}

.lede{
  font-family:var(--mono);
  font-size:clamp(13px, 1.4vw, 16px);
  line-height:1.7;
  max-width:62ch;
  color:var(--light-2);
}

.fn{
  font-family:var(--mono); font-size:11px;
  color:var(--red); line-height:1.6;
}
.fn::before{content:'* '; color:var(--red);}

.alg{
  font-family:var(--serif); font-style:italic;
  color:var(--red); font-size:1.05em;
  vertical-align:0.05em;
}

/* =========================================================
   Hero header
   ========================================================= */
.header{
  padding-top:clamp(48px, 9vw, 120px);
  padding-bottom:clamp(40px, 6vw, 72px);
  border-bottom:1px solid var(--line);
}
.header .h-mega{padding-top:18px;}
.header-meta{
  margin-top:28px;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:24px;
  border-top:1px solid var(--line-soft);
  padding-top:24px;
}
.meta-cell{display:flex; flex-direction:column; gap:6px;}
.meta-cell .ml{font-family:var(--data); font-size:9.5px; letter-spacing:0.22em; text-transform:uppercase; color:var(--silver);}
.meta-cell .mv{font-family:var(--serif); font-size:clamp(22px, 3vw, 32px); line-height:1; color:var(--light);}
.meta-cell .mv-mono{font-family:var(--data); font-size:13px; color:var(--light-2);}

/* =========================================================
   Filter strip
   ========================================================= */
.filter-bar{
  position:sticky; top:32px; z-index:40;
  background:oklch(13% 0.007 252 / 0.92);
  backdrop-filter:blur(10px);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:14px var(--gutter);
}
.filter-inner{
  max-width:var(--max); margin:0 auto;
  display:flex; flex-wrap:wrap; gap:10px 18px; align-items:center;
}
.filter-group{display:inline-flex; align-items:center; gap:8px; min-height:28px;}
.filter-group .fl{font-family:var(--data); font-size:9px; letter-spacing:0.2em; text-transform:uppercase; color:var(--silver);}
.search-input{
  background:transparent; color:var(--light);
  border:1px solid var(--line);
  font-family:var(--data); font-size:11px;
  letter-spacing:0.06em;
  padding:6px 10px;
  min-width:220px;
}
.search-input:focus{outline:none; border-color:var(--silver-bright);}
.search-input::placeholder{color:var(--light-3);}

.chip{
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--data); font-size:10px;
  letter-spacing:0.12em; text-transform:uppercase;
  border:1px solid var(--line); color:var(--light-2);
  padding:5px 10px; cursor:pointer;
  transition:all 0.18s var(--bezier);
}
.chip:hover{border-color:var(--silver-bright); color:var(--light);}
.chip.active{background:var(--silver); color:var(--dark); border-color:var(--silver);}
.chip .ct{opacity:0.55; font-size:9px;}
.chip-clear{color:var(--silver-bright); border-style:dashed;}

.result-count{
  font-family:var(--data); font-size:10px; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--silver);
  margin-left:auto;
}

/* =========================================================
   Directory table-grid
   ========================================================= */
.directory{
  border-top:1px solid var(--line);
}
.dir-row{
  display:grid;
  grid-template-columns:90px 1.6fr 1.4fr 1fr 80px 90px 80px;
  gap:18px;
  padding:18px var(--gutter);
  border-bottom:1px solid var(--line-soft);
  align-items:center;
  transition:background 0.2s var(--bezier);
}
.dir-row.dir-head{
  position:sticky; top:65px; z-index:30;
  background:oklch(13% 0.007 252 / 0.96);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
  padding-top:12px; padding-bottom:12px;
  font-family:var(--data); font-size:9.5px;
  letter-spacing:0.2em; text-transform:uppercase;
  color:var(--silver);
}
.dir-row:not(.dir-head){cursor:pointer;}
.dir-row:not(.dir-head):hover{background:var(--panel);}
.dir-row .dc-id{font-family:var(--data); font-size:10.5px; color:var(--light-3); letter-spacing:0.04em;}
.dir-row .dc-brand{font-family:var(--serif); font-size:18px; line-height:1.05; color:var(--light);}
.dir-row .dc-name{font-family:var(--mono); font-size:12px; color:var(--light-2); line-height:1.4;}
.dir-row .dc-adapt{font-family:var(--mono); font-size:11px; color:var(--light-3); line-height:1.4;}

@media (max-width: 900px){
  .dir-row{grid-template-columns:60px 1fr 80px; gap:12px;}
  .dir-row .dc-name, .dir-row .dc-adapt, .dir-row .dc-cat, .dir-row .dc-status{display:none;}
  .dir-row.dir-head .dc-name, .dir-row.dir-head .dc-adapt, .dir-row.dir-head .dc-cat, .dir-row.dir-head .dc-status{display:none;}
}

/* =========================================================
   Grade chips
   ========================================================= */
.grade{
  display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px;
  font-family:var(--sans); font-size:20px;
  letter-spacing:0; line-height:1;
  border:1.5px solid currentColor;
}
.grade-A{color:var(--silver-bright); background:oklch(72% 0.007 250 / 0.08);}
.grade-B{color:var(--silver); background:transparent;}
.grade-C{color:var(--amber); background:oklch(75% 0.13 80 / 0.07);}
.grade-D{color:var(--amber); border-color:var(--amber); background:transparent;}
.grade-F{color:var(--red); border-color:var(--red); background:oklch(55% 0.22 28 / 0.07);}
.grade-NA{color:var(--light-3); border-style:dashed;}

.grade.lg{width:64px; height:64px; font-size:38px;}

/* =========================================================
   Status pills
   ========================================================= */
.pill{
  display:inline-flex; align-items:center; gap:6px;
  font-family:var(--data); font-size:9px;
  letter-spacing:0.16em; text-transform:uppercase;
  padding:3px 7px;
  border:1px solid var(--line);
  color:var(--light-2);
}
.pill::before{
  content:''; width:6px; height:6px; border-radius:50%;
  background:currentColor;
}
.pill-QUEUED{color:var(--light-3);}
.pill-SAMPLED{color:var(--silver-bright);}
.pill-LAB{color:var(--amber); border-color:oklch(75% 0.13 80 / 0.3);}
.pill-PUBLISHED{color:var(--green); border-color:oklch(62% 0.16 142 / 0.3);}
.pill-PASSED{color:var(--green); border-color:oklch(62% 0.16 142 / 0.3);}
.pill-FAILED{color:var(--red); border-color:oklch(55% 0.22 28 / 0.3);}

/* =========================================================
   Dossier (per-product) view
   ========================================================= */
.dossier{padding:40px 0 96px;}
.dossier-stamp{
  font-family:var(--data); font-size:10px;
  letter-spacing:0.2em; text-transform:uppercase;
  color:var(--silver);
  display:flex; flex-wrap:wrap; gap:10px 24px; align-items:center;
  padding-bottom:18px; border-bottom:1px solid var(--line);
}
.dossier-back{
  font-family:var(--data); font-size:10px;
  letter-spacing:0.2em; text-transform:uppercase;
  color:var(--silver-bright);
  border-bottom:1px solid currentColor;
  padding-bottom:1px;
}
.dossier-back:hover{color:var(--light);}

.dossier-head{
  display:grid;
  grid-template-columns:1fr auto;
  gap:48px;
  padding-top:32px; padding-bottom:40px;
  border-bottom:1px solid var(--line);
}
.dossier-head .dh-brand{
  font-family:var(--data); font-size:11px;
  letter-spacing:0.22em; text-transform:uppercase;
  color:var(--silver); margin-bottom:14px;
}
.dossier-head .dh-name{
  font-family:var(--serif);
  font-size:clamp(36px, 6vw, 80px);
  line-height:0.98;
  letter-spacing:-0.015em;
  color:var(--light);
}
.dossier-head .dh-name em{font-style:italic; color:var(--silver-bright);}
.dossier-head .dh-cat{
  font-family:var(--mono); font-size:13px;
  color:var(--light-3); margin-top:14px;
}

@media (max-width: 800px){
  .dossier-head{grid-template-columns:1fr; gap:24px;}
}

.dossier-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:0;
  border-bottom:1px solid var(--line);
}
.dossier-grid > .dg-cell{
  padding:24px clamp(20px, 3vw, 32px);
  border-right:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
}
.dossier-grid > .dg-cell:nth-child(2n){border-right:none;}
@media (max-width: 700px){
  .dossier-grid{grid-template-columns:1fr;}
  .dossier-grid > .dg-cell{border-right:none;}
}
.dg-cell .dgl{font-family:var(--data); font-size:9.5px; letter-spacing:0.22em; text-transform:uppercase; color:var(--silver); margin-bottom:10px; display:flex; gap:8px; align-items:baseline;}
.dg-cell .dgv{font-family:var(--mono); font-size:14px; line-height:1.55; color:var(--light);}
.dg-cell .dgv-serif{font-family:var(--serif); font-size:22px; line-height:1.1; color:var(--light);}
.dg-cell .dgv-num{font-family:var(--data); font-size:18px; color:var(--light); letter-spacing:0.04em;}
.dg-cell .dgv-muted{color:var(--light-3);}
.dg-cell .dgv-tbd{color:var(--silver); font-style:italic;}

.dossier-coa{
  margin-top:48px;
  border:1px solid var(--line);
  background:linear-gradient(180deg, var(--panel) 0%, var(--dark) 100%);
}
.coa-head{
  padding:18px clamp(20px, 3vw, 28px);
  border-bottom:1px solid var(--line);
  display:flex; flex-wrap:wrap; gap:18px; align-items:center; justify-content:space-between;
  font-family:var(--data); font-size:11px;
  letter-spacing:0.2em; text-transform:uppercase;
  color:var(--silver);
}
.coa-head .coa-title{color:var(--light);}
.coa-body{padding:clamp(28px, 4vw, 48px);}
.coa-empty{
  font-family:var(--serif); font-style:italic;
  color:var(--silver); font-size:clamp(22px, 3vw, 32px); line-height:1.3;
  max-width:48ch;
}
.coa-empty .alg{color:var(--red);}
.coa-table{width:100%; border-collapse:collapse; font-family:var(--mono); font-size:13px;}
.coa-table th{
  text-align:left; padding:10px 12px;
  font-family:var(--data); font-size:9.5px;
  letter-spacing:0.22em; text-transform:uppercase;
  color:var(--silver); border-bottom:1px solid var(--line);
}
.coa-table td{
  padding:14px 12px; color:var(--light-2);
  border-bottom:1px solid var(--line-soft);
}
.coa-table .num{font-family:var(--data); color:var(--light); text-align:right;}
.coa-delta-low{color:var(--red);}
.coa-delta-ok{color:var(--green);}

/* =========================================================
   Verdict block (large grade card)
   ========================================================= */
.verdict{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:32px;
  padding:24px clamp(20px, 3vw, 32px);
  align-items:center;
  background:var(--panel);
  border:1px solid var(--line);
}
.verdict .v-claim{font-family:var(--serif); font-size:clamp(20px, 2.8vw, 28px); line-height:1.2; color:var(--light);}
.verdict .v-claim em{font-style:italic; color:var(--silver-bright);}
.verdict .v-sub{font-family:var(--data); font-size:10px; letter-spacing:0.2em; text-transform:uppercase; color:var(--silver); margin-top:8px;}

/* =========================================================
   Adaptogen reference page
   ========================================================= */
.adapt-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
  gap:1px;
  background:var(--line-soft);
  border:1px solid var(--line);
}
.adapt-card{
  background:var(--dark); padding:22px;
  display:flex; flex-direction:column; gap:14px;
  cursor:pointer;
  transition:background 0.2s var(--bezier);
}
.adapt-card:hover{background:var(--panel);}
.adapt-card .ac-name{font-family:var(--serif); font-size:26px; line-height:1; color:var(--light);}
.adapt-card .ac-cat{font-family:var(--data); font-size:10px; letter-spacing:0.2em; text-transform:uppercase; color:var(--silver);}
.adapt-card .ac-dose{font-family:var(--mono); font-size:12px; color:var(--light-2);}
.adapt-card .ac-feas{font-family:var(--data); font-size:10px; letter-spacing:0.16em; text-transform:uppercase; padding-top:10px; border-top:1px solid var(--line-soft);}
.feas-HIGH{color:var(--green);}
.feas-MODERATE{color:var(--silver-bright);}
.feas-LOW{color:var(--amber);}
.feas-VERY{color:var(--red);}

.adapt-detail{padding:40px 0 96px;}

/* =========================================================
   Episode / Show stub
   ========================================================= */
.episode{padding:40px 0 96px;}
.episode-frame{
  aspect-ratio:16/9;
  background:var(--panel);
  border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center;
  position:relative;
  overflow:hidden;
  margin:32px 0;
}
.episode-frame::before{
  content:''; position:absolute; inset:0;
  background:repeating-linear-gradient(
    to bottom, transparent 0 2px,
    oklch(93% 0.004 248 / 0.025) 2px 3px);
  pointer-events:none;
}
.episode-frame .ef-label{
  font-family:var(--data); font-size:11px;
  letter-spacing:0.22em; text-transform:uppercase;
  color:var(--silver);
  display:flex; flex-direction:column; gap:6px; align-items:center;
  text-align:center;
}
.episode-frame .ef-label .ef-big{
  font-family:var(--sans); font-size:clamp(36px, 6vw, 80px);
  color:var(--light); letter-spacing:-0.01em;
}

.episode-steps{
  margin-top:48px;
  display:grid; gap:1px;
  background:var(--line-soft);
  border:1px solid var(--line);
}
.episode-step{
  background:var(--dark);
  padding:24px clamp(20px, 3vw, 32px);
  display:grid; grid-template-columns:50px 1fr auto; gap:20px;
  align-items:center;
}
.episode-step .es-n{font-family:var(--sans); font-size:32px; color:var(--silver);}
.episode-step .es-title{font-family:var(--serif); font-size:20px; color:var(--light);}
.episode-step .es-desc{font-family:var(--mono); font-size:12px; color:var(--light-3); margin-top:4px;}
.episode-step .es-pill{justify-self:end;}

/* =========================================================
   Footer
   ========================================================= */
.foot{
  border-top:1px solid var(--line);
  padding:48px 0 80px;
  font-family:var(--data); font-size:10px;
  letter-spacing:0.18em; text-transform:uppercase;
  color:var(--silver);
}
.foot .wrap{display:flex; flex-wrap:wrap; gap:24px; justify-content:space-between;}
.foot .foot-mark{font-family:var(--serif); font-style:italic; color:var(--red); font-size:14px;}

/* =========================================================
   Utility
   ========================================================= */
.muted{color:var(--light-3);}
.silver{color:var(--silver);}
.mono{font-family:var(--mono);}
.data{font-family:var(--data);}
.serif{font-family:var(--serif);}
.upper{text-transform:uppercase; letter-spacing:0.18em;}
.hairline{height:1px; background:var(--line); border:none;}
.hidden{display:none;}

/* page transition */
@keyframes slip{from{opacity:0; transform:translateY(8px);} to{opacity:1; transform:translateY(0);}}
.view{animation:slip 0.32s var(--bezier);}