:root {
  --webdy-is-primary: #2563eb;
  --webdy-is-primary-soft: #eff6ff;
  --webdy-is-bg: #ffffff;
  --webdy-is-surface: #f8fafc;
  --webdy-is-text: #111827;
  --webdy-is-muted: #64748b;
  --webdy-is-border: #e2e8f0;
  --webdy-is-overlay: rgba(15, 23, 42, 0.64);
}

html.webdy-is-open,
body.webdy-is-open { overflow: hidden !important; overscroll-behavior: none; }
.webdy-is-overlay, .webdy-is-overlay * { box-sizing: border-box; }
.webdy-is-overlay[hidden] { display: none !important; }
.webdy-is-overlay {
  position: fixed; inset: 0; z-index: 2147483000; display: grid; place-items: start center;
  width: 100%; height: 100dvh; padding: clamp(20px, 7vh, 72px) 20px; overflow: hidden;
  background: var(--webdy-is-overlay); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.webdy-is-modal {
  display: flex; flex-direction: column; width: min(880px, 100%); max-width: 100%;
  max-height: min(780px, calc(100dvh - clamp(40px, 14vh, 144px))); overflow: hidden;
  color: var(--webdy-is-text); background: var(--webdy-is-bg); border: 1px solid rgba(255,255,255,.72);
  border-radius: 22px; box-shadow: 0 30px 90px rgba(2,6,23,.32), 0 8px 30px rgba(2,6,23,.16); isolation: isolate;
}
.webdy-is-head {
  position: relative; z-index: 2; display: flex; flex: 0 0 auto; align-items: center; gap: 12px;
  min-width: 0; padding: 16px 18px; background: var(--webdy-is-bg); border-bottom: 1px solid var(--webdy-is-border);
}
.webdy-is-search-icon { flex: 0 0 22px; width: 22px; height: 22px; border: 2px solid var(--webdy-is-muted); border-radius: 50%; }
.webdy-is-search-icon::after { display: block; width: 8px; height: 2px; margin: 15px 0 0 15px; content: ""; background: var(--webdy-is-muted); border-radius: 2px; transform: rotate(45deg); }
.webdy-is-input {
  flex: 1 1 auto; min-width: 0 !important; width: auto !important; height: 50px !important; margin: 0 !important;
  padding: 0 4px !important; color: var(--webdy-is-text) !important; font: inherit !important;
  font-size: clamp(18px,2.5vw,22px) !important; line-height: 1.3 !important; background: transparent !important;
  border: 0 !important; border-radius: 0 !important; outline: 0 !important; box-shadow: none !important;
  -webkit-appearance: none; appearance: none;
}
.webdy-is-input::-webkit-search-cancel-button { display: none; }
.webdy-is-input::placeholder { color: #94a3b8; opacity: 1; }
.webdy-is-close, .webdy-is-tab, .webdy-is-retry, .webdy-is-more { font: inherit; color: inherit; cursor: pointer; }
.webdy-is-close {
  position: relative; flex: 0 0 44px; width: 44px; height: 44px; padding: 0; background: var(--webdy-is-surface);
  border: 1px solid var(--webdy-is-border); border-radius: 50%; transition: color .16s ease, background .16s ease, transform .16s ease;
}
.webdy-is-close span::before, .webdy-is-close span::after { position: absolute; top: 20px; left: 12px; width: 18px; height: 2px; content: ""; background: currentColor; border-radius: 2px; }
.webdy-is-close span::before { transform: rotate(45deg); }
.webdy-is-close span::after { transform: rotate(-45deg); }
.webdy-is-close:hover { color: #fff; background: var(--webdy-is-primary); transform: rotate(4deg); }
.webdy-is-close:focus-visible, .webdy-is-tab:focus-visible, .webdy-is-retry:focus-visible, .webdy-is-more:focus-visible { outline: 3px solid rgba(37,99,235,.28); outline-offset: 2px; }
.webdy-is-tabs {
  position: relative; z-index: 1; display: flex; flex: 0 0 auto; flex-wrap: wrap; align-items: center; gap: 8px;
  width: 100%; min-width: 0; max-height: 154px; padding: 12px 18px; overflow-x: hidden; overflow-y: auto;
  scrollbar-width: thin; background: var(--webdy-is-bg); border-bottom: 1px solid var(--webdy-is-border);
}
.webdy-is-tab {
  flex: 0 1 auto; min-width: 0; min-height: 40px; padding: 8px 14px; overflow: hidden;
  color: var(--webdy-is-muted); font-size: 14px; font-weight: 600; line-height: 1.2; text-overflow: ellipsis;
  white-space: nowrap; background: var(--webdy-is-surface); border: 1px solid var(--webdy-is-border); border-radius: 999px;
  transition: color .16s ease, background .16s ease, border-color .16s ease, transform .16s ease;
}
.webdy-is-tab:hover { color: var(--webdy-is-primary); background: var(--webdy-is-primary-soft); border-color: #bfdbfe; transform: translateY(-1px); }
.webdy-is-tab[aria-selected="true"] { color: #fff; background: var(--webdy-is-primary); border-color: var(--webdy-is-primary); box-shadow: 0 6px 18px rgba(37,99,235,.24); }
.webdy-is-body {
  flex: 1 1 auto; min-width: 0; min-height: 250px; padding: 16px 18px 22px; overflow-x: hidden; overflow-y: auto;
  overscroll-behavior: contain; scrollbar-gutter: stable; background: linear-gradient(180deg,var(--webdy-is-surface) 0,var(--webdy-is-bg) 72px);
}
.webdy-is-body::-webkit-scrollbar, .webdy-is-tabs::-webkit-scrollbar { width: 8px; height: 0; }
.webdy-is-body::-webkit-scrollbar-track, .webdy-is-tabs::-webkit-scrollbar-track { background: transparent; }
.webdy-is-body::-webkit-scrollbar-thumb, .webdy-is-tabs::-webkit-scrollbar-thumb { background: #cbd5e1; border: 2px solid transparent; border-radius: 999px; background-clip: padding-box; }
.webdy-is-state { display: grid; place-items: center; min-height: 210px; padding: 30px 12px; color: var(--webdy-is-muted); text-align: center; }
.webdy-is-state:empty { display: none; }
.webdy-is-results, .webdy-is-group { width: 100%; min-width: 0; }
.webdy-is-group + .webdy-is-group { margin-top: 22px; }
.webdy-is-group-title { margin: 0 0 8px; color: var(--webdy-is-muted); font-size: 12px; font-weight: 750; letter-spacing: .1em; text-transform: uppercase; }
.webdy-is-result {
  display: flex; align-items: center; gap: 14px; width: 100%; min-width: 0; min-height: 82px; padding: 10px 12px;
  overflow: hidden; color: var(--webdy-is-text) !important; text-decoration: none !important; background: transparent;
  border: 1px solid transparent; border-radius: 14px; outline: 0;
  transition: background .15s ease, border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.webdy-is-result + .webdy-is-result { margin-top: 4px; }
.webdy-is-result:hover, .webdy-is-result:focus, .webdy-is-result[aria-selected="true"] { background: var(--webdy-is-bg); border-color: var(--webdy-is-border); box-shadow: 0 8px 22px rgba(15,23,42,.08); transform: translateY(-1px); }
.webdy-is-result-image { flex: 0 0 64px; width: 64px; height: 64px; border: 1px solid var(--webdy-is-border); border-radius: 12px; object-fit: cover; background: #eef2f7; }
.webdy-is-result-copy { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; overflow-wrap: anywhere; }
.webdy-is-result-title { font-weight: 700; line-height: 1.42; }
.webdy-is-result-meta, .webdy-is-result-excerpt { margin-top: 4px; color: var(--webdy-is-muted); font-size: 13px; line-height: 1.5; }
.webdy-is-result-excerpt { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.webdy-is-result mark { padding: 0 2px; color: inherit; background: #fde68a; border-radius: 3px; }
.webdy-is-more, .webdy-is-retry { min-height: 44px; padding: 9px 16px; color: var(--webdy-is-primary); font-weight: 700; background: var(--webdy-is-primary-soft); border: 1px solid #bfdbfe; border-radius: 12px; }
.webdy-is-more { width: 100%; margin-top: 16px; }
.webdy-is-trigger { min-height: 44px; }
.screen-reader-text { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
@media (max-width: 600px) {
  .webdy-is-overlay { padding: 0; }
  .webdy-is-modal { width: 100%; height: 100dvh; max-height: none; border: 0; border-radius: 0; }
  .webdy-is-head { padding: 10px 12px; }
  .webdy-is-tabs { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 7px; max-height: 132px; padding: 9px 10px; }
  .webdy-is-tab { flex: 0 1 auto; width: auto; max-width: 100%; min-height: 38px; padding: 6px 11px; font-size: 13px; }
  .webdy-is-body { min-height: 0; padding: 14px 12px 20px; scrollbar-gutter: auto; }
  .webdy-is-result { gap: 11px; padding-inline: 8px; }
  .webdy-is-result-image { flex-basis: 56px; width: 56px; height: 56px; }
}
@media (prefers-reduced-motion: no-preference) {
  .webdy-is-modal { animation: webdy-is-enter .2s cubic-bezier(.22,1,.36,1); }
  @keyframes webdy-is-enter { from { opacity: 0; transform: translateY(-12px) scale(.985); } to { opacity: 1; transform: none; } }
}
@media (prefers-color-scheme: dark) {
  :root { --webdy-is-bg: #111827; --webdy-is-surface: #172033; --webdy-is-text: #f8fafc; --webdy-is-muted: #a5b4c7; --webdy-is-border: #2d3a50; --webdy-is-primary-soft: #172554; }
  .webdy-is-result:hover, .webdy-is-result:focus, .webdy-is-result[aria-selected="true"] { box-shadow: 0 8px 22px rgba(0,0,0,.24); }
}
