
   
      .container {
        max-width: 900px;
        margin: auto;
      }
      .term-block {
        display: flex;
        align-items: flex-start;
        margin-bottom: 2rem;
      }
      .term-block:nth-child(even) {
        flex-direction: row-reverse;
      }
      .term-image {
        flex: 0 0 150px;
        margin: 0.5rem;
      }
      .term-image img {
        width: 150px;
        height: 150px;
        object-fit: cover;
        border-radius: 5px;
      }
      .term-description {
        flex: 1;
      }
      .term-description b {
        font-size: 1.2em;
        color: #5a2a4f;
      }
      footer {
        text-align: center;
        margin-top: 4rem;
        font-size: 0.9em;
      }
      .new-badge {
        display: inline-block;
        vertical-align: middle;
        width: 30px; /* adjust size as needed */
        margin-right: 6px; /* space between badge and text */
      }
      .new-badge img {
        width: 100%;
        filter: drop-shadow(0 0 0px #e49ac2);
      }

      .glossary-letter {
        margin-top: 0;
        margin-bottom: 0.5rem;
      }

      /* --- NK Glossary helpers (added) --- */
      .nk-glossary {
        overflow: auto;
        margin-block: 1.25rem;
      }
      .narcy-inline {
        float: right;
        width: clamp(96px, 22vw, 160px);
        height: auto;
        border-radius: 50%;
        shape-outside: circle(50%);
        margin: 0 0 0.75rem 1rem;
      }
      .narcy-inline.left {
        float: left;
        margin: 0 1rem 0.75rem 0;
      }
      @media (max-width: 640px) {
        .narcy-inline {
          float: none;
          display: block;
          margin: 0 auto 0.75rem;
          shape-outside: none;
        }
      }
      :root {
        --nk-basic: #005fb8;
        --nk-muted: #eef3f8;
      }
      .nk-tag {
        display: inline-block;
        font: 600 12px/1.6 system-ui, sans-serif;
        padding: 0.1rem 0.5rem;
        border-radius: 999px;
        background: var(--nk-muted);
      }
      .nk-tag.basic {
        background: color-mix(in srgb, var(--nk-basic) 15%, white);
        color: var(--nk-basic);
      }
      .nk-term.nk-basic > strong {
        color: var(--nk-basic);
      }
      :root {
        --nk-basic: #e174ae; /* Narcy pink/magenta */
        --nk-muted: #e174ae; /* softer light pink backdrop */
      }
      .nk-tag.basic {
        background: color-mix(in srgb, var(--nk-basic) 15%, white);
        color: var(--nk-basic);
      }
      .nk-term.nk-basic > strong {
        color: var(--nk-basic);
      }
   
  .quote-label {
    display: block;
    text-align: center;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
    color: #aaa;
    margin-bottom: 5px;
    text-transform: uppercase;
  }

  .quote-block {
    text-align: center;
    max-width: 900px;
    margin: 35px auto;
    color: #ccc;
    font-style: italic;
    padding: 0 20px;
  }
  .glossary-orientation {
  margin: 1rem 0;
  opacity: 0.95;
}

.glossary-entry-points {
  margin-bottom: 0.25rem;
}

.chip.core-term {
  font-weight: 500;
}



/* =========================================================
   OFFICIAL NARCYNARC GLOSSARY — LIVE TERM SEARCH
   Builds itself from each glossary <li id> + first <strong>.
   ========================================================= */
.glossary-term-search {
  position: relative;
  width: min(760px, calc(100% - 24px));
  margin: 1.35rem auto 1.8rem;
  padding: 1rem;
  border: 1px solid rgba(228, 154, 194, 0.42);
  border-left: 5px solid #e49ac2;
  border-radius: 14px;
  background:
    linear-gradient(135deg, rgba(228, 154, 194, 0.10), transparent 58%),
    #15161a;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
  box-sizing: border-box;
  text-align: left;
  z-index: 20;
}

.glossary-term-search,
.glossary-term-search * {
  box-sizing: border-box;
}

.glossary-term-search__label {
  display: block;
  margin: 0 0 0.55rem;
  color: #e49ac2;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.glossary-term-search__control {
  position: relative;
}

.glossary-term-search__icon {
  position: absolute;
  left: 0.95rem;
  top: 50%;
  width: 1.25rem;
  height: 1.25rem;
  color: #e49ac2;
  transform: translateY(-50%);
  pointer-events: none;
}

#glossary-term-search-input {
  display: block;
  width: 100%;
  min-height: 52px;
  margin: 0;
  padding: 0.8rem 2.9rem 0.8rem 3rem;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 11px;
  outline: none;
  background: rgba(255, 255, 255, 0.065);
  color: #fff;
  font: inherit;
  font-size: 1rem;
  line-height: 1.3;
  caret-color: #e49ac2;
}

