/* ═══════════════════════════════════════════════════════════════════
   The EKG Dictionary — css/ekg-dictionary.css
   A scholarly reference over the EKGLab palette (sibling to the Reference
   Desk): deep-indigo chrome, a Fraunces hero title, and a quiet colour key
   for the eleven term categories. Everything else stays Inter and calm so
   the colour key is the one signature. Scoped under .ekgdx.
   ═══════════════════════════════════════════════════════════════════ */
.ekgdx {
  --ink:#161b22; --ink2:#525c6b; --ink3:#8b93a1;
  --hair:rgba(22,33,52,.10); --bg:#f5f7fb; --card:#ffffff;
  --slate:#232e3a; --indigo:#0f084b; --blue:#26408b;
  font-family:'Inter',system-ui,sans-serif; color:var(--ink); line-height:1.6;
  background:
    radial-gradient(1100px 420px at 84% -150px, rgba(15,8,75,.06), transparent 60%),
    radial-gradient(760px 360px at 8% 4%, rgba(18,165,148,.05), transparent 62%),
    var(--bg);
  min-height:100vh;
}
.ekgdx *{box-sizing:border-box;}
.ekgdx .dx-wrap{max-width:900px;margin:0 auto;padding:0 26px 120px;}

/* ── hero ── */
.ekgdx .dx-hero{padding:46px 0 6px;}
.ekgdx .dx-eyebrow{display:inline-flex;align-items:center;gap:7px;font-size:11.5px;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;color:var(--indigo);
  background:rgba(15,8,75,.06);padding:5px 12px 5px 9px;border-radius:999px;}
