/* Product controls share the restrained, monochrome dashboard language. */
.jp-search-popover {
  position: absolute;
  z-index: 60;
  overflow: hidden;
  border: 1px solid #303030;
  border-radius: 12px;
  background: #111;
  box-shadow: 0 18px 55px #0009, 0 1px 0 #ffffff06 inset;
  text-align: left;
}
.jp-search-popover-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 44px;
  padding: 5px 14px;
  color: #939393;
  font-size: 10px;
  border-bottom: 1px solid #232323;
}
.jp-product-text-button { min-height: 32px; font-size: 10px; color: #aaa; }
.jp-product-text-button:hover { color: #fff; }
.jp-product-results { max-height: min(380px, 56dvh); overflow-y: auto; padding: 5px; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #383838 transparent; }
.jp-product-option {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-height: 61px;
  padding: 10px;
  border: 1px solid transparent;
  border-radius: 7px;
  text-align: left;
  color: #e2e2e2;
  transition: background 120ms ease, border-color 120ms ease;
}
.jp-product-option:hover, .jp-product-option[aria-selected="true"] { background: #222; border-color: #303030; }
.jp-product-visual { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; overflow: hidden; border: 1px solid #333; border-radius: 7px; background: #232323; color: #999; }
.jp-product-visual img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); }
.jp-product-visual svg { width: 18px; height: 18px; }
.jp-product-option-copy { display: grid; min-width: 0; gap: 3px; flex: 1; }
.jp-product-option-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; font-weight: 500; }
.jp-product-option-copy > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #858585; font-size: 10px; }
.jp-product-option > svg { width: 13px; height: 13px; color: #777; }
.jp-product-option-meta { flex-shrink: 0; color: #818181; font-size: 9px; }
.jp-product-keyboard-hint { display: flex; align-items: center; gap: 14px; padding: 10px 14px; border-top: 1px solid #242424; color: #757575; font-size: 9px; }
.jp-product-empty { padding: 30px 18px; text-align: center; color: #858585; font-size: 11px; }
.jp-product-empty strong { display: block; color: #d0d0d0; font-size: 13px; font-weight: 500; }
.jp-product-empty p { margin-top: 6px; line-height: 1.7; }
.jp-product-empty-action { display: block; min-height: 44px; margin: 10px auto 0; color: #ddd; font-size: 11px; text-decoration: underline; text-underline-offset: 4px; }
.jp-sidebar-toggle { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 8px 14px; margin-bottom: 12px; border-radius: 6px; color: #797979; text-align: left; transition: color 150ms, background 150ms; }
.jp-sidebar-toggle:hover { color: #ddd; background: #171717; }
.jp-sidebar-toggle svg { width: 17px; height: 17px; }
.jp-sidebar-toggle span { font-size: 10px; }
.jp-command-trigger { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 35px; min-height: 35px; padding: 6px 9px; border: 1px solid #292929; border-radius: 6px; color: #8b8b8b; transition: background 150ms, color 150ms; }
.jp-command-trigger:hover { background: #1c1c1c; color: #e0e0e0; }
.jp-command-trigger > svg { width: 15px; height: 15px; }
.jp-command-trigger kbd { font: 9px var(--font, sans-serif); color: #909090; }
.jp-command-open { overflow: hidden; }
.jp-command-menu {
  position: fixed;
  top: clamp(30px, 13vh, 130px);
  bottom: auto;
  width: min(540px, calc(100vw - 32px));
  max-height: min(630px, calc(100dvh - 80px));
  margin: 0 auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid #363636;
  border-radius: 14px;
  background: #111;
  color: #e8e8e8;
  box-shadow: 0 30px 100px #000b;
}
.jp-command-menu::backdrop { background: #000a; backdrop-filter: blur(4px); }
.jp-command-head { display: flex; align-items: center; gap: 12px; min-height: 68px; padding: 10px 17px; border-bottom: 1px solid #2b2b2b; }
.jp-command-head > svg { width: 19px; height: 19px; color: #8a8a8a; }
.jp-command-input { min-width: 0; width: 100%; min-height: 42px; border: 0; outline: none; background: none; color: #e8e8e8; font-size: 13px; }
.jp-command-input:focus-visible { outline: none; }
.jp-command-input::placeholder { color: #757575; }
.jp-command-input::-webkit-search-cancel-button { cursor: pointer; }
.jp-command-close { flex-shrink: 0; min-width: 36px; min-height: 32px; border: 1px solid #333; border-radius: 5px; color: #969696; font-size: 10px; }
.jp-command-close:hover { color: #ddd; background: #222; }
.jp-command-results { max-height: min(465px, calc(100dvh - 240px)); overflow-y: auto; padding: 7px; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #383838 transparent; }
.jp-command-group { margin: 11px 10px 6px; color: #767676; font-size: 9px; font-weight: 500; letter-spacing: .7px; text-transform: uppercase; }
.jp-command-group:first-child { margin-top: 4px; }
.jp-command-option { min-height: 58px; }
.jp-product-visual--icon { border-color: transparent; background: none; }
.jp-product-option-return { opacity: 0; color: #8c8c8c; font-size: 15px; }
.jp-command-option[aria-selected="true"] .jp-product-option-return { opacity: 1; }
.jp-command-footer { display: flex; align-items: center; gap: 16px; min-height: 39px; padding: 10px 17px; border-top: 1px solid #252525; color: #757575; font-size: 9px; }
.jp-command-brand { margin-left: auto; color: #999; }

@media (min-width: 901px) {
  body.sidebar-collapsed { --sidebar: 76px; }
  .sidebar-collapsed .sidebar { align-items: center; padding: 27px 10px 18px; }
  .sidebar-collapsed .brand { padding: 0; margin-bottom: 33px; }
  .sidebar-collapsed .brand > span,
  .sidebar-collapsed .sidebar-label,
  .sidebar-collapsed .sidebar-divider,
  .sidebar-collapsed .network,
  .sidebar-collapsed .sidebar-profile > div,
  .sidebar-collapsed .sidebar-profile .version { display: none; }
  .sidebar-collapsed .side-nav { width: 100%; gap: 8px; }
  .sidebar-collapsed .side-nav > a,
  .sidebar-collapsed .side-nav > button { position: relative; justify-content: center; gap: 0; min-height: 45px; padding: 12px; font-size: 0; }
  .sidebar-collapsed .side-nav > a > span,
  .sidebar-collapsed .side-nav > button > span { display: none; }
  .sidebar-collapsed .side-nav svg { width: 21px; height: 21px; }
  .sidebar-collapsed .side-nav + .sidebar-divider + .sidebar-label + .side-nav { margin-top: 28px; }
  .sidebar-collapsed .sidebar-bottom { width: 100%; }
  .sidebar-collapsed .sidebar-profile { justify-content: center; padding: 0; }
  .sidebar-collapsed .jp-sidebar-toggle { justify-content: center; padding: 10px; }
  .sidebar-collapsed .jp-sidebar-toggle svg { transform: rotate(180deg); }
  .sidebar-collapsed .jp-sidebar-toggle > span { display: none; }
  .sidebar-collapsed .side-nav > [data-product-label]::after {
    content: attr(data-product-label);
    position: absolute;
    left: calc(100% + 15px);
    top: 50%;
    z-index: 80;
    transform: translateY(-50%);
    padding: 7px 10px;
    border: 1px solid #383838;
    border-radius: 5px;
    background: #1b1b1b;
    box-shadow: 0 8px 24px #0005;
    color: #ddd;
    font-size: 11px;
    white-space: nowrap;
    pointer-events: none;
    opacity: 0;
  }
  .sidebar-collapsed .side-nav > [data-product-label]:hover::after,
  .sidebar-collapsed .side-nav > [data-product-label]:focus-visible::after { opacity: 1; }
}
@media (max-width: 1100px) {
  .jp-command-trigger kbd { display: none; }
}
@media (max-width: 900px) {
  .jp-sidebar-toggle { display: none; }
}
@media (max-width: 700px) {
  .topbar { padding-top: env(safe-area-inset-top, 0px); height: calc(65px + env(safe-area-inset-top, 0px)); gap: 8px; }
  .mobile-nav { top: calc(65px + env(safe-area-inset-top, 0px)); }
  .menu-toggle { width: 44px; min-height: 44px; justify-content: center; align-items: center; }
  .global-search { min-height: 44px; }
  .global-search input { font-size: 16px; }
  .global-search input::placeholder { font-size: 10px; }
  .topbar .wallet-button { min-height: 44px; }
  .jp-command-trigger { display: none; }
  .mobile-nav a, .mobile-nav button { display: flex; align-items: center; min-height: 44px; }
  .main-content { padding-bottom: env(safe-area-inset-bottom, 0px); }
  .filter-list { overflow-x: auto; scrollbar-width: none; }
  .filter-list > .filter { min-height: 44px; white-space: nowrap; }
  .open-cause { display: grid; place-items: center; min-width: 44px; min-height: 44px; }
  .cause-title h3 > button { min-height: 32px; }
  .jp-search-popover-top { min-height: 48px; }
  .jp-product-text-button { min-height: 44px; }
  .jp-product-option { min-height: 64px; }
  .jp-product-option-copy strong { font-size: 12px; }
  .jp-product-option-copy > span { font-size: 10px; }
  .jp-product-keyboard-hint { display: none; }
  .jp-command-menu { top: calc(16px + env(safe-area-inset-top, 0px)); max-height: calc(100dvh - 32px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
  .jp-command-input { font-size: 16px; }
  .jp-command-input::placeholder { font-size: 12px; }
  .jp-command-close { min-width: 44px; min-height: 44px; }
  .jp-command-results { max-height: calc(100dvh - 160px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); }
  .jp-command-footer { padding-bottom: max(10px, env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 380px) {
  .topbar .mobile-brand { display: none; }
  .topbar { padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .jp-product-option, .jp-sidebar-toggle, .jp-command-trigger { transition: none; }
}