/* Demand Radar — intel-terminal. Tokens mirror DESIGN.md. */
:root{
  --ink:#0E0F0D; --surface:#181A16; --surface-raised:#20231C; --hairline:#2E322A;
  --text:#ECEAE0; --text-2:#9A9C90; --text-3:#6E7064;
  --amber:#E6A93C; --amber-strong:#F2B84A; --on-amber:#0E0F0D;
  --signal:#6FBF8E; --signal-dim:#3E6E55; --clay:#C2603F;
  --r-sm:3px; --r-md:6px; --r-lg:10px;
  --disp:"Bricolage Grotesque",Georgia,serif;
  --body:"Hanken Grotesk",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --maxw:1180px;
}
*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0; background:var(--ink); color:var(--text);
  font-family:var(--body); font-size:15px; line-height:1.6;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
a{color:inherit; text-decoration:none;}
.mono{font-family:var(--mono); letter-spacing:.02em;}
.dim{color:var(--text-3);}

/* ---------- header ---------- */
.site-head{border-bottom:1px solid var(--hairline); position:sticky; top:0; z-index:20;
  background:rgba(14,15,13,.86); backdrop-filter:saturate(120%) blur(8px);}
.head-inner{max-width:var(--maxw); margin:0 auto; padding:22px 26px 0;}
.head-row{display:flex; align-items:flex-end; justify-content:space-between; gap:16px;}
.eyebrow{font-family:var(--mono); font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--text-3);}
.wordmark{font-family:var(--disp); font-weight:600; font-size:28px; letter-spacing:-.025em;
  margin:5px 0 0; display:flex; align-items:center; gap:10px;}
.wordmark .dot{width:9px; height:9px; border-radius:50%; background:var(--amber);
  box-shadow:0 0 0 0 rgba(230,169,60,.45); animation:pulse 3.4s ease-out infinite;}
.counts{font-size:12px; color:var(--text-2); text-align:right; line-height:1.6; white-space:nowrap;}
.counts .live{color:var(--signal); display:block;}

/* radar sweep — subtle, one pass on load */
.sweep{height:1px; margin:18px 0 0; background:var(--hairline); position:relative; overflow:hidden;}
.sweep::after{content:""; position:absolute; top:0; left:-40%; width:40%; height:100%;
  background:linear-gradient(90deg,transparent,var(--signal),transparent); opacity:.7;
  animation:sweep 1.25s cubic-bezier(.4,0,.2,1) .15s 1 both;}

.controls{display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:16px 0 0;}
.search{flex:1; min-width:240px; display:flex; align-items:center; gap:9px;
  background:var(--surface); border:1px solid var(--hairline); border-radius:var(--r-md); padding:0 11px;
  transition:border-color .12s ease;}
.search:focus-within{border-color:var(--signal-dim);}
.search .s-ico{color:var(--text-3); display:flex;}
.search input{flex:1; background:transparent; border:0; outline:0; color:var(--text);
  font-family:var(--mono); font-size:13px; padding:11px 0;}
.search input::placeholder{color:var(--text-3);}
.search kbd{font-family:var(--mono); font-size:11px; color:var(--text-3);
  border:1px solid var(--hairline); border-radius:var(--r-sm); padding:1px 6px;}
.chips{display:flex; gap:7px; flex-wrap:wrap;}
.chip{font-family:var(--mono); font-size:11px; color:var(--text-2); cursor:pointer;
  background:transparent; border:1px solid var(--hairline); border-radius:999px; padding:5px 11px;
  transition:border-color .12s ease,color .12s ease;}
.chip:hover,.chip[aria-pressed="true"]{border-color:var(--signal-dim); color:var(--signal);}
.result-line{font-size:11px; color:var(--text-3); padding:14px 0 16px; margin:0;}

/* ---------- grid + card ---------- */
.grid{max-width:var(--maxw); margin:0 auto; padding:26px;
  display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:14px;}
.card{position:relative; background:var(--surface); border:1px solid var(--hairline);
  border-radius:var(--r-lg); padding:17px 17px 15px; display:flex; flex-direction:column;
  transition:transform .12s ease,border-color .12s ease;}
.card:hover{transform:translateY(-2px); border-color:var(--signal-dim);}
.card-link{position:absolute; inset:0; z-index:1;}
.card>*:not(.card-link){position:relative; z-index:2;}
.card-top{display:flex; align-items:center; justify-content:space-between; gap:12px;}
.score{font-family:var(--mono); font-weight:500; font-size:13px; color:var(--amber);}
.score-max{color:var(--text-3); font-weight:400;}
.meter{display:flex; gap:2px; width:118px;}
.tick{flex:1; height:14px; border-radius:var(--r-sm);}
.tick.t-on{background:var(--signal);}
.tick.t-amber{background:var(--amber);}
.tick.t-empty{background:var(--signal-dim); opacity:.45;}
.card-name{font-family:var(--disp); font-weight:600; font-size:19px; letter-spacing:-.01em;
  margin:11px 0 5px; color:var(--text);}
