.search-panel {
  max-width: 760px !important;
  transition: max-width .28s ease, transform .28s ease;
}

.search-panel.is-focused {
  max-width: 980px !important;
}

.search-shell {
  height: auto !important;
  min-height: 0 !important;
  max-height: 54px !important;
  border: 1px solid var(--line) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  box-shadow: 0 10px 26px rgba(15,23,42,.08) !important;
  overflow: hidden !important;
  transition: max-height .28s ease, border-radius .28s ease, box-shadow .28s ease, border-color .28s ease, background .28s ease;
}

.search-panel.is-focused .search-shell {
  max-height: 230px !important;
  border-radius: 26px !important;
  border-color: #c8d6ea !important;
  box-shadow: 0 20px 50px rgba(15,23,42,.13) !important;
}

.search-main-row {
  height: 54px !important;
  min-height: 54px !important;
  padding: 6px 8px 6px 18px !important;
  border-radius: 999px !important;
  border: 0 !important;
  background: #ffffff !important;
  box-shadow: none !important;
  transition: height .28s ease, min-height .28s ease, border-radius .28s ease, padding .28s ease;
}

.search-panel.is-focused .search-main-row {
  height: 58px !important;
  min-height: 58px !important;
  padding: 7px 8px 7px 18px !important;
  border-radius: 26px 26px 0 0 !important;
  background: #ffffff !important;
}

.search-icon {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  color: #64748b !important;
  font-size: 21px !important;
}

.search-icon::before {
  content: none !important;
}

.search-main-row input {
  color: #111827 !important;
  font-size: 17px !important;
  font-weight: 650;
}

.search-main-row input::placeholder {
  color: #94a3b8 !important;
}

.search-main-row .primary-button {
  background: linear-gradient(135deg, var(--blue), var(--violet)) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 20px rgba(37,99,235,.2) !important;
  border: 0 !important;
}

.category-board {
  margin-top: 0 !important;
  border: 0 !important;
  border-top: 1px solid var(--line) !important;
  border-radius: 0 0 26px 26px !important;
  background: #ffffff !important;
  box-shadow: none !important;
}

.board-head {
  padding: 10px 16px 4px !important;
}

.category-grid {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 8px 16px 12px !important;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.category-grid .category-chip {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

.category-grid::-webkit-scrollbar {
  height: 6px;
}

.category-grid::-webkit-scrollbar-thumb {
  background: #c8d6ea;
  border-radius: 999px;
}

.doc-tags,
.result-meta {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center;
  gap: 7px;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  max-width: 100%;
  width: 100%;
  padding-bottom: 5px;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.doc-tags .badge,
.doc-tags .tiny-tag,
.result-meta .badge,
.result-meta .tiny-tag {
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

.doc-tags::-webkit-scrollbar,
.result-meta::-webkit-scrollbar {
  height: 6px;
}

.doc-tags::-webkit-scrollbar-thumb,
.result-meta::-webkit-scrollbar-thumb {
  background: #c8d6ea;
  border-radius: 999px;
}

.code-block,
.output-pre,
.editor-fallback {
  tab-size: 2;
  white-space: pre-wrap !important;
  line-height: 1.62;
}

.code-block code {
  display: block;
  white-space: pre-wrap !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}

.editor-frame {
  min-height: 240px;
}

.monaco-editor,
.monaco-editor-background,
.monaco-editor .inputarea.ime-input {
  font-feature-settings: "liga" 0;
}

.boot-screen,
.loading-screen {
  min-height: 100vh !important;
  width: 100% !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  justify-items: center !important;
  gap: 14px !important;
  padding: 24px !important;
  text-align: center !important;
  color: var(--muted) !important;
  background: transparent !important;
}

.boot-screen .brand-orb,
.loading-screen .brand-orb {
  margin: 0 auto !important;
}

.view {
  animation: pageEnter .22s ease both;
  will-change: opacity, transform;
}

.view:not(.view-exit),
.view-ready {
  opacity: 1 !important;
  transform: none !important;
}

.view-exit {
  opacity: 0 !important;
  transform: translateY(8px) scale(.992) !important;
  filter: blur(2px);
  pointer-events: none !important;
  transition: opacity .16s ease, transform .16s ease, filter .16s ease !important;
}

.top-nav,
.page-content,
.site-sidebar {
  animation: softPop .24s ease both;
}

.page-content {
  animation-delay: .025s;
}

@keyframes pageEnter {
  from {
    opacity: 0;
    transform: translateY(10px) scale(.995);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes softPop {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.search-panel:not(.is-focused) .category-board {
  opacity: 0 !important;
  pointer-events: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .view,
  .top-nav,
  .page-content,
  .site-sidebar {
    animation: none !important;
    transition: none !important;
  }
}

@media (max-width: 640px) {
  .search-panel,
  .search-panel.is-focused {
    max-width: 100% !important;
  }

  .search-shell {
    max-height: 54px !important;
  }

  .search-panel.is-focused .search-shell {
    max-height: 230px !important;
  }

  .search-main-row {
    height: 54px !important;
    min-height: 54px !important;
    padding: 6px 7px 6px 14px !important;
  }

  .search-panel.is-focused .search-main-row {
    height: 54px !important;
    min-height: 54px !important;
    padding: 6px 7px 6px 14px !important;
  }

  .search-main-row input {
    font-size: 15px !important;
  }

  .search-icon {
    width: 24px;
    height: 24px;
    font-size: 18px !important;
  }

  .category-grid {
    max-height: none !important;
  }
}