/* DD Briefs site — same design tokens as the brief template */
:root {
  --bg:#0a0d11; --bg-elev:#11151b; --bg-elev-2:#161b22;
  --border:#21262d; --border-soft:#1a1f26;
  --ink:#e6e1d3; --ink-mute:#a7a094; --ink-dim:#6e6a5e;
  --accent:#c9a86a; --accent-glow:#e8c98a;
  --pos:#5fb878; --neg:#d96666; --warn:#d9b066;
  --fd:'Fraunces',Georgia,serif; --fb:'Manrope',-apple-system,sans-serif;
  --fm:'JetBrains Mono','Courier New',monospace;
}
* { margin:0; padding:0; box-sizing:border-box; }
body { background:var(--bg); color:var(--ink); font-family:var(--fb); font-size:15px; line-height:1.6; -webkit-font-smoothing:antialiased; }
a { color:var(--accent); text-decoration:none; } a:hover { color:var(--accent-glow); }

.banner { background:#1a1208; border-bottom:1px solid var(--accent); padding:10px 28px;
  font-size:12px; line-height:1.5; color:var(--ink); }
.banner strong { color:var(--accent); }

.hero { max-width:1080px; margin:0 auto; padding:64px 24px 8px; text-align:center; }
.hero h1 { font-family:var(--fd); font-size:52px; font-weight:560; letter-spacing:-0.01em; }
.hero .tagline { color:var(--ink-mute); max-width:62ch; margin:14px auto 30px; }
.searchbar input { width:min(560px,92vw); background:var(--bg-elev); border:1px solid var(--border);
  color:var(--ink); font-family:var(--fm); font-size:15px; padding:14px 18px; border-radius:10px; outline:none; }
.searchbar input:focus { border-color:var(--accent); }
.miss-row { margin-top:14px; font-size:14px; color:var(--ink-mute); }
.linkbtn { background:none; border:none; color:var(--accent); font:inherit; cursor:pointer; text-decoration:underline; }

