/* ═══════════════════════════════════════════════════════════════════
   The public EKG Dictionary pages: css/ekg-glossary.css
   The pages under ekg-glossary/ are GENERATED by data/build_public_glossary.mjs
   and wear css/ekg-dictionary.css, the in-app dictionary's own look (the
   Fraunces title, the colour key, the term card). This file adds only what
   a standalone page needs: the bar, a term's own page, the closing bands.
   These pages have no app shell, so they do not link css/mobile.css.
   ═══════════════════════════════════════════════════════════════════ */
html{scroll-behavior:smooth;}
body{margin:0;background:#f5f7fb;}

/* The two fonts, served from this site (fonts/, SIL Open Font License). "optional": a font
   that has arrived by the first paint is used, and one that has not is left for the next
   page, so the text is never re-set under the reader (measured 2026-10-08: with the usual
   "swap", a late font re-broke the definition's lines and moved everything below it). */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:optional;src:url('/fonts/inter-latin.woff2?v=1') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600;font-display:optional;src:url('/fonts/fraunces-600-latin.woff2?v=1') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
main.gx{padding-top:62px;}

/* ── the bar: the logo, the dictionary's name, one button ── */
.gx-bar{position:fixed;top:0;left:0;right:0;height:62px;z-index:40;box-sizing:border-box;display:flex;align-items:center;gap:12px;
  padding:0 16px;background:#fff;border-bottom:1px solid #e8eaed;font-family:'Inter',system-ui,sans-serif;}
.gx-bar .wsBrand{display:flex;align-items:center;gap:12px;flex:0 1 auto;min-width:0;margin-left:2px;}
.gx-bar .wsBrand a.gx-logo{display:block;flex:none;border-radius:6px;}
.gx-bar .wsBrand img{height:26px;width:auto;display:block;}
.gx-bar .wsBrand i{width:1px;height:22px;background:#e0e3e7;flex:none;}
.gx-bar .wsName{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:0.95rem;font-weight:700;letter-spacing:-0.2px;
  color:#181c1f;text-decoration:none;border-radius:6px;}
.gx-bar .wsName:hover{color:#26408b;}
.gx-bar .gx-grow{flex:1 1 auto;}
.gx-bar .wsCta{flex:none;display:inline-flex;align-items:center;height:34px;padding:0 16px;border-radius:999px;background:#26408b;color:#fff;
  font:700 13px Inter,system-ui,sans-serif;text-decoration:none;white-space:nowrap;transition:background-color .15s;}
.gx-bar .wsCta:hover{background:#1d3270;}
.gx-bar a:focus-visible,.gx a:focus-visible{outline:2px solid #26408b;outline-offset:3px;}

/* ── search (2026-10-15): the app's top-bar box, for terms only. Its look is the app's
   (css/glossary-search.css, copied out of css/styles.css by the builder); only its place is
   set here: centred in the bar, the dropdown under it (js/glossary-search.js sets its left
   and width). On a phone it folds to a round button and opens across the bar when tapped. ── */
.gx-bar .gx-search{flex:1 1 auto;min-width:0;display:flex;justify-content:center;}
.gx-bar .topbar-search{width:min(340px,100%);flex-shrink:1;}
.gx-bar ~ .search-dropdown{top:62px;font-family:'Inter',system-ui,sans-serif;}   /* outside main.gx, so it sets its own font; .gx-bar ~ outranks the app's top:56px */
.gx [hidden]{display:none !important;}       /* the filter hides rows and sections whose own rules set a display */
.gx .dx-filter > svg{flex:none;color:var(--ink3);}
.gx .dx-clear svg{display:block;}

/* ── the index: each term is one row that opens its page ── */
.gx a.dx-term{display:block;text-decoration:none;color:inherit;}
.gx a.dx-term:hover{border-color:color-mix(in srgb, var(--cat) 45%, rgba(22,33,52,.10));transform:translateY(-1px);}
.gx a.dx-term .dx-term-head,.gx a.dx-term .dx-term-def{display:block;}
.gx a.dx-term .dx-term-name{display:inline;margin-right:12px;}
.gx .dx-rail{top:62px;}
.gx .dx-wrap{padding-bottom:56px;}

/* ── a term's own page ── */
.gx .gx-crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:26px 0 0;font-size:13px;font-weight:600;color:var(--ink2);}
.gx .gx-crumbs a{color:var(--ink2);text-decoration:none;}
.gx .gx-crumbs a:hover{color:var(--blue);}
.gx .gx-term .dx-hero{padding-top:18px;}
.gx .gx-term .dx-eyebrow{gap:8px;padding-left:11px;}
.gx .gx-term .dx-eyebrow .dx-chip-dot{background:var(--cat);}
.gx .gx-aka{margin:0;font-size:15px;line-height:1.5;color:var(--ink2);}
.gx .gx-aka span{font-weight:700;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);margin-right:8px;}
.gx .gx-h{margin:0 0 10px;font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);}
.gx .gx-card{margin-top:24px;padding:22px 26px 24px;}
.gx .gx-card:hover{box-shadow:0 1px 2px rgba(22,33,52,.04);}
.gx .gx-card .dx-term-def{font-size:17px;line-height:1.68;color:#2c343f;}
.gx .gx-card .dx-term-note{margin-top:16px;font-size:14.5px;line-height:1.6;padding:12px 16px;}
.gx .gx-card a{color:#26408b;text-decoration:none;border-bottom:1px solid rgba(38,64,139,.28);}
.gx .gx-card a:hover{border-bottom-color:#26408b;}
/* from a term to the teaching page that shows it */
.gx .gx-see{display:flex;flex-direction:column;gap:3px;margin-top:12px;padding:14px 20px;border:1px solid var(--hair);border-radius:13px;
  background:var(--card);text-decoration:none;transition:border-color .15s,box-shadow .15s;}
.gx .gx-see:hover{border-color:#26408b;box-shadow:0 4px 14px rgba(38,64,139,.10);}
.gx .gx-see b{font-size:14.5px;font-weight:700;color:#26408b;}
.gx .gx-see span{font-size:13.5px;line-height:1.5;color:var(--ink2);}
.gx .gx-sources,.gx .gx-related{margin-top:30px;}
.gx .gx-sources .dx-ref-list{font-size:14px;}
.gx .gx-reviewed{margin:14px 0 0;font-size:13px;line-height:1.55;color:var(--ink2);}
.gx .gx-chips{display:flex;flex-wrap:wrap;gap:8px;}

/* ── closing bands: the way in, then where to go next ── */
.gx .gx-cta{background:#fff;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);padding:38px 0 42px;text-align:center;}
.gx .gx-cta .dx-wrap{padding-bottom:0;}
.gx .gx-cta h2{margin:0 0 8px;font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:clamp(24px,3vw,30px);letter-spacing:-.4px;color:#10151c;}
.gx .gx-cta p{margin:0 auto 18px;max-width:560px;font-size:15.5px;line-height:1.6;color:var(--ink2);}
.gx .gx-cta a{display:inline-flex;align-items:center;height:42px;padding:0 22px;border-radius:999px;background:#26408b;color:#fff;
  font-weight:700;font-size:14.5px;text-decoration:none;transition:background-color .15s;}
.gx .gx-cta a:hover{background:#1d3270;}
.gx .gx-more{padding:32px 0 46px;text-align:center;}
.gx .gx-more .dx-wrap{padding-bottom:0;}
.gx .gx-more-h{margin:0 0 14px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);}
.gx .gx-more-links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 12px;}
.gx .gx-more-links a{display:inline-flex;flex-direction:column;align-items:flex-start;gap:2px;padding:11px 16px;border:1px solid var(--hair);border-radius:12px;
  background:var(--card);text-decoration:none;text-align:left;transition:border-color .15s,box-shadow .15s;}
.gx .gx-more-links a:hover{border-color:#26408b;box-shadow:0 4px 14px rgba(38,64,139,.10);}
.gx .gx-more-links b{font-size:14px;font-weight:700;color:var(--ink);}
.gx .gx-more-links span{font-size:12.5px;color:var(--ink2);}
.gx .gx-more-fine{margin:20px 0 0;font-size:12px;color:var(--ink2);}
.gx .gx-more-fine a{color:var(--ink2);}

@media (max-width:640px){
  .gx-bar{padding:0 10px;gap:8px;}
  .gx-bar .wsBrand{gap:9px;margin-left:0;}
  .gx-bar .wsBrand img{height:22px;}
  .gx-bar .wsCta{height:36px;padding:0 13px;}
  .gx-bar .gx-search{justify-content:flex-end;}
  .gx-bar .topbar-search{width:36px;flex:none;}
  .gx-bar .topbar-search-input{padding:0;font-size:16px;cursor:pointer;}       /* 16px: iOS does not zoom */
  .gx-bar .topbar-search-input::placeholder{color:transparent;text-shadow:none;}
  .gx-bar .topbar-search-kbd{display:none;}
  .gx-bar .topbar-search:focus-within{position:fixed;top:12px;left:10px;right:10px;width:auto;height:38px;z-index:41;}
  .gx-bar .topbar-search:focus-within .topbar-search-input{padding:0 14px 0 36px;cursor:text;}
  .gx-bar .topbar-search:focus-within .topbar-search-input::placeholder{color:#66717f;}
  .gx .gx-card{padding:18px 18px 20px;}
  .gx .gx-card .dx-term-def{font-size:16px;}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .gx a.dx-term:hover{transform:none;}
}