/* govtech-ca — screenshot-faithful: warm cream, serif titles, mono meta, thin rules */
:root{
  --bg:#fdf8ec;            /* warm canvas */
  --paper:#fdf8ec;
  --pill:#f2eadd;           /* search / dropdown fill */
  --pill-border:#e8ddd0;
  --line:#b8a99a;           /* hairline rule */
  --ink:#3d2c23;
  --ink-2:#6b5a4e;
  --muted:#8a7d73;
  --accent:#c9a86a;         /* arrow */
  --tag-bg:#f2eadd;
  --tag-ink:#5a4e42;
  --radius:999px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:"Instrument Serif", Georgia, serif;
  -webkit-font-smoothing:antialiased;
}

/* HERO */
.hero{
  padding:28px 24px 32px;
  border-bottom:1px solid var(--line);
  max-width:1240px;
  margin:0 auto;
}
.hero-nav{
  display:flex;justify-content:space-between;align-items:center;
  font-family:"JetBrains Mono", monospace;
  font-size:11px;letter-spacing:0.06em;text-transform:uppercase;
  color:var(--muted);
}
.hero-nav a{color:var(--ink-2);text-decoration:none;margin-left:18px}
.hero-nav a:hover{text-decoration:underline}
.kicker{letter-spacing:0.08em}
.hero-inner{padding:28px 0 8px}
.hero h1{
  font-family:"Instrument Serif", Georgia, serif;
  font-weight:400;
  font-size:56px;line-height:0.95;letter-spacing:-0.02em;
  margin:8px 0 14px;
}
.hero h1 em{font-style:italic;font-weight:400;color:var(--ink-2)}
.hero-sub{
  font-family: Georgia, serif;
  font-size:17px;line-height:1.45;
  color:var(--ink-2);
  max-width:760px;
}
.hero-meta{display:flex;gap:16px;align-items:center;margin-top:18px;flex-wrap:wrap}
.mono{font-family:"JetBrains Mono", monospace}
#hero-stats{font-size:12px;color:var(--muted)}
.btn-primary{
  font-family:"JetBrains Mono", monospace;
  font-size:12px;letter-spacing:0.04em;
  background:var(--ink);color:#fff;
  padding:9px 14px;border-radius:999px;text-decoration:none;
}
.btn-primary:hover{opacity:0.9}
.hero-sources{margin-top:12px;font-size:11px;color:var(--muted);line-height:1.6}

/* BOARD */
.board-wrap{max-width:1240px;margin:0 auto;padding:18px 24px 48px}
.controls{
  display:grid;
  grid-template-columns: 1.1fr 1fr 1fr;
  gap:12px;
  margin:10px 0 12px;
}
.controls.sub{
  grid-template-columns: 1fr 1fr 1fr auto;
  align-items:center;
}
.search-pill, .select-pill{
  position:relative;
  display:flex;align-items:center;
  background:var(--pill);
  border:1px solid var(--pill-border);
  border-radius:var(--radius);
  padding:10px 14px;
  font-family:"JetBrains Mono", monospace;
  font-size:12px;
}
.search-pill .ico{margin-right:8px;color:var(--muted);font-size:15px}
.search-pill input{
  flex:1;border:0;outline:0;background:transparent;
  font-family:"JetBrains Mono", monospace;font-size:12px;color:var(--ink);
}
.search-pill input::placeholder{color:var(--muted)}
.select-pill select{
  flex:1;appearance:none;-webkit-appearance:none;
  border:0;background:transparent;
  font-family:"JetBrains Mono", monospace;font-size:12px;color:var(--ink);
  outline:0;width:100%;padding-right:18px;
}
.select-pill.small{padding:8px 12px}
.chev{position:absolute;right:14px;pointer-events:none;color:var(--muted);font-size:14px;transform:translateY(-1px)}
.link-btn{
  background:none;border:0;color:var(--muted);font-size:12px;cursor:pointer;
}
.link-btn:hover{color:var(--ink)}
.count{
  font-size:12px;color:var(--muted);
  margin:8px 0 0;
  letter-spacing:0.02em;
}

/* LIST — screenshot row: thin top rule, title serif large, location mono, tag pill, arrow */
.list{margin-top:12px;border-top:1px solid var(--line)}
.row{
  display:grid;
  grid-template-columns: 1.6fr 0.9fr 0.6fr 32px;
  gap:16px;
  align-items:center;
  padding:22px 4px;
  border-bottom:1px solid var(--line);
  cursor:pointer;
}
.row:hover{background:rgba(242,234,221,0.5)}
.row-title{
  font-family:"Instrument Serif", Georgia, serif;
  font-size:24px;line-height:1.15;color:var(--ink);
}
.row-company{
  font-family:"JetBrains Mono", monospace;
  font-size:11px;color:var(--muted);letter-spacing:0.03em;
  margin-top:4px;
}
.row-loc{
  font-family:"JetBrains Mono", monospace;
  font-size:11px;color:var(--muted);line-height:1.4;
}
.tag{
  font-family:"JetBrains Mono", monospace;
  font-size:10px;letter-spacing:0.05em;text-transform:uppercase;
  background:var(--tag-bg);color:var(--tag-ink);
  padding:4px 8px;border-radius:999px;
  display:inline-block;
  white-space:nowrap;
}
.arrow{color:var(--accent);font-size:20px;text-align:right}
.empty{padding:24px 0;color:var(--muted)}
.board-foot{
  margin-top:18px;display:flex;justify-content:space-between;gap:12px;
  font-size:11px;color:var(--muted);flex-wrap:wrap;
}
.board-foot a{color:var(--ink-2)}
.board-foot code{background:var(--pill);padding:1px 4px;border-radius:4px}

/* Drawer */
.drawer[hidden]{display:none}
.drawer{position:fixed;inset:0;z-index:50}
.drawer-backdrop{position:absolute;inset:0;background:rgba(61,44,35,0.32)}
.drawer-panel{
  position:absolute;right:0;top:0;bottom:0;width:min(560px, 92vw);
  background:var(--bg);border-left:1px solid var(--line);
  padding:28px 24px;overflow:auto;
}
.drawer-x{position:absolute;top:14px;right:14px;background:none;border:0;font-size:18px;cursor:pointer;color:var(--muted)}
.drawer h2{font-family:"Instrument Serif", serif;font-size:28px;margin:6px 0}
.drawer .meta{font-family:"JetBrains Mono", monospace;font-size:11px;color:var(--muted)}
.drawer .snippet{font-family:Georgia, serif;font-size:15px;line-height:1.5;color:var(--ink-2);margin-top:14px;white-space:pre-wrap}
.drawer .actions{margin-top:18px;display:flex;gap:10px;flex-wrap:wrap}
.drawer .actions a{font-family:"JetBrains Mono", monospace;font-size:12px;background:var(--ink);color:#fff;padding:8px 12px;border-radius:999px;text-decoration:none}
.drawer .actions a.secondary{background:transparent;color:var(--ink);border:1px solid var(--line)}

@media (max-width:900px){
  .hero h1{font-size:42px}
  .controls{grid-template-columns:1fr}
  .controls.sub{grid-template-columns:1fr 1fr}
  .row{grid-template-columns:1fr;gap:8px}
  .arrow{display:none}
}