.controls { max-width:1080px; margin:34px auto 16px; padding:0 24px; display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.controls select { background:var(--bg-elev); color:var(--ink); border:1px solid var(--border);
  border-radius:8px; padding:8px 12px; font-family:var(--fm); font-size:12px; outline:none; cursor:pointer; }
.controls select:focus { border-color:var(--accent); }
.count { margin-left:auto; font-family:var(--fm); font-size:11.5px; color:var(--ink-dim); }

.grid { max-width:1080px; margin:0 auto 60px; padding:0 24px;
  display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:14px; }
.card { display:block; border:1px solid var(--border); background:var(--bg-elev); border-radius:12px;
  padding:18px 18px 15px; color:var(--ink); transition:border-color .15s, transform .15s; position:relative; }
.card:hover { border-color:var(--accent); transform:translateY(-2px); }
.card .tk { font-family:var(--fm); font-size:17px; font-weight:600; color:var(--accent); }
.card .co { font-size:13px; color:var(--ink); margin:3px 0 10px; min-height:2.5em; }
.card .meta { display:flex; gap:8px; flex-wrap:wrap; font-family:var(--fm); font-size:10px;
  color:var(--ink-dim); text-transform:uppercase; letter-spacing:0.08em; }
.card .meta .sector { color:var(--ink-mute); }
.badge { position:absolute; top:14px; right:14px; font-family:var(--fm); font-size:9.5px;
  letter-spacing:0.1em; text-transform:uppercase; padding:3px 8px; border-radius:5px; }
.badge.fresh { color:var(--pos); background:rgba(95,184,120,0.12); }
.badge.aging { color:var(--warn); background:rgba(217,176,102,0.12); }
.badge.stale { color:var(--neg); background:rgba(217,102,102,0.12); }
.card .refresh { display:none; margin-top:10px; font-size:11.5px; }
.card.is-aging .refresh, .card.is-stale .refresh { display:block; }
.empty { text-align:center; color:var(--ink-dim); padding:40px 0 80px; }

.myreqs { max-width:1080px; margin:0 auto 50px; padding:0 24px; }
.myreqs-label { font-family:var(--fm); font-size:10.5px; letter-spacing:0.16em; text-transform:uppercase; color:var(--ink-dim); margin-bottom:8px; }
.myreqs .mr { font-family:var(--fm); font-size:12px; color:var(--ink-mute); padding:6px 0; border-top:1px solid var(--border-soft); }
.myreqs .mr b { color:var(--ink); }
.mr .st-published { color:var(--pos); } .mr .st-pending { color:var(--warn); }
.mr .st-rejected, .mr .st-failed { color:var(--neg); }

.site-footer { border-top:1px solid var(--border-soft); padding:28px 24px 50px;
  max-width:1080px; margin:0 auto; font-size:12px; color:var(--ink-dim); }
.site-footer p { margin-bottom:8px; max-width:90ch; }

/* Modal */
.modal { position:fixed; inset:0; background:rgba(5,7,10,0.75); backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center; z-index:100; padding:20px; }
.modal-card { background:var(--bg-elev); border:1px solid var(--border); border-radius:14px;
  width:min(440px,100%); padding:26px 26px 22px; position:relative; }
.modal-x { position:absolute; top:10px; right:14px; background:none; border:none; color:var(--ink-dim);
  font-size:22px; cursor:pointer; } .modal-x:hover { color:var(--ink); }
.modal-card h3 { font-family:var(--fd); font-size:23px; margin-bottom:4px; }
.modal-sub { font-size:12.5px; color:var(--ink-mute); margin-bottom:18px; }
.fld { display:block; font-family:var(--fm); font-size:11px; letter-spacing:0.1em;
  text-transform:uppercase; color:var(--ink-dim); margin-bottom:14px; }
.fld input { display:block; width:100%; margin-top:6px; background:var(--bg); border:1px solid var(--border);
  color:var(--ink); font-family:var(--fm); font-size:15px; padding:10px 12px; border-radius:8px; outline:none; }
.fld input:focus { border-color:var(--accent); }
.ack { display:flex; gap:9px; font-size:12.5px; color:var(--ink-mute); margin-bottom:16px; cursor:pointer; }
.ack input { margin-top:3px; accent-color:var(--accent); }
.ts { min-height:66px; margin-bottom:14px; }
.btn { width:100%; background:var(--accent); color:#0a0d11; border:none; border-radius:8px;
  font-family:var(--fb); font-weight:800; font-size:14px; padding:12px; cursor:pointer; }
.btn:hover { background:var(--accent-glow); }
.btn:disabled { background:var(--bg-elev-2); color:var(--ink-dim); cursor:not-allowed; }
.req-msg { font-size:12.5px; margin-top:12px; min-height:1.4em; color:var(--ink-mute); }
.req-msg.ok { color:var(--pos); } .req-msg.err { color:var(--neg); }

/* Static content pages */
.page { max-width:760px; margin:0 auto; padding:50px 24px 80px; }
.page h1 { font-family:var(--fd); font-size:36px; margin-bottom:18px; }
.page h2 { font-family:var(--fd); font-size:21px; margin:28px 0 10px; }
.page p, .page li { color:var(--ink-mute); margin-bottom:12px; font-size:14px; }
.page ul { padding-left:22px; }
.page .back { font-family:var(--fm); font-size:12px; display:inline-block; margin-bottom:26px; }

@media (max-width:640px) {
  .hero h1 { font-size:38px; }
  .controls { gap:8px; } .controls select { flex:1 1 44%; }
  .count { width:100%; text-align:left; margin:2px 0 0; }
}

/* First-visit acknowledgment gate */
.gate { position:fixed; inset:0; background:rgba(5,7,10,0.92); backdrop-filter:blur(6px);
  display:flex; align-items:center; justify-content:center; z-index:200; padding:20px; }
.gate-card { background:var(--bg-elev); border:1px solid var(--border); border-radius:16px;
  max-width:560px; padding:34px 34px 30px; text-align:left; }
.gate-eyebrow { font-family:var(--fm); font-size:11px; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--accent); margin-bottom:14px; }
.gate-card h2 { font-family:var(--fd); font-size:26px; line-height:1.2; margin-bottom:16px; }
.gate-card p { color:var(--ink-mute); font-size:14px; margin-bottom:14px; }
.gate-links { font-family:var(--fm); font-size:12px; }
.gate-card .btn { margin-top:8px; }

/* The [hidden] attribute must beat .gate/.modal display:flex (class selectors
   otherwise override the UA hidden rule, so toggling .hidden did nothing). */
.gate[hidden], .modal[hidden] { display: none !important; }