/* A searchable reference library: terms first, then the passages behind them. */
body:has(#concepts-main:not(.app-hidden)) { background: #f8f9fb; }
body:has(#concepts-main:not(.app-hidden)) #app-header { background: #fff; border-bottom: 1px solid #e9ecf1; }
.cx-main {
  max-width: 1160px; padding: 44px 36px 72px; margin: 0 auto;
  font-family: var(--ui-font); color: #263044; container-type: inline-size;
}
.cx-main a { text-underline-offset: 3px; }
.cx-head { margin-bottom: 36px; }
.cx-kicker { display: flex; gap: 12px; align-items: center; margin: 0 0 12px; font-size: 12px; color: #788293; }
.cx-kicker [lang="he"] { font: 400 16px 'Frank Ruhl Libre', serif; }
.cx-title { margin: 0; color: #1d293c; font: 650 clamp(28px, 3vw, 38px)/1.2 var(--ui-font); letter-spacing: -.045em; }
.cx-lede { margin: 12px 0 24px; font-size: 15px; line-height: 1.7; color: #6b7688; }
.cx-search {
  width: min(100%, 520px); min-height: 46px; padding: 12px 16px;
  border: 1px solid #dfe4ec; border-radius: 10px; background: #fff;
  color: #263044; font: 400 15px var(--ui-font); box-sizing: border-box;
  box-shadow: 0 2px 3px #17253c03;
}
.cx-search::placeholder { color: #8791a0; }
.cx-search:focus { outline: 2px solid #345cda35; outline-offset: 2px; border-color: #90a5e3; }
.cx-index-layout { display: grid; grid-template-columns: 194px minmax(0, 1fr); gap: 40px; align-items: start; }
.cx-toc { display: flex; flex-direction: column; gap: 4px; position: sticky; top: 24px; }
.cx-toc a { padding: 10px 12px; border-radius: 8px; font-size: 13px; line-height: 1.5; color: #657185; text-decoration: none; transition: background 160ms, color 160ms; }
.cx-toc a:hover, .cx-toc a:focus-visible { background: #edf0f6; color: #345cda; }
.cx-group { margin: 0 0 36px; scroll-margin-top: 24px; }
.cx-group[hidden], .cx-grid li[hidden], .cx-abbr[hidden], .cx-empty[hidden], .cx-more[hidden] { display: none; }
.cx-h2 { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: baseline; margin: 0 0 14px; color: #283348; font: 600 17px/1.5 var(--ui-font); letter-spacing: -.02em; }
.cx-h2 [lang="he"] { color: #8490a1; font: 400 18px 'Frank Ruhl Libre', serif; }
.cx-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); list-style: none; margin: 0; padding: 0; border: 1px solid #e5e9ef; border-radius: 12px; overflow: hidden; background: #fff; gap: 0; }
.cx-grid li { border-bottom: 1px solid #eef0f4; }
.cx-grid li:nth-child(odd) { border-right: 1px solid #eef0f4; }
.cx-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; row-gap: 6px; height: 100%; box-sizing: border-box; padding: 18px 20px; text-decoration: none; transition: background 160ms; }
.cx-card:hover, .cx-card:focus-visible { background: #f4f7fc; }
.cx-card-tr { font-size: 14px; line-height: 1.5; font-weight: 600; color: #354560; overflow-wrap: anywhere; }
.cx-card-he { font: 400 18px/1.2 'Frank Ruhl Libre', serif; color: #7f8998; max-width: 135px; text-align: right; direction: rtl; }
.cx-card-en { grid-column: 1 / -1; color: #667286; font-size: 12px; line-height: 1.55; }
.cx-note { margin: 0 0 20px; color: #7b8697; font-size: 12px; line-height: 1.7; }
.cx-note pshat-loader { vertical-align: middle; margin-right: 8px; }
.cx-empty { padding: 28px; background: white; border: 1px dashed #dfe4ec; border-radius: 12px; font-size: 14px; }
.cx-abbrs { display: grid; grid-template-columns: 1fr; margin: 0; border-top: 1px solid #e5e9ef; }
.cx-abbr { display: grid; grid-template-columns: 100px minmax(0, 1fr); gap: 20px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid #e5e9ef; }
.cx-abbr dt { font: 500 20px/1.4 'Frank Ruhl Libre', serif; direction: rtl; text-align: right; color: #3d4c65; }
.cx-abbr dd { margin: 0; font-size: 13px; line-height: 1.65; color: #717d90; }
.cx-abbr dd [lang="he"] { font: 400 18px 'Frank Ruhl Libre', serif; margin-right: 8px; color: #42516b; }
.cx-abbr dd strong { color: #42516b; margin-right: 8px; }
.cx-h2-terms { margin-top: 28px; }
.cx-crumbs { display: flex; gap: 12px; align-items: center; margin-bottom: 32px; font-size: 12px; color: #9099a7; }
.cx-crumbs a { color: #66758f; text-decoration: none; }
.cx-crumbs a:hover { color: #345cda; }
.cx-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 210px; gap: 56px; align-items: start; }
.cx-name-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 16px; }
.cx-he { color: #69778d; font: 400 34px/1.2 'Frank Ruhl Libre', serif; }
.cx-meaning { color: #647186; font-size: 15px; margin: 10px 0 0; }
.cx-short { margin: 24px 0 22px; max-width: 62ch; color: #4c596e; font-size: 15px; line-height: 1.85; }
.cx-explain { display: inline-flex; gap: 22px; align-items: center; min-height: 42px; padding: 11px 17px; background: #345cda; color: #fff; border: 0; border-radius: 9px; font: 500 13px/1.5 var(--ui-font); cursor: pointer; }
.cx-explain:hover { background: #294dbe; }
.cx-explain span { font-size: 16px; opacity: .75; }
.cx-related { padding-top: 4px; }
.cx-related h2 { margin: 0 0 14px; color: #66758b; font: 500 12px/1.5 var(--ui-font); }
.cx-related-link { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 5px 12px; padding: 12px 0; border-bottom: 1px solid #e5e9ef; text-decoration: none; color: #536582; font-size: 13px; }
.cx-related-link [lang="he"] { font: 400 18px 'Frank Ruhl Libre', serif; color: #8d97a6; }
.cx-related-link:hover { color: #345cda; }
.cx-where { padding-top: 28px; border-top: 1px solid #e5e9ef; }
.cx-where .cx-h2 { margin-bottom: 6px; }
.cx-tabs { display: flex; gap: 22px; overflow: auto; margin-bottom: 18px; border-bottom: 1px solid #e5e9ef; scrollbar-width: none; }
.cx-tab { flex-shrink: 0; min-height: 44px; padding: 12px 0; border: 0; border-bottom: 2px solid transparent; background: none; color: #7a879a; font: 500 12px var(--ui-font); cursor: pointer; }
.cx-tab span { margin-left: 5px; font-size: 10px; color: #737f90; }
.cx-tab:hover { color: #345cda; }
.cx-tab.active { color: #345cda; border-bottom-color: #345cda; }
.cx-refs { list-style: none; margin: 0; padding: 0; background: #fff; border: 1px solid #e5e9ef; border-radius: 12px; overflow: hidden; }
.cx-refs li + li { border-top: 1px solid #edf0f4; }
.cx-ref { display: block; padding: 20px; text-decoration: none; transition: background 160ms; }
.cx-ref:hover, .cx-ref:focus-visible { background: #f5f8fe; }
.cx-ref-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; align-items: baseline; }
.cx-ref-he { grid-column: 1 / -1; font: 500 19px/1.45 'Frank Ruhl Libre', serif; color: #415471; direction: rtl; text-align: left; }
.cx-ref-en { font-size: 11px; color: #67758a; }
.cx-ref-n { font-size: 10px; color: #737f90; font-variant-numeric: tabular-nums; }
.cx-ref-snip { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 14px; color: #69768b; font: 400 18px/1.8 'Frank Ruhl Libre', serif; text-align: right; }
.cx-ref-snip mark { color: #385895; background: #edf2fd; border-radius: 2px; padding: 0 2px; }
.cx-more { display: block; width: 100%; margin-top: 12px; padding: 12px; min-height: 42px; border: 1px solid #e2e7ef; border-radius: 9px; background: none; color: #667996; font: 500 12px var(--ui-font); cursor: pointer; }
.cx-more:hover { background: #eef2f8; color: #345cda; }
@container (max-width: 850px) {
  .cx-detail-layout { grid-template-columns: minmax(0, 1fr); gap: 36px; }
  .cx-related { display: flex; flex-wrap: wrap; gap: 0 24px; }
  .cx-related h2 { width: 100%; }
  .cx-related-link { gap: 20px; }
  .cx-index-layout { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .cx-toc { position: static; flex-direction: row; overflow: auto; margin: 0 -4px; }
  .cx-toc a { white-space: nowrap; }
}
@container (max-width: 520px) {
  .cx-grid { grid-template-columns: 1fr; }
  .cx-grid li:nth-child(odd) { border-right: 0; }
  .cx-card { padding: 16px; }
  .cx-card-he { max-width: 145px; }
}
@media (max-width: 600px) {
  .cx-main { padding: 28px 20px 48px; }
  .cx-search { font-size: 16px; }
  .cx-crumbs { margin-bottom: 24px; }
  .cx-name-row { gap: 10px; }
  .cx-he { font-size: 28px; }
  .cx-tabs { gap: 18px; }
  .cx-ref { padding: 16px; }
  .cx-ref-he { font-size: 18px; }
  .cx-abbr { grid-template-columns: 76px minmax(0, 1fr); gap: 16px; }
}