/* Odor Complaint Records page — additive styles, matches research.css palette */

.stat-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  background:var(--rule);
  border:1px solid var(--rule);
  margin:4px 0 24px;
  max-width:640px;
}
.stat-tile{
  background:var(--paper-light);
  padding:16px 10px;
  text-align:center;
}
.stat-num{
  font-family:'Source Serif 4',serif;
  font-weight:700;
  font-size:1.7rem;
  color:var(--chart-blue-deep);
  line-height:1.1;
}
.stat-label{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.68rem;
  letter-spacing:0.02em;
  color:var(--brass-dim);
  margin-top:6px;
  line-height:1.3;
}
@media (max-width:620px){
  .stat-row{grid-template-columns:repeat(2,1fr);}
}

.table-scroll{
  overflow-x:auto;
  margin:0 0 8px;
  max-width:100%;
  -webkit-overflow-scrolling:touch;
}
.table-scroll table{max-width:none;}

table.year-table{
  width:100%;
  table-layout:fixed;
  border-collapse:collapse;
}
table.year-table th,
table.year-table td{
  padding:6px 4px;
  text-align:right;
  font-size:0.86rem;
}
table.year-table th:first-child,
table.year-table td:first-child{text-align:left;}
table.year-table th{
  font-family:'IBM Plex Mono',monospace;
  font-weight:600;
  letter-spacing:0.01em;
  line-height:1.25;
  vertical-align:bottom;
}

/* Below ~560px, a 5-column table doesn't reliably fit on real phones even
   with table-layout:fixed and abbreviated headers (confirmed on an actual
   Android device: only 3 of 5 columns stayed on-screen). Rather than keep
   tuning table column widths, the table is hidden and replaced with a
   stacked card list that has no fixed-width columns to overflow. */
.year-cards{display:none;}
@media (max-width:560px){
  .year-table-wrap{display:none;}
  .year-cards{display:block;}
}

.year-card{
  padding:12px 0;
  border-bottom:1px solid var(--rule);
}
.year-card-top{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:baseline;
  margin-bottom:8px;
}
.year-card-year{
  font-family:'IBM Plex Mono',monospace;
  font-weight:700;
  font-size:1rem;
  color:var(--ink);
  text-align:left;
}
.year-card-total{
  font-family:'Source Serif 4',serif;
  font-weight:700;
  font-size:0.95rem;
  color:var(--chart-blue-deep);
  font-variant-numeric:tabular-nums;
  text-align:center;
  grid-column:2;
}
.year-card-total small{
  font-family:'IBM Plex Mono',monospace;
  font-weight:400;
  font-size:0.66rem;
  letter-spacing:0.02em;
  color:var(--brass-dim);
  margin-left:3px;
}
.year-card-grid{
  display:flex;
  flex-direction:column;
  gap:3px;
}
.year-card-stat{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  font-size:0.8rem;
  padding:2px 0;
}
.year-card-stat .label{
  color:#6b6454;
}
.year-card-stat .value{
  font-family:'IBM Plex Mono',monospace;
  font-weight:600;
  color:var(--ink);
  font-variant-numeric:tabular-nums;
  min-width:2.4em;
  text-align:right;
}

.form-proof{
  margin:4px 0 20px;
}
.form-proof-imgs{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin:0 0 8px;
}
.form-proof-imgs img{
  flex:1 1 220px;
  max-width:280px;
  width:100%;
  height:auto;
  border:1px solid var(--rule);
  border-radius:2px;
  display:block;
}
.form-proof figcaption{
  font-size:0.82rem;
  color:#6b6454;
  line-height:1.5;
}

.record-list{
  margin:0 0 20px;
  border-top:1px solid var(--rule);
}
.record-entry{
  padding:14px 0;
  border-bottom:1px solid var(--rule);
}
.record-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px 10px;
  margin-bottom:6px;
}
.record-date{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.78rem;
  color:#6b6454;
  white-space:nowrap;
}
.record-sev{
  font-family:'IBM Plex Mono',monospace;
  font-size:0.72rem;
  color:var(--brass-dim);
  white-space:nowrap;
}
.record-desc{
  margin:0 0 4px;
  font-size:0.95rem;
  line-height:1.5;
  color:var(--ink);
  max-width:none;
  overflow-wrap:break-word;
}

.source-tag{
  display:inline-block;
  font-family:'IBM Plex Mono',monospace;
  font-size:0.72rem;
  letter-spacing:0.02em;
  padding:2px 8px;
  border-radius:2px;
  white-space:nowrap;
  color:var(--paper-light);
}
.source-tag.src-ecology{background:var(--chart-blue-deep);}
.source-tag.src-cswapt{background:var(--brass-dim);}
.source-tag.src-ptodor{background:#5b6b4f;}

.agency-note{
  margin:6px 0 0;
  padding-top:6px;
  border-top:1px dotted var(--rule);
  font-size:0.86rem;
  color:#4a4433;
  overflow-wrap:break-word;
}
.erts-tag{
  display:inline-block;
  font-family:'IBM Plex Mono',monospace;
  font-size:0.72rem;
  color:var(--brass-dim);
  white-space:nowrap;
}