/* Explore top bar: a pearl-and-gold search field and the feed pills (SteemSphere, Pinned Posts) on a light cream track,
   kept on one row at every width. The Community dropdown styles below are no longer used on Explore. */
.explore-bar {
  --lux-black:#0d0b07; --lux-black-2:#1a160e; --lux-gold:#D4AF37; --lux-gold-hi:#F5D77A; --lux-gold-lo:#9A7A1A;
  --lux-pearl:#fdfaf2; --lux-cream:#f7f0de; --lux-ink:#2a241a; --lux-bronze:#8a6a1f;
  --pill-ink:#4a3f2c; --pill-line:rgba(154,122,26,.22);
  position:relative; display:flex; flex-wrap:nowrap; align-items:center; gap:12px; margin:0 0 16px; padding:12px;
  background:var(--card); border:1px solid var(--border); border-radius:14px; box-shadow:0 1px 2px rgba(0,0,0,.05);
}

/* Search */
.explore-search { position:relative; flex:1 1 auto; min-width:0; }
.explore-search-ico { position:absolute; left:16px; top:50%; width:16px; height:16px; transform:translateY(-50%); pointer-events:none;
  fill:none; stroke:var(--lux-bronze); stroke-width:2.2; stroke-linecap:round; opacity:.8; transition:opacity .2s, stroke .2s; }