#glossary-term-search-input::placeholder {
  color: #aeb4bf;
  opacity: 1;
}

#glossary-term-search-input:focus {
  border-color: #e49ac2;
  box-shadow: 0 0 0 3px rgba(228, 154, 194, 0.16);
}

.glossary-term-search__clear {
  position: absolute;
  right: 0.6rem;
  top: 50%;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #c6cad2;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
  transform: translateY(-50%);
}

.glossary-term-search__clear:hover,
.glossary-term-search__clear:focus-visible {
  background: rgba(228, 154, 194, 0.14);
  color: #fff;
  outline: none;
}

.glossary-term-search__hint {
  margin: 0.6rem 0 0;
  color: #aeb4bf;
  font-size: 0.86rem;
  line-height: 1.4;
}

.glossary-term-search__results {
  position: absolute;
  left: 1rem;
  right: 1rem;
  top: calc(100% - 0.75rem);
  max-height: min(52vh, 420px);
  margin: 0;
  padding: 0.45rem;
  overflow-y: auto;
  border: 1px solid rgba(228, 154, 194, 0.45);
  border-radius: 0 0 12px 12px;
  background: #101116;
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.46);
  list-style: none;
  z-index: 100;
}

.glossary-term-search__results[hidden] {
  display: none;
}

.glossary-term-search__result {
  margin: 0;
  padding: 0;
}

.glossary-term-search__result + .glossary-term-search__result {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.glossary-term-search__option {
  display: block;
  width: 100%;
  padding: 0.72rem 0.8rem;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #f2f3f5;
  font: inherit;
  line-height: 1.3;
  text-align: left;
  cursor: pointer;
}

.glossary-term-search__option:hover,
.glossary-term-search__option[aria-selected="true"] {
  background: rgba(228, 154, 194, 0.14);
  color: #fff;
}

.glossary-term-search__term {
  display: block;
  font-weight: 700;
}

.glossary-term-search__slug {
  display: block;
  margin-top: 0.16rem;
  color: #9ca3af;
  font-size: 0.76rem;
  font-weight: 400;
}

.glossary-term-search__empty {
  padding: 0.8rem;
  color: #b9bec7;
  text-align: center;
}

.glossary-search-arrival {
  animation: glossary-search-arrival 2.2s ease;
}

@keyframes glossary-search-arrival {
  0%, 28% {
    background-color: rgba(228, 154, 194, 0.19);
    box-shadow: 0 0 0 6px rgba(228, 154, 194, 0.10);
  }
  100% {
    background-color: transparent;
    box-shadow: none;
  }
}

@media (max-width: 560px) {
  .glossary-term-search {
    width: calc(100% - 16px);
    margin: 1.1rem 8px 1.55rem;
    padding: 0.85rem;
  }

  .glossary-term-search__results {
    left: 0.85rem;
    right: 0.85rem;
    top: calc(100% - 0.6rem);
  }
}

@media (prefers-reduced-motion: reduce) {
  .glossary-search-arrival {
    animation: none;
  }
}

/* --- Glossary Share Button v2 --- */
.glossary-definition-share{
  display:flex;
  justify-content:flex-end;
  margin:.85rem 0 1.1rem;
}
.glossary-definition-share__button{
  display:inline-flex;
  align-items:center;
  gap:.45rem;

  padding:.55rem .85rem;

  border-radius:999px;
  border:1px solid rgba(228,154,194,.45);

  background:rgba(228,154,194,.08);

  color:#ddd;

  font:inherit;
  font-size:.74rem;      /* was .82rem */
  font-weight:600;       /* was 700 */

  cursor:pointer;
}
.glossary-definition-share__button:hover{
  border-color:#e49ac2;background:rgba(228,154,194,.16);color:#fff;
}
.glossary-definition-share__button[data-state="copied"]{
  border-color:#74c69d;
}
@media (max-width: 700px){

  .glossary-definition-share{
      justify-content:center;
      margin:1rem 0 1.25rem;
  }

}
.glossary-definition-share__icon{
    font-size:.95rem;
}
