.dzc-scrim { position: fixed; inset: 0; z-index: 2000; background: rgba(24, 32, 58, .28); animation: dzc-fade 90ms ease-out; }
.dzc {
  position: fixed; z-index: 2001; left: 50%; top: max(56px, 12vh); transform: translateX(-50%);
  width: min(640px, calc(100vw - 32px)); max-height: min(560px, calc(100vh - max(56px, 12vh) - 24px));
  display: flex; flex-direction: column; box-sizing: border-box; overflow: hidden;
  background: #fff; color: #18203a; border-radius: 16px;
  box-shadow: 0 24px 60px -12px rgba(24, 32, 58, .34), 0 0 0 1px rgba(24, 32, 58, .07);
  font: 400 14px/1.35 "Dazr", -apple-system, "Segoe UI", system-ui, sans-serif; text-align: left;
  animation: dzc-pop 110ms ease-out;
}
.dzc *, .dzc *::before, .dzc *::after { box-sizing: border-box; }
@keyframes dzc-pop { from { opacity: 0; transform: translate(-50%, -6px); } }
@keyframes dzc-fade { from { opacity: 0; } }
.dzc svg { width: 18px; height: 18px; flex: none; display: block; pointer-events: none; }

.dzc-head { display: flex; align-items: center; gap: 10px; height: 56px; padding: 0 12px 0 18px; border-bottom: 1px solid #eef0f5; flex: none; }
.dzc-glass { color: #6b7489; }
.dzc-input {
  flex: 1; min-width: 0; height: 40px; margin: 0; padding: 0; border: 0; outline: none; background: transparent; box-shadow: none;
  font: inherit; font-size: 16px; color: #18203a; -webkit-appearance: none; appearance: none;
}
.dzc-input::placeholder { color: #8a92a6; opacity: 1; }
.dzc-input:focus, .dzc-input:focus-visible { outline: none; box-shadow: none; }
.dzc-back, .dzc-x {
  width: 34px; height: 34px; margin: 0; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #465069;
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer; flex: none;
  transition: background-color 110ms ease-out, color 110ms ease-out;
}
.dzc-back { margin-left: -8px; }
.dzc-back[hidden], .dzc-back:not([hidden]) + .dzc-glass { display: none; }
@media (hover: hover) { .dzc-back:hover, .dzc-x:hover { background: #18203a; color: #fff; } }
.dzc-back:focus-visible, .dzc-x:focus-visible { outline: none; background: #18203a; color: #fff; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #8ea2ff; }
.dzc-x { display: none; }
.dzc kbd {
  display: inline-flex; align-items: center; justify-content: center; min-width: 20px; height: 20px; padding: 0 5px; margin: 0;
  border: 1px solid #d6dbe6; border-bottom-width: 2px; border-radius: 5px; background: #fff; color: #465069;
  font: 600 11.5px/1 "Dazr", -apple-system, "Segoe UI", system-ui, sans-serif; white-space: nowrap;
}
.dzc-esc { flex: none; }

.dzc-list { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 6px 8px 8px; scrollbar-width: thin; }
.dzc-list:focus { outline: none; }
.dzc-group + .dzc-group { margin-top: 4px; }
.dzc-gh { padding: 10px 10px 4px; font-size: 12.5px; font-weight: 700; color: #6b7489; }
.dzc-row {
  display: flex; align-items: center; gap: 12px; min-height: 40px; padding: 0 10px; border-radius: 8px; cursor: pointer;
  color: #18203a; user-select: none; -webkit-tap-highlight-color: transparent;
  transition: background-color 70ms ease-out, color 70ms ease-out;
}
.dzc-ic { color: #465069; }
.dzc-ic--go { width: 14px !important; height: 14px !important; margin: 0 2px; }
.dzc-label { flex: 1 1 auto; min-width: 0; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dzc-detail { flex: 0 1 auto; min-width: 0; max-width: 45%; color: #6b7489; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dzc-keys { display: inline-flex; gap: 4px; flex: none; }
.dzc-more { width: 14px !important; height: 14px !important; color: #6b7489; }
.dzc-ck { color: #18203a; }
.dzc-row[aria-checked="false"] .dzc-ck { visibility: hidden; }
.dzc-row[aria-selected="true"] { background: #18203a; color: #fff; }
.dzc-row[aria-selected="true"] .dzc-ic, .dzc-row[aria-selected="true"] .dzc-detail, .dzc-row[aria-selected="true"] .dzc-more, .dzc-row[aria-selected="true"] .dzc-ck { color: #fff; }
.dzc-row[aria-selected="true"] kbd { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .42); }
.dzc-row:active { background: #0c1122; color: #fff; }
.dzc-empty { padding: 36px 16px 40px; text-align: center; color: #6b7489; }

.dzc-foot {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 18px; flex: none; padding: 10px 18px; border-top: 1px solid #eef0f5;
  color: #6b7489; font-size: 12.5px;
}
.dzc-foot span { display: inline-flex; align-items: center; gap: 4px; }
.dzc-foot kbd { min-width: 18px; height: 18px; font-size: 11px; }
.dzc-foot kbd:last-of-type { margin-right: 3px; }
.dzc-grow { flex: 1; }
.dzc-live { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.sh-tool.dzc-btn { width: auto; min-width: 36px; padding: 0 8px; gap: 6px; }
.dzc-btn svg { width: 20px; height: 20px; flex: none; display: block; pointer-events: none; }
.dzc-btn__keys { display: inline-flex; gap: 3px; }
.dzc-btn kbd {
  display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 4px; margin: 0;
  border: 1px solid #9aa3b8; border-bottom-width: 2px; border-radius: 4px; background: transparent; color: inherit;
  font: 700 11px/1 "Dazr", -apple-system, "Segoe UI", system-ui, sans-serif;
}
@media (hover: hover) { .dzc-btn:hover kbd { border-color: rgba(255, 255, 255, .5); } }
.dzc-btn:focus-visible kbd { border-color: rgba(255, 255, 255, .5); }
@media (max-width: 1100px) { .dzc-btn__keys { display: none; } .sh-tool.dzc-btn { padding: 0; width: 36px; } }

@media (max-width: 640px) {
  .dzc {
    left: 0; right: 0; top: 0; bottom: 0; transform: none; width: auto; max-height: none; height: 100%; height: 100dvh;
    border-radius: 0; padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom);
    animation: dzc-up 160ms ease-out;
  }
  @keyframes dzc-up { from { transform: translateY(24px); opacity: .6; } }
  .dzc-head { height: 60px; padding: 0 6px 0 16px; }
  .dzc-back { width: 44px; height: 44px; margin-left: -10px; }
  .dzc-x { display: inline-flex; width: 44px; height: 44px; }
  .dzc .dzc-esc, .dzc-foot { display: none; }
  .dzc-input { font-size: 16px; height: 44px; }
  .dzc-list { padding: 6px 8px calc(12px + env(safe-area-inset-bottom)); }
  .dzc-row { min-height: 44px; font-size: 15px; }
  .dzc .dzc-keys { display: none; }
  .sh-tool.dzc-btn { width: 44px; height: 44px; }
}
@media (pointer: coarse) { .dzc-row { min-height: 44px; } }
@media (prefers-reduced-motion: reduce) { .dzc, .dzc-scrim { animation: none; } .dzc-row, .dzc-back, .dzc-x { transition: none; } }
@media print { .dzc, .dzc-scrim { display: none !important; } }