.explore-search input {
  width:100%; height:44px; padding:0 18px 0 44px; font:inherit; font-size:14px; letter-spacing:.2px; color:var(--lux-ink);
  background:linear-gradient(180deg, #fffdf8, var(--lux-pearl)); border:1px solid rgba(184,150,15,.38); border-radius:999px;
  outline:none; -webkit-appearance:none; appearance:none;
  box-shadow:inset 0 1px 2px rgba(90,64,8,.06), 0 1px 0 rgba(255,255,255,.9), 0 3px 12px rgba(60,45,15,.07);
  transition:border-color .2s, box-shadow .2s;
}
.explore-search input::placeholder { color:rgba(90,74,46,.62); }
.explore-search input:hover { border-color:rgba(184,150,15,.6); }
.explore-search input:focus { border-color:var(--lux-gold); background:#fff;
  box-shadow:inset 0 1px 2px rgba(90,64,8,.05), 0 0 0 3px rgba(212,175,55,.2), 0 6px 18px rgba(154,122,26,.12); }
.explore-search:focus-within .explore-search-ico { opacity:1; stroke:var(--lux-gold-lo); }
.explore-search input::-webkit-search-cancel-button { -webkit-appearance:none; width:14px; height:14px; cursor:pointer;
  background:radial-gradient(circle, var(--lux-bronze) 0 1.5px, transparent 2px), linear-gradient(45deg, transparent 44%, var(--lux-bronze) 44% 56%, transparent 56%),
    linear-gradient(-45deg, transparent 44%, var(--lux-bronze) 44% 56%, transparent 56%); opacity:.7; }

/* Pills */
.explore-pills { flex:none; display:flex; align-items:center; gap:6px; padding:5px; min-width:0; max-width:100%; overflow-x:auto;
  background:linear-gradient(180deg, var(--lux-pearl), var(--lux-cream)); border:1px solid rgba(184,150,15,.32); border-radius:999px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85), inset 0 0 0 1px rgba(255,255,255,.4), 0 3px 12px rgba(60,45,15,.07);
  scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.explore-pills::-webkit-scrollbar { display:none; }
.explore-pill {
  position:relative; flex:none; display:inline-flex; align-items:center; gap:6px; padding:8px 16px; font:inherit; font-size:12.5px;
  font-weight:700; letter-spacing:.35px; line-height:1.2; white-space:nowrap; color:var(--pill-ink); background:transparent;
  border:1px solid var(--pill-line); border-radius:999px; cursor:pointer; -webkit-tap-highlight-color:transparent;
  transition:background .25s, color .25s, border-color .25s, box-shadow .25s, transform .2s;
}
.explore-pill:hover { color:var(--lux-bronze); border-color:rgba(184,150,15,.55); background:rgba(255,255,255,.75);
  box-shadow:0 2px 8px rgba(154,122,26,.14); transform:translateY(-1px); }
.explore-pill:active { transform:translateY(0); }
.explore-pill:focus-visible { outline:2px solid var(--lux-gold-lo); outline-offset:2px; }
.explore-pill[aria-pressed="true"] { color:#1b1406; border-color:transparent;
  background:linear-gradient(135deg, var(--lux-gold-hi) 0%, var(--lux-gold) 48%, var(--lux-gold-lo) 100%);
  box-shadow:inset 0 1px 0 rgba(255,250,225,.6), inset 0 -1px 0 rgba(90,64,8,.3), 0 3px 10px rgba(154,122,26,.28); }
/* A small gold diamond marks the selected pill */
.explore-pill[aria-pressed="true"]::before { content:""; width:5px; height:5px; background:#1b1406; transform:rotate(45deg); border-radius:1px; opacity:.75; }
.pins-pill { text-decoration:none; }
.pill-pin { width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.pill-caret { width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; transition:transform .25s; }
.community-pill[aria-expanded="true"] { color:var(--lux-bronze); border-color:var(--lux-gold); background:rgba(255,255,255,.75); }
.community-pill[aria-expanded="true"][aria-pressed="true"] { color:#1b1406; }
.community-pill[aria-expanded="true"] .pins-pill { text-decoration:none; }
.pill-pin { width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.pill-caret { transform:rotate(180deg); }
.community-pill .pill-label { max-width:150px; overflow:hidden; text-overflow:ellipsis; }

/* Community dropdown */
.community-menu { position:absolute; z-index:60; top:calc(100% + 8px); right:12px; width:min(400px, calc(100% - 24px)); text-align:left;
  display:flex; flex-direction:column; max-height:min(460px, 65vh); color:#efe3c2;
  background:linear-gradient(180deg, #17130c, #0b0905); border:1px solid rgba(212,175,55,.5); border-radius:16px;
  box-shadow:0 18px 40px rgba(0,0,0,.35), 0 0 0 1px rgba(0,0,0,.4), inset 0 1px 0 rgba(245,215,122,.12); overflow:hidden;
  animation:cm-in .18s ease-out; }
.community-menu[hidden] { display:none; }
@keyframes cm-in { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:none; } }
.cm-head { display:flex; align-items:baseline; justify-content:space-between; gap:10px; padding:14px 16px 10px;
  border-bottom:1px solid rgba(212,175,55,.18); }
.cm-title { font-size:13px; font-weight:800; letter-spacing:.8px; text-transform:uppercase; color:var(--lux-gold-hi); }
.cm-hint { font-size:11px; color:rgba(239,227,194,.55); text-align:right; }
.cm-clear { margin:8px 10px 0; padding:8px 12px; font:inherit; font-size:12px; font-weight:700; color:var(--lux-gold-hi); text-align:left;
  background:rgba(212,175,55,.08); border:1px dashed rgba(212,175,55,.4); border-radius:10px; cursor:pointer; }
.cm-clear:hover { background:rgba(212,175,55,.16); }
.cm-clear[hidden] { display:none; }
.cm-list { flex:1 1 auto; overflow-y:auto; overscroll-behavior:contain; padding:6px; -webkit-overflow-scrolling:touch;
  scrollbar-width:thin; scrollbar-color:rgba(212,175,55,.45) transparent; }
.cm-list::-webkit-scrollbar { width:6px; }
.cm-list::-webkit-scrollbar-thumb { background:rgba(212,175,55,.45); border-radius:999px; }
.cm-item { display:flex; align-items:center; gap:12px; width:100%; padding:9px 10px; font:inherit; color:inherit; text-align:left;
  background:none; border:1px solid transparent; border-radius:11px; cursor:pointer; transition:background .15s, border-color .15s; }
.cm-item:hover, .cm-item:focus-visible { outline:none; background:rgba(212,175,55,.1); border-color:rgba(212,175,55,.35); }
.cm-item[aria-current="true"] { background:rgba(212,175,55,.16); border-color:rgba(212,175,55,.6); }
.cm-avatar { flex:none; display:grid; place-items:center; width:34px; height:34px; border-radius:50%; overflow:hidden; font-size:14px; font-weight:800;
  color:#1b1406; background:linear-gradient(135deg, var(--lux-gold-hi), var(--lux-gold-lo)); box-shadow:0 0 0 1px rgba(212,175,55,.5); }
.cm-avatar img { width:100%; height:100%; object-fit:cover; }
.cm-text { display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
.cm-name { font-size:13.5px; font-weight:700; color:#f6ecd0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cm-meta { font-size:11px; color:rgba(239,227,194,.55); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cm-item[aria-current="true"] .cm-name { color:var(--lux-gold-hi); }
.cm-foot { margin:0; padding:10px 16px 12px; font-size:11.5px; text-align:center; color:rgba(239,227,194,.55); border-top:1px solid rgba(212,175,55,.12); }
.cm-foot:empty { display:none; }
.cm-foot.err { color:#f19a8f; }

@media (max-width: 640px) {
  .explore-bar { gap:8px; padding:10px; }
  .explore-search-ico { left:13px; }
  .explore-search input { height:42px; padding:0 12px 0 36px; font-size:16px; } /* 16px stops iOS zooming on focus */
  .explore-pills { gap:4px; padding:3px; }
  .explore-pill { padding:8px 11px; font-size:12px; letter-spacing:.2px; }
  .community-menu { left:10px; right:10px; width:auto; max-height:min(420px, 60vh); }
}
@media (max-width: 420px) {
  .explore-pill .pill-pin { display:none; }
  .explore-pill { padding:8px 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .explore-pill, .pill-caret, .explore-search input { transition:none; }
  .community-menu { animation:none; }
}