.card-cat{font-size:14px; color:var(--text-2); line-height:1.45; margin:0; min-height:40px;}
.card-meta{font-size:12px; color:var(--text-3); margin:10px 0 12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.card-tags{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:13px;}
.pill{font-family:var(--mono); font-size:11px; color:var(--text-2);
  border:1px solid var(--hairline); border-radius:999px; padding:3px 9px; transition:border-color .12s ease,color .12s ease;}
.pill:hover{border-color:var(--signal-dim); color:var(--signal);}

/* buy CTA — the only amber fill by default */
.buy{margin-top:auto; display:flex; align-items:center; justify-content:center; gap:7px;
  background:var(--amber); color:var(--on-amber); font-family:var(--mono); font-weight:500;
  font-size:12px; letter-spacing:.03em; border-radius:var(--r-md); padding:10px 12px;
  transition:background .12s ease;}
.buy:hover{background:var(--amber-strong);}
.buy .arr{flex:none;}

.empty{max-width:var(--maxw); margin:0 auto; padding:20px 26px 40px; color:var(--text-3); font-size:13px;}

/* ---------- detail ---------- */
.page-detail{max-width:760px; margin:0 auto; padding:26px;}
.back{display:inline-block; color:var(--text-2); font-size:12px; padding:6px 0 22px;}
.back:hover{color:var(--signal);}
.detail-head{border-bottom:1px solid var(--hairline); padding-bottom:22px; margin-bottom:8px;}
.detail-head .card-top{max-width:240px;}
.score-lg{font-size:15px;}
.detail-head h1{font-family:var(--disp); font-weight:700; font-size:38px; letter-spacing:-.025em;
  line-height:1.05; margin:16px 0 8px;}
.detail-cat{font-size:18px; color:var(--text-2); line-height:1.4; margin:0 0 12px;}
.detail-meta{font-size:12px; color:var(--text-3); margin:4px 0;}

.identity-body{font-size:15px; line-height:1.72; color:var(--text); padding:8px 0 4px;}
.identity-body h1,.identity-body h2,.identity-body h3{font-family:var(--disp); font-weight:600;
  letter-spacing:-.01em; color:var(--text); margin:1.8em 0 .5em; line-height:1.2;}
.identity-body h2{font-size:21px;} .identity-body h3{font-size:17px;}
.identity-body a{color:var(--signal); text-decoration:underline; text-underline-offset:2px; text-decoration-color:var(--signal-dim);}
.identity-body a:hover{text-decoration-color:var(--signal);}
.identity-body strong{color:var(--text); font-weight:500;}
.identity-body code{font-family:var(--mono); font-size:.86em; background:var(--surface);
  border:1px solid var(--hairline); border-radius:var(--r-sm); padding:1px 5px;}
.identity-body ul,.identity-body ol{padding-left:1.25em;}
.identity-body li{margin:.3em 0;}
.identity-body blockquote{border-left:2px solid var(--amber); margin:1em 0; padding:.2em 0 .2em 14px; color:var(--text-2);}
.identity-body table{width:100%; border-collapse:collapse; font-size:13px; margin:1.2em 0; display:block; overflow-x:auto;}
.identity-body th,.identity-body td{border:1px solid var(--hairline); padding:7px 10px; text-align:left; vertical-align:top;}
.identity-body th{font-family:var(--mono); font-weight:500; font-size:11px; text-transform:uppercase;
  letter-spacing:.05em; color:var(--text-3); background:var(--surface);}
.identity-body hr{border:0; border-top:1px solid var(--hairline); margin:1.6em 0;}

.locked{margin:30px 0 10px; border:1px solid var(--amber); border-radius:var(--r-lg);
  background:var(--surface); padding:18px; display:flex; gap:15px; align-items:center; flex-wrap:wrap;
  position:sticky; bottom:14px;}
.locked-ico{color:var(--amber); display:flex; flex:none;}
.locked-body{flex:1; min-width:220px;}
.locked-body h2{font-family:var(--disp); font-weight:600; font-size:17px; margin:0 0 4px;}
.locked-body p{font-size:12px; color:var(--text-2); margin:0;}
.locked .buy{margin-top:0; min-width:180px;}

/* ---------- footer ---------- */
.site-foot{max-width:var(--maxw); margin:0 auto; padding:28px 26px 44px; color:var(--text-3); font-size:11px;
  border-top:1px solid var(--hairline);}
.site-foot a:hover{color:var(--signal);}

/* ---------- motion / responsive ---------- */
@keyframes sweep{from{left:-40%;} to{left:110%;}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(230,169,60,.4);} 70%{box-shadow:0 0 0 7px rgba(230,169,60,0);} 100%{box-shadow:0 0 0 0 rgba(230,169,60,0);}}
@media (max-width:560px){
  .grid{padding:18px; gap:12px; grid-template-columns:1fr;}
  .head-inner{padding:18px 18px 0;}
  .wordmark{font-size:24px;}
  .detail-head h1{font-size:30px;}
  .page-detail{padding:18px;}
}
@media (prefers-reduced-motion:reduce){
  .sweep::after{animation:none; display:none;}
  .wordmark .dot{animation:none;}
  .card{transition:none;}
}
.card:focus-within{border-color:var(--signal);}
:focus-visible{outline:2px solid var(--signal); outline-offset:2px;}