.search-style-star {
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  max-width:var(--star-search-width);
  width:100%;
  min-height:var(--this-height);
  color:var(--font-color);
  flex-shrink:0;
}
.search-style-star .search-box-big {
  width:100%;
}
.star-search-container {
  position:relative;
  width:100%;
}
.star-search-form {
  position:relative;
}
.star-search-elements {
  position:relative;
  display:flex;
  align-items:center;
  background:var(--main-bg-color);
  border-radius:var(--main-radius);
  padding:6px;
  box-shadow:0 4px 20px rgba(0,0,0,0.1);
  transition:all 0.3s ease;
}
.star-search-elements:focus-within {
  box-shadow:0 6px 30px rgba(0,0,0,0.15);
}
.search-icon-wrapper {
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  cursor:pointer;
  transition:all 0.3s ease;
  flex-shrink:0;
  padding-left:6px;
}
.engine-icon {
  width:32px;
  height:32px;
  border-radius:50%;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.engine-icon .engine-image {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.engine-icon .iconfont {
  font-size:20px;
  color:var(--form-color);
}
.dropdown-arrow {
  position:relative;
  font-size:12px;
  color:var(--form-color);
  opacity:0.6;
  transition:transform 0.3s ease;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.search-icon-wrapper.active .dropdown-arrow {
  transform:rotate(180deg);
}
.star-search-form .search-input {
  flex:1;
  height:48px;
  border:none;
  background:transparent;
  color:var(--form-color);
  font-size:16px;
  padding:0 16px;
  outline:none;
  min-width:0;
}
.star-search-form .search-input::placeholder {
  color:var(--form-color);
  opacity:0.6;
}
.star-search-form .search-button {
  width:48px;
  height:48px;
  border:none;
  background:var(--focus-color);
  color:#fff;
  border-radius:var(--theme-border-radius-md);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  transition:all 0.3s ease;
  flex-shrink:0;
  margin-left:4px;
}
.star-search-form .search-button:hover {
  background:rgb(from var(--focus-color) r g b / 0.8);
}
.star-search-form .search-button:active {
  opacity:0.9;
}
.star-search-form .search-button .iconfont {
  font-size:20px;
}
#star-engine-dropdown,.engine-dropdown {
  position:absolute;
  background:var(--main-bg-color);
  border-radius:var(--main-radius);
  box-shadow:0 8px 32px rgba(0,0,0,0.15);
  opacity:0;
  z-index:9;
  visibility:hidden;
  transform:translateY(-10px);
  transition:all 0.3s cubic-bezier(0.4,0,0.2,1);
  max-height:400px;
  overflow-y:auto;
  overflow-x:hidden;
  pointer-events:none;
}
#star-engine-dropdown.show,.engine-dropdown.show {
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  pointer-events:auto;
}
.engine-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(70px,1fr));
  padding:12px;
}
.engine-item {
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:12px 8px;
  border-radius:var(--main-radius);
  cursor:pointer;
  transition:all 0.3s ease;
  text-align:center;
}
.engine-item:hover {
  background-color:rgba(0,0,0,0.05);
}
.io-black-mode .engine-item:hover {
  background-color:rgba(255,255,255,0.1);
}
.engine-item .icon-box {
  width:32px;
  height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:8px;
  border-radius:12px;
  transition:background-color 0.3s ease;
  overflow:hidden;
  flex-shrink:0;
}
.io-black-mode .engine-item .icon-box {
  background:rgba(255,255,255,0.05);
}
.io-black-mode .engine-item:hover .icon-box {
  background:rgba(255,255,255,0.1);
}
.engine-item .icon-box .engine-image {
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  border-radius:4px;
}
.engine-item .icon-box .iconfont {
  font-size:24px;
  color:var(--form-color);
}
.engine-item span {
  font-size:13px;
  color:var(--form-color);
  font-weight:500;
  line-height:1.2;
  word-break:break-word;
}
.io-black-mode .engine-dropdown {
  background:var(--form-bg);
}
.search-style-star .big-title {
  margin-bottom:24px;
}
.search-style-star .big-title h2 {
  color:var(--font-color);
  text-shadow:var(--text-shadow);
  font-weight:600;
}
#star-search-suggestion-container,.suggestion-container {
  position:absolute;
  background:var(--main-bg-color);
  backdrop-filter:saturate(2) blur(15px);
  -webkit-backdrop-filter:saturate(2) blur(15px);
  border:1px solid rgba(255,255,255,0.8);
  border-radius:12px;
  box-shadow:0 6px 20px rgba(0,0,0,0.1);
  overflow:hidden;
  opacity:0;
  z-index:9;
  visibility:hidden;
  transform:translateY(-10px);
  transition:all 0.2s ease-out;
  pointer-events:none;
}
#star-search-suggestion-container.active,.suggestion-container.active {
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  pointer-events:auto;
}
.search-suggestions {
  padding:8px 0;
}
.suggestion-list {
  max-height:300px;
  overflow-y:auto;
}
.suggestion-container .search-smart-meta {
  margin:8px 8px 0;
}
.suggestion-item {
  display:flex;
  align-items:center;
  padding:8px 15px;
  margin:0 8px;
  border-radius:8px;
  cursor:pointer;
  transition:all 0.2s ease;
  color:var(--form-color);
}
.suggestion-item:hover {
  background:rgba(0,0,0,0.05);
}
.suggestion-item.focused {
  background:rgba(0,0,0,0.05);
}
.io-black-mode .suggestion-item.focused {
  background:rgba(255,255,255,0.1);
}
.suggestion-item i {
  color:var(--form-color);
  opacity:0.6;
  margin-right:8px;
  font-size:14px;
}
.suggestion-item:hover i,.suggestion-item.focused i {
  opacity:1;
}
.suggestion-item.ms-auto-item {
  align-items:baseline;
  flex-wrap:wrap;
  gap:3px 6px;
  line-height:1.6;
}
.io-black-mode .suggestion-container {
  background:rgba(45,46,47,0.95);
  border-color:rgba(255,255,255,0.1);
}
.io-black-mode .suggestion-item {
  color:var(--font-color);
}
.io-black-mode .suggestion-item:hover {
  background:rgba(255,255,255,0.1);
  border-color:rgba(255,255,255,0.2);
}
.io-black-mode #star-search-suggestion-container,.io-black-mode .suggestion-container {
  border:1px solid #3a3a3b;
}
.search-style-star-stack {
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  max-width:var(--star-search-width,800px);
  width:100%;
  min-height:var(--this-height);
  color:var(--font-color);
  flex-shrink:0;
}
.search-style-star-stack .search-box-big {
  width:100%;
}
.star-search-stack-container {
  position:relative;
  width:100%;
}
.star-search-stack-form {
  position:relative;
}
.star-search-stack-box {
  border:1px solid rgb(255 255 255 / 50%);
  border-radius:var(--theme-border-radius-xxl);
  padding:14px 16px 12px;
  transition:box-shadow 0.25s ease,border-color 0.25s ease;
}
.no-bg .star-search-stack-box {
  background:var(--main-bg-color)!important;
  border:1px solid var(--main-color);
}
.star-search-stack-box:focus-within {
  border-color:var(--focus-color);
  box-shadow:0 8px 28px rgba(0,0,0,0.1);
}
.star-search-stack-input-row {
  margin-bottom:10px;
}
.star-search-stack-form .search-input {
  width:100%;
  height:45px;
  border:0;
  background:transparent!important;
  outline:none;
  line-height:1.2;
  padding:0!important;
}
.star-search-stack-form .search-input::placeholder {
  color:var(--muted-color,#999);
}
.star-search-stack-form .search-input:disabled {
  cursor:not-allowed;
  opacity:0.65;
}
.star-search-stack-toolbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.star-search-stack-categories {
  display:flex;
  align-items:center;
  gap:8px;
  flex:1;
  min-width:0;
  flex-wrap:nowrap;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.star-search-stack-categories::-webkit-scrollbar {
  display:none;
}
.star-search-stack-category {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 36px;
  width:36px;
  height:36px;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--muted-color,#888);
  cursor:pointer;
  flex-shrink:0;
  transition:background 0.2s ease,color 0.2s ease;
}
.star-search-stack-category:hover {
  background:rgba(var(--theme-color-rgb,66,133,244),0.08);
  color:var(--theme-color,#4285f4);
}
.star-search-stack-category.is-active {
  background:rgba(var(--theme-color-rgb,66,133,244),0.14);
  color:var(--theme-color,#4285f4);
}
.star-search-stack-category-add {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 36px;
  width:36px;
  height:36px;
  padding:0;
  border:none;
  border-radius:50%;
  background:transparent;
  color:var(--muted-color,#888);
  cursor:pointer;
  flex-shrink:0;
  transition:background 0.2s ease,color 0.2s ease,border-color 0.2s ease;
}
.star-search-stack-category-add:hover {
  background:rgba(var(--theme-color-rgb,66,133,244),0.08);
  border-color:rgba(var(--theme-color-rgb,66,133,244),0.55);
  color:var(--theme-color,#4285f4);
}
.star-search-stack-category-img {
  width:20px;
  height:20px;
  object-fit:contain;
  display:block;
}
.star-search-stack-submit-btn {
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:rgba(var(--theme-color-rgb,66,133,244),0.14);
  color:var(--theme-color,#4285f4);
  cursor:pointer;
  transition:background 0.2s ease,opacity 0.2s ease;
}
.star-search-stack-submit-btn:hover {
  background:rgba(var(--theme-color-rgb,66,133,244),0.22);
}
.star-search-stack-submit-btn .iconfont,.star-search-stack-category .iconfont {
  font-size:16px;
  line-height:1;
}
.star-search-stack-submit-btn:disabled {
  opacity:0.5;
  cursor:not-allowed;
}
.star-search-stack-panel.engine-dropdown {
  padding:14px 16px 16px;
  max-height:min(360px,60vh);
}
.star-search-stack-panel-label {
  font-size:13px;
  color:var(--muted-color,#888);
  margin-bottom:10px;
  padding:4px;
  text-align:left;
}
.star-search-stack-engines {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.star-search-stack-engine {
  border:0;
  border-radius:999px;
  padding:8px 14px;
  font-size:13px;
  line-height:1.2;
  background:rgba(0,0,0,0.04);
  color:var(--font-color);
  cursor:pointer;
  transition:background 0.2s ease,color 0.2s ease;
}
.star-search-stack-engine:hover {
  background:rgba(var(--theme-color-rgb,66,133,244),0.1);
}
.star-search-stack-engine.is-active {
  background:var(--theme-color,#4285f4);
  color:#fff;
}
.io-black-mode .star-search-stack-box {
  border-color:rgba(255,255,255,0.12);
  box-shadow:0 4px 24px rgba(0,0,0,0.25);
}
.io-black-mode .star-search-stack-engine {
  background:rgba(255,255,255,0.06);
}
@media (max-width:767.98px) {
  .star-search-stack-box {
    padding:12px 14px 10px;
  }
  .star-search-stack-form .search-input {
    font-size:15px;
  }
  .star-search-stack-category {
    flex:0 0 34px;
    width:34px;
    height:34px;
  }
  .star-search-stack-submit-btn {
    width:38px;
    height:38px;
  }
}