.ekgdx .dx-eyebrow .material-symbols-outlined{font-size:15px;}
.ekgdx h1.dx-title{font-family:'Fraunces',Georgia,serif;font-weight:600;
  font-size:clamp(34px,4.6vw,50px);letter-spacing:-.7px;line-height:1.02;margin:16px 0 12px;color:#10151c;}
.ekgdx .dx-lede{font-size:17px;line-height:1.56;color:var(--ink2);margin:0;max-width:640px;}
.ekgdx .dx-lede b{color:var(--ink);font-weight:600;}

/* ── filter ── */
.ekgdx .dx-filter{margin:26px 0 0;display:flex;align-items:center;gap:10px;background:#fff;
  border:1px solid var(--hair);border-radius:15px;padding:4px 6px 4px 15px;
  box-shadow:0 1px 2px rgba(22,33,52,.05),0 20px 46px -34px rgba(15,8,75,.5);
  transition:border-color .18s,box-shadow .18s;max-width:640px;}
.ekgdx .dx-filter:focus-within{border-color:rgba(15,8,75,.26);
  box-shadow:0 1px 2px rgba(22,33,52,.05),0 20px 46px -30px rgba(15,8,75,.55);}
.ekgdx .dx-filter > .material-symbols-outlined{font-size:20px;color:var(--ink3);flex:0 0 auto;}
.ekgdx .dx-filter input{flex:1;border:0;background:transparent;font:inherit;font-size:16px;
  color:var(--ink);padding:12px 4px;outline:none;min-width:0;}
.ekgdx .dx-filter input::placeholder{color:var(--ink3);}
.ekgdx .dx-filter input::-webkit-search-cancel-button{-webkit-appearance:none;}
.ekgdx .dx-clear{flex:0 0 auto;width:34px;height:34px;border:0;background:transparent;border-radius:9px;
  cursor:pointer;color:var(--ink3);display:inline-flex;align-items:center;justify-content:center;transition:background .15s,color .15s;}
.ekgdx .dx-clear:hover{background:#f1f4f8;color:var(--ink);}
.ekgdx .dx-clear .material-symbols-outlined{font-size:19px;}
.ekgdx .dx-count{margin:11px 3px 0;font-size:12.5px;font-weight:600;color:var(--ink3);letter-spacing:.01em;}

/* ── category rail (sticky) ── */
.ekgdx .dx-rail{position:sticky;top:62px;z-index:20;display:flex;gap:7px;overflow-x:auto;
  margin:22px -26px 4px;padding:11px 26px;scrollbar-width:none;
  background:linear-gradient(rgba(245,247,251,.86),rgba(245,247,251,.86));
  backdrop-filter:blur(10px) saturate(1.2);-webkit-backdrop-filter:blur(10px) saturate(1.2);
  border-bottom:1px solid var(--hair);}
.ekgdx .dx-rail::-webkit-scrollbar{display:none;}
.ekgdx .dx-chip{flex:0 0 auto;display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;
  color:var(--ink2);text-decoration:none;background:#fff;border:1px solid var(--hair);
  padding:6px 13px 6px 10px;border-radius:999px;white-space:nowrap;transition:all .15s;}
.ekgdx .dx-chip:hover{color:var(--ink);border-color:rgba(15,8,75,.24);}
.ekgdx .dx-chip-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto;}
.ekgdx .dx-chip-active{background:var(--indigo);color:#fff;border-color:var(--indigo);}
.ekgdx .dx-chip-off{opacity:.34;}

/* ── category section ── */
.ekgdx .dx-cat{padding:30px 0 2px;scroll-margin-top:122px;}
.ekgdx .dx-cat-head{display:flex;align-items:center;gap:11px;margin:0 0 16px;
  font-family:'Inter',system-ui,sans-serif;font-size:19px;font-weight:700;letter-spacing:-.2px;color:#10151c;}
.ekgdx .dx-cat-dot{width:12px;height:12px;border-radius:50%;flex:0 0 auto;background:var(--cat);
  box-shadow:0 0 0 4px color-mix(in srgb, var(--cat) 16%, transparent);}
.ekgdx .dx-cat-count{margin-left:2px;font-size:12px;font-weight:700;color:var(--ink3);
  background:#eef1f6;border-radius:999px;padding:2px 9px;letter-spacing:.02em;}

/* ── term card ── */
.ekgdx .dx-terms{display:flex;flex-direction:column;gap:11px;}
.ekgdx .dx-term{background:var(--card);border:1px solid var(--hair);border-left:3px solid var(--cat);
  border-radius:13px;padding:16px 20px 17px;box-shadow:0 1px 2px rgba(22,33,52,.04);
  scroll-margin-top:128px;transition:box-shadow .18s,border-color .18s,transform .18s;}
.ekgdx .dx-term:hover{box-shadow:0 1px 2px rgba(22,33,52,.05),0 16px 34px -26px rgba(15,8,75,.4);}
.ekgdx .dx-term-head{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 12px;margin:0 0 6px;}
.ekgdx .dx-term-name{margin:0;font-size:16.5px;font-weight:700;letter-spacing:-.2px;color:#11161d;}
.ekgdx .dx-term-aliases{font-size:12.5px;font-weight:500;color:var(--ink3);}
.ekgdx .dx-term-def{margin:0;font-size:14.7px;line-height:1.62;color:#38414d;}
.ekgdx .dx-term-note{margin:11px 0 0;font-size:13px;line-height:1.55;color:#6b5414;
  background:#fff8ea;border:1px solid #f0d89a;border-radius:9px;padding:9px 13px;}
.ekgdx .dx-note-label{display:inline-block;font-weight:700;font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;color:#9a7b1f;margin-right:8px;}

/* deep-link / filter-jump flash */
.ekgdx .dx-term.dx-flash{animation:dxflash 2s ease;}
@keyframes dxflash{
  0%,18%{border-color:var(--cat);box-shadow:0 0 0 3px color-mix(in srgb, var(--cat) 30%, transparent),0 14px 30px -20px rgba(15,8,75,.5);}
  100%{border-color:var(--hair);box-shadow:0 1px 2px rgba(22,33,52,.04);}
}

/* empty state */
.ekgdx .dx-empty{margin:40px auto;text-align:center;color:var(--ink2);font-size:15.5px;
  background:#fff;border:1px solid var(--hair);border-radius:14px;padding:30px 24px;max-width:520px;}
.ekgdx .dx-empty b{color:var(--ink);font-weight:600;}

@media (max-width:640px){
  .ekgdx .dx-wrap{padding:0 16px 90px;}
  .ekgdx .dx-rail{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px;}
  .ekgdx h1.dx-title{font-size:clamp(28px,8vw,36px);}
}
@media (prefers-reduced-motion:reduce){
  .ekgdx .dx-term.dx-flash{animation:none;}
  .ekgdx *{scroll-behavior:auto !important;}
}