/* glossary.css — คำที่กดได้ + แถบคำอธิบายลอย */
.gl {
  border-bottom: 1.5px dotted var(--accent);
  cursor: help; color: inherit; padding-bottom: 1px;
}
.gl:hover, .gl:focus-visible { background: var(--soft); border-radius: 4px; outline: none; }
.gl::after { content: "?"; font-size: .62em; vertical-align: super; color: var(--accent); margin-left: 1px; font-weight: 700; }

#glPop {
  position: fixed; z-index: 60; width: 340px; max-width: calc(100vw - 16px);
  background: var(--card); color: var(--ink); border: 1px solid var(--line); border-radius: 16px;
  box-shadow: 0 10px 34px rgba(60, 30, 80, .22); padding: 12px 14px;
  opacity: 0; transform: translateY(6px); pointer-events: none; transition: opacity .18s, transform .18s;
}
#glPop.show { opacity: 1; transform: none; pointer-events: auto; }
#glPop.sheet {
  left: 0 !important; right: 0; bottom: 0; top: auto !important; width: 100%; max-width: none;
  border-radius: 20px 20px 0 0; padding-bottom: max(16px, env(safe-area-inset-bottom));
  transform: translateY(100%);
}
#glPop.sheet.show { transform: none; }
.gl-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.gl-th { font-family: var(--fh), sans-serif; font-size: 1.05rem; color: var(--accent); }
.gl-zh { color: var(--muted); font-size: .95rem; }
.gl-x { border: 0; background: var(--bg); color: var(--muted); border-radius: 50%; width: 28px; height: 28px; cursor: pointer; font: inherit; flex: none; }
.gl-body { margin: 6px 0 10px; font-size: .9rem; line-height: 1.55; }
.gl-all { border: 1px solid var(--line); background: var(--bg); color: var(--accent); border-radius: 999px; padding: 5px 12px; font: inherit; font-size: .82rem; cursor: pointer; }

#glAll { width: min(94vw, 620px); max-height: 86vh; }
#glAll .gl-dlg { padding: 16px; display: flex; flex-direction: column; max-height: 86vh; }
.gl-search { margin: 10px 0; }
.gl-list { overflow-y: auto; display: grid; gap: 8px; }
.gl-item { background: var(--bg); border: 1px solid var(--line); border-radius: 14px; padding: 9px 12px; }
.gl-item b { font-family: var(--fh), sans-serif; }
.gl-item p { margin: 3px 0 0; font-size: .86rem; line-height: 1.5; color: var(--ink); }

/* ไม่ต้องขีดเส้นในโปสเตอร์และตอนพิมพ์ */
.poster .gl, .poster .gl::after { border: 0; }
@media print { .gl { border: 0; } .gl::after { content: ""; } #glPop, #glAll { display: none !important; } }