/*
 * 常见问题：旧聊天窗口的轻量横向问题栏。
 * 始终位于输入框上方，只显示左右箭头和可点击问题。
 */
.support-guess{
  flex:0 0 auto;
  min-width:0;
  margin:0;
  padding:8px 10px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 28px;
  grid-template-rows:34px 14px;
  align-items:center;
  column-gap:6px;
  row-gap:1px;
  box-sizing:border-box;
  border:0;
  border-top:1px solid rgba(60,60,67,.1);
  background:rgba(255,255,255,.96);
  color:#1f2937;
  color-scheme:light;
}
.support-guess.has-previous{grid-template-columns:28px minmax(0,1fr) 28px}

.support-guess-list{
  grid-column:1;
  grid-row:1;
  min-width:0;
  margin:0;
  padding:0 2px 2px;
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:6px;
  overflow-x:auto;
  overflow-y:hidden;
  overscroll-behavior-inline:contain;
  scroll-snap-type:x proximity;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x;
}
.support-guess.has-previous .support-guess-list{grid-column:2}
.support-guess-list::-webkit-scrollbar{display:none}
.support-guess-list:focus-visible{outline:2px solid color-mix(in srgb,var(--support-color,#635bff),transparent 38%);outline-offset:2px}
.support-guess-list.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.support-guess-arrow{
  grid-row:1;
  width:28px;
  height:30px;
  padding:0;
  border:1px solid rgba(148,163,184,.24);
  border-radius:8px;
  background:#fff;
  color:#516076;
  font:800 17px/1 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;
  cursor:pointer;
  touch-action:manipulation;
}
.support-guess-arrow--previous{grid-column:1}
.support-guess-arrow--next{grid-column:2}
.support-guess.has-previous .support-guess-arrow--next{grid-column:3}
.support-guess-arrow:hover:not(:disabled){border-color:color-mix(in srgb,var(--support-color,#635bff),transparent 55%);color:var(--support-color,#635bff);background:color-mix(in srgb,var(--support-color,#635bff),white 96%)}
.support-guess-arrow:disabled{opacity:.34;cursor:default}
.support-guess-arrow[hidden]{display:none}
.support-guess-scroll{
  grid-column:1 / -1;
  grid-row:2;
  width:100%;
  height:14px;
  margin:-1px 0 0;
  padding:0;
  border:0;
  appearance:none;
  -webkit-appearance:none;
  background:transparent;
  cursor:ew-resize;
  touch-action:pan-x;
}
.support-guess-scroll[hidden]{display:none}
.support-guess-scroll::-webkit-slider-runnable-track{height:3px;border-radius:999px;background:rgba(148,163,184,.24)}
.support-guess-scroll::-webkit-slider-thumb{width:22px;height:7px;margin-top:-2px;border:0;border-radius:999px;-webkit-appearance:none;background:color-mix(in srgb,var(--support-color,#635bff),white 18%);box-shadow:0 1px 3px rgba(15,23,42,.18)}
.support-guess-scroll::-moz-range-track{height:3px;border:0;border-radius:999px;background:rgba(148,163,184,.24)}
.support-guess-scroll::-moz-range-progress{height:3px;border-radius:999px;background:color-mix(in srgb,var(--support-color,#635bff),white 18%)}
.support-guess-scroll::-moz-range-thumb{width:22px;height:7px;border:0;border-radius:999px;background:color-mix(in srgb,var(--support-color,#635bff),white 18%);box-shadow:0 1px 3px rgba(15,23,42,.18)}
.support-guess-item{
  flex:0 0 auto;
  max-width:min(230px,62vw);
  min-height:34px;
  padding:0 11px;
  overflow:hidden;
  border:1px solid rgba(148,163,184,.24);
  border-radius:9px;
  background:#fff;
  color:#334155;
  font:600 11px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif;
  text-align:left;
  text-overflow:ellipsis;
  white-space:nowrap;
  scroll-snap-align:start;
  cursor:pointer;
  transition:border-color .15s ease,color .15s ease,background-color .15s ease;
}
.support-guess-item:hover{
  border-color:color-mix(in srgb,var(--support-color,#635bff),transparent 58%);
  color:var(--support-color,#635bff);
  background:color-mix(in srgb,var(--support-color,#635bff),white 97%);
}
.support-guess-item:active{background:color-mix(in srgb,var(--support-color,#635bff),white 91%)}
.support-guess-item:focus-visible{outline:2px solid color-mix(in srgb,var(--support-color,#635bff),transparent 38%);outline-offset:1px}

@media(max-width:420px){
  .support-guess{padding:7px 8px;grid-template-columns:minmax(0,1fr) 26px;column-gap:5px}
  .support-guess.has-previous{grid-template-columns:26px minmax(0,1fr) 26px}
  .support-guess-arrow{width:26px;height:29px;font-size:16px}
  .support-guess-item{min-height:32px;max-width:68vw;padding:0 10px;font-size:10.5px}
  .support-guess-scroll{height:18px}
}
@media(max-width:520px) and (max-height:520px){
  .support-guess{padding:4px 8px;gap:4px}
  .support-guess-list{max-height:34px}
}
@media(prefers-reduced-motion:reduce){.support-guess-item{transition:none}}
