body.left-nav-layout .navbar .stream-search-launcher {
  display: flex; flex: 0 0 auto; align-items: center; gap: 10px;
  min-height: 40px; margin: 0 20px 8px; padding: 10px 13px;
  border: 1px solid #454545; border-radius: 9px; background: #202020; color: #e9e9e9;
  font: 600 13px/1.2 Inter, "Segoe UI", sans-serif; cursor: pointer;
}
.stream-search-launcher kbd { margin-left: auto; color: #aaa; font: inherit; }
body.left-nav-layout .navbar .stream-search-launcher:hover { background: #2d2d2d; border-color: #747474; }
body.left-nav-layout .navbar .stream-search-launcher:focus-visible { outline-color: #ddd; }
body.left-nav-layout .navbar.menu-collapsed .stream-search-launcher {
  position: absolute; top: 180px; bottom: auto; left: 50%; z-index: 10; width: 40px; height: 40px;
  margin: 0; padding: 0; justify-content: center; transform: translateX(-50%);
}
body.left-nav-layout .navbar.menu-collapsed .stream-search-launcher :is(span, kbd) { display: none; }
body.left-nav-layout .navbar.menu-collapsed .stream-search-launcher > i:first-child { font-size: 16px; }
#streamSearchDialog {
  box-sizing: border-box; width: min(1080px, calc(100vw - 32px)); max-width: none;
  inset: 0; margin: auto; max-height: calc(100dvh - 32px); padding: 0; border: 1px solid #484848; border-radius: 18px;
  background: #1b1b1b; color: #e9e9e9; box-shadow: 0 24px 90px #000c; overflow: hidden;
  font: 400 14px/1.5 Inter, "Segoe UI", sans-serif; color-scheme: dark;
}
#streamSearchDialog[open] { display: flex; flex-direction: column; }
#streamSearchDialog::backdrop { background: #080808b3; }
#streamSearchDialog * { box-sizing: border-box; }
#streamSearchDialog [hidden] { display: none !important; }
#streamSearchDialog button { font: inherit; color: inherit; cursor: pointer; }
#streamSearchDialog button:disabled { cursor: default; opacity: .45; }
#streamSearchDialog :is(button, input, select):focus-visible, .stream-search-launcher:focus-visible { outline: 2px solid #dddddd; outline-offset: 3px; }
.stream-search-header { display: flex; flex: 0 0 auto; justify-content: space-between; align-items: center; gap: 12px; padding: 22px 24px 14px; }
.stream-search-eyebrow { color: #aaaaaa; font-size: 10px; letter-spacing: .12em; font-weight: 600; }
#streamSearchHeading { margin: 4px 0 0; font: 600 22px/1.3 Inter, "Segoe UI", sans-serif; letter-spacing: -.03em; }
#streamSearchClose { width: 36px; height: 36px; border: 1px solid #454545; border-radius: 9px; background: #2b2b2b; }
.stream-search-field { flex: 0 0 auto; display: flex; align-items: center; gap: 12px; margin: 0 24px 20px; padding: 0 14px; border: 1px solid #666666; border-radius: 10px; background: #101010; color: #aaaaaa; }
#streamSearchInput { flex: 1; width: 0; min-width: 0; height: 49px; padding: 0; border: 0; outline: none; background: transparent; color: #f1f1f1; font: 400 16px/1.5 Inter, "Segoe UI", sans-serif; }
#streamSearchInput::placeholder { color: #888888; }
#streamSearchDialog #streamSearchInput:focus-visible { outline: none; }
.stream-search-field:focus-within { border-color: #dddddd; box-shadow: 0 0 0 2px #dddddd22; }
#streamSearchDialog #streamSearchClear { border: 0; padding: 6px; background: transparent; color: #bbbbbb; font-size: 12px; }
.stream-search-body { display: grid; grid-template-columns: minmax(240px, 32%) minmax(0, 1fr); min-height: 0; overflow: auto; border-top: 1px solid #343434; }
.stream-search-matches { min-width: 0; min-height: 0; border-right: 1px solid #343434; background: #171717; display: flex; flex-direction: column; }
#streamSearchCount { flex: 0 0 auto; margin: 0; padding: 14px 18px 10px; color: #aaaaaa; font-size: 12px; }
#streamSearchResults { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 8px 12px; max-height: 460px; scrollbar-width: thin; scrollbar-color: #555555 transparent; }
#streamSearchDialog .stream-search-result { width: 100%; display: flex; align-items: center; gap: 10px; padding: 12px 9px; margin: 2px 0; border: 1px solid transparent; border-radius: 8px; background: transparent; text-align: left; }
#streamSearchDialog .stream-search-result:hover { background: #292929; }
#streamSearchDialog .stream-search-result[aria-selected="true"] { background: #333333; border-color: #777777; }
.stream-search-mark { display: grid; place-items: center; flex: 0 0 32px; height: 32px; border-radius: 50%; background: #484848; color: #e5e5e5; font-size: 11px; font-weight: 600; }
.stream-search-result-copy { flex: 1; min-width: 0; display: grid; gap: 3px; }
.stream-search-result-copy strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: 600; }
.stream-search-result-copy > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #aaaaaa; font-size: 11px; }
.stream-search-result-status { flex: 0 0 auto; font-size: 10px; color: #bbbbbb; }
.stream-search-result-status[data-state="on-air"] { color: #eeeeee; font-weight: 600; }
.stream-search-result-status[data-state="offline"] { color: #999999; }
#streamSearchEmpty { margin: 8px 18px 24px; color: #aaaaaa; font-size: 14px; }
.stream-search-preview-panel { min-width: 0; padding: 18px 22px 22px; }
#streamSearchPreviewName { margin: 0; font-size: 19px; font-weight: 600; overflow-wrap: anywhere; }
#streamSearchPreviewTeam { margin: 4px 0 14px; color: #aaaaaa; font-size: 12px; }
#streamSearchPreview { position: relative; width: 100%; aspect-ratio: 16 / 9; max-height: min(37dvh, 340px); background: #080808; border: 1px solid #343434; border-radius: 10px; overflow: hidden; }
#streamSearchPreview :is(video, iframe) { width: 100%; height: 100%; border: 0; object-fit: contain; }
#streamSearchPreview[data-state="loading"]::after { content: ""; position: absolute; top: calc(50% - 14px); left: calc(50% - 14px); width: 28px; height: 28px; border: 2px solid #454545; border-top-color: #dddddd; border-radius: 50%; animation: stream-search-spin 1s linear infinite; }
.stream-search-preview-message { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 47px; }
#streamSearchPreviewStatus { margin: 10px 0; font-size: 12px; color: #aaaaaa; }
#streamSearchRetry { flex: 0 0 auto; padding: 7px 10px; border: 1px solid #555555; border-radius: 7px; background: #303030; font-size: 12px !important; }
.stream-search-actions { display: flex; align-items: end; gap: 12px; margin-top: 6px; }
.stream-search-actions label { flex: 1; min-width: 0; color: #bbbbbb; font-size: 12px; }
#streamSearchSlot { display: block; width: 100%; height: 42px; margin-top: 5px; padding: 0 10px; border: 1px solid #555555; border-radius: 8px; background: #252525; color: #eeeeee; font: inherit; }
#streamSearchDialog #streamSearchGoLive { flex: 0 0 auto; min-width: 150px; min-height: 42px; margin-left: auto; padding: 10px 22px; border: 1px solid #cccccc; border-radius: 8px; background: #dddddd; color: #181818; font-size: 14px; font-weight: 700; }
.stream-search-commit-note { margin: 12px 0 0; color: #999999; font-size: 11px; line-height: 1.6; }
#streamSearchHelp { display: flex; flex: 0 0 auto; gap: 22px; padding: 14px 24px; border-top: 1px solid #343434; color: #aaaaaa; font-size: 12px; }
#streamSearchHelp kbd { display: inline-block; min-width: 20px; padding: 1px 5px; border: 1px solid #484848; border-radius: 4px; background: #282828; color: #dddddd; font: inherit; text-align: center; }
@keyframes stream-search-spin { to { transform: rotate(360deg); } }
@media (max-width: 680px) {
  #streamSearchDialog { width: calc(100vw - 20px); max-height: calc(100dvh - 20px); }
  .stream-search-header { padding: 16px 16px 12px; }
  #streamSearchHeading { font-size: 19px; }
  .stream-search-field { margin: 0 16px 14px; }
  .stream-search-body { grid-template-columns: minmax(0, 1fr); }
  .stream-search-matches { border-right: 0; border-bottom: 1px solid #343434; }
  #streamSearchResults { flex: 0 0 auto; max-height: 150px; }
  .stream-search-preview-panel { padding: 14px 16px; }
  #streamSearchHelp { padding: 12px 16px; gap: 14px; }
}
@media (prefers-reduced-motion: reduce) { #streamSearchPreview[data-state="loading"]::after { animation: none; } }

/* Keep the no-results preference beside the query, including phone widths. */
#streamSearchDialog .stream-search-auto-clear {
  flex: 0 0 auto; display: flex; align-items: center; gap: 6px;
  padding: 6px 0 6px 8px; border-left: 1px solid #454545;
  color: #eee; font: 600 11px/1.3 Inter, sans-serif; cursor: pointer;
}
#streamSearchDialog .stream-search-auto-clear input { margin: 0; width: 15px; height: 15px; accent-color: #aaa; }
#streamSearchDialog .stream-search-auto-clear small { display: block; color: #aaa; font-size: 9px; font-weight: 400; }
@media (max-width: 600px) {
  #streamSearchDialog .stream-search-field { gap: 6px; padding: 0 8px; }
  #streamSearchDialog .stream-search-field > .fa-magnifying-glass { display: none; }
  #streamSearchDialog #streamSearchClear { padding: 4px 0; font-size: 10px; }
}