/* Small additions for the framework-free controls; original design is in styles.css. */
[hidden] { display: none !important; }
.filter-status { grid-column: 1 / -1; color: #888; font-size: 13px; order: 1; }
.empty-state { grid-column: 1 / -1; padding: 32px 16px; color: #999; }
.mobile-menu { position: absolute; top: 62px; left: 0; right: 0; z-index: 80; padding: 12px 20px; border-bottom: 1px solid #242424; background: #0a0a0a; }
.mobile-menu a { display: block; padding: 12px 0; color: #eee; text-decoration: none; }
.wallet-dialog { width: min(420px, calc(100% - 32px)); margin: auto; padding: 28px; color: #eee; background: #111; border: 1px solid #303030; border-radius: 20px; }
.wallet-dialog::backdrop { background: #000a; backdrop-filter: blur(5px); }
.wallet-dialog h2 { font-size: 24px; margin-bottom: 16px; }
.wallet-dialog p { color: #999; line-height: 1.6; }
.dialog-close { position: absolute; right: 16px; top: 10px; font-size: 25px; cursor: pointer; }
.wallet-link { display: block; margin-top: 24px; padding: 12px; text-align: center; border-radius: 30px; color: #111; background: #fff; }
@media (min-width: 768px) { .mobile-menu { display: none; } }
@media (max-width: 639px) {
  section[aria-label="Tokens and top X profiles"] > div:first-child { flex-wrap: wrap; }
  section[aria-label="Tokens and top X profiles"] > div:first-child > div:first-child { flex-wrap: wrap; }
  [aria-label="Launchpad"] { flex-wrap: wrap; }
}

/* Rewards proposal modal */
html.rewards-modal-open { overflow: hidden; }
.rewards-popup {
  box-sizing: border-box;
  width: min(460px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 32px;
  overflow-y: auto;
  color: #f5f5f5;
  background: radial-gradient(ellipse at top, #202020 0%, #111 65%);
  border: 1px solid #343434;
  border-radius: 24px;
  box-shadow: 0 30px 100px #0009;
  text-align: center;
}
.rewards-popup::backdrop { background: #000a; backdrop-filter: blur(6px); }
.rewards-popup[open] { animation: rewards-enter 220ms ease-out; }
.rewards-close {
  position: absolute; top: 12px; right: 12px;
  display: grid; place-items: center;
  width: 44px; height: 44px;
  border: 0; border-radius: 50%;
  color: #929292; background: transparent; cursor: pointer;
}
.rewards-close svg { width: 20px; height: 20px; }
.rewards-close:hover { color: #fff; background: #ffffff0d; }
.rewards-label {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 5px 10px;
  color: #bbb; border: 1px solid #ffffff1a; border-radius: 20px;
  font-size: 10px; font-weight: 600; letter-spacing: 1.8px;
}
.rewards-label > span { width: 5px; height: 5px; border-radius: 50%; background: #eee; }
.rewards-popup h2 { margin: 24px 0 14px; font-size: 28px; font-weight: 550; letter-spacing: -1px; line-height: 1.15; text-wrap: balance; }
#rewards-description { margin: 0; color: #999; font-size: 15px; line-height: 1.65; }
#rewards-description strong { color: #eee; font-weight: 550; }
.rewards-vote {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%; min-height: 48px; margin-top: 26px; padding: 12px 20px;
  border: 0; border-radius: 999px; background: #fff; color: #0a0a0a;
  font-size: 15px; font-weight: 550; cursor: pointer;
  transition: background 150ms ease, transform 150ms ease;
}
.rewards-vote:hover { background: #e2e2e2; }
.rewards-vote:active { transform: scale(.98); }
.rewards-close:focus-visible, .rewards-vote:focus-visible { outline: 2px solid #a7cfff; outline-offset: 3px; }
.rewards-note { max-width: 290px; margin: 16px auto 0; color: #6e6e6e; font-size: 11px; line-height: 1.6; }
@keyframes rewards-enter { from { opacity: 0; transform: translateY(10px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (max-width: 480px) {
  .rewards-popup { padding: 28px 24px; border-radius: 20px; }
  .rewards-popup h2 { font-size: 26px; }
  #rewards-description { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) { .rewards-popup[open] { animation: none; } .rewards-vote { transition: none; } }
