/* === pplx nav-icons 2026-10-12: icon dock header (stage 1) === */
html body .header__nav { gap: 10px; }
html body .header__nav .pplx-ic {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 12px; list-style: none; cursor: pointer;
  color: #cfc3e6; background: rgba(255,255,255,.04); border: 1px solid rgba(168,85,247,.22);
  font-size: 16px; transition: background .2s, border-color .2s, color .2s, box-shadow .2s;
}
html body .header__nav .pplx-ic:hover, html body .header__nav details[open] > summary.pplx-ic {
  color: #fff; background: rgba(255,45,120,.16); border-color: rgba(255,45,120,.6);
  box-shadow: 0 0 14px rgba(255,45,120,.35); opacity: 1; text-shadow: none;
}
html body .header__nav .pplx-ic span {
  position: absolute; top: calc(100% + 8px); left: 50%; transform: translateX(-50%) translateY(-3px);
  padding: 3px 8px; border-radius: 6px; background: #140d20; border: 1px solid #2c1e42;
  color: #fff; font-size: 11px; font-weight: 600; letter-spacing: .3px; white-space: nowrap;
  opacity: 0; pointer-events: none; transition: opacity .15s, transform .15s; z-index: 5;
}
html body .header__nav .pplx-ic:hover span { opacity: 1; transform: translateX(-50%); }
html body .header__nav summary::-webkit-details-marker { display: none; }
html body .header__nav .pplx-more { position: relative; }
html body .header__nav .pplx-more__menu {
  position: absolute; right: 0; top: calc(100% + 10px); min-width: 170px; padding: 6px;
  background: #140d20; border: 1px solid #2c1e42; border-radius: 12px;
  box-shadow: 0 12px 30px rgba(0,0,0,.6); display: flex; flex-direction: column; gap: 2px; z-index: 20;
}
html body .header__nav .pplx-more__item {
  display: block; padding: 9px 12px; border-radius: 8px; font-size: 12px; letter-spacing: .6px; color: #e9dffb;
}
html body .header__nav .pplx-more__item:hover { background: rgba(255,45,120,.14); color: #fff; text-shadow: none; }
html body .header__nav .pplx-join {
  width: auto; height: 40px; padding: 0 18px; gap: 8px; border-radius: 999px; font-size: 14px;
  background: linear-gradient(90deg, #ff2d78, #a855f7); border: 0; color: #fff;
}
html body .header__nav .pplx-join i { font-size: 13px; }
@media only screen and (max-width: 1080px) {
  html body .header__nav { gap: 8px; padding: 14px 16px; align-items: stretch; }
  html body .header__nav .pplx-ic {
    width: 100%; height: 48px; justify-content: flex-start; gap: 14px; padding: 0 16px; font-size: 17px;
  }
  html body .header__nav .pplx-ic i { width: 22px; text-align: center; }
  html body .header__nav .pplx-ic span {
    position: static; transform: none; opacity: 1; background: none; border: 0; padding: 0;
    font-size: 15px; color: #fff; pointer-events: auto;
  }
  html body .header__nav .pplx-ic:hover span { transform: none; }
  html body .header__nav .pplx-more__menu { position: static; box-shadow: none; margin-top: 6px; min-width: 0; }
  html body .header__nav .pplx-join { width: 100%; justify-content: center; height: 48px; font-size: 16px; }
}
/* === end pplx nav-icons === */

/* === pplx tag-pills: readable tag and language lists on dark theme === */
html body .tag-col a, html body .lang-col a {
  color: #e9dffb; background: rgba(255,255,255,.04); border: 1px solid rgba(168,85,247,.25);
  border-radius: 999px; padding: 6px 14px; min-height: 38px; font-size: 14px; font-weight: 600;
  transition: .18s;
}
html body .tag-col a:hover, html body .lang-col a:hover {
  color: #fff; background: rgba(255,45,120,.16); border-color: #ff2d78; box-shadow: 0 0 12px rgba(255,45,120,.3);
}
/* === end pplx tag-pills === */