.compare-field { display: grid; gap: 8px; min-width: 0; }
.compare-field [hidden], .model-picker [hidden], .compare-picker-error[hidden] { display: none; }
.model-picker { position: relative; min-width: 0; }
.model-picker-trigger {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: 100%; min-height: 46px; padding: 11px 12px; text-align: left;
  border: 1px solid rgb(var(--color-border)); border-radius: 3px;
  background: rgb(var(--color-canvas)); color: rgb(var(--color-text));
  font-size: 13px; line-height: 1.5; cursor: pointer;
}
.model-picker-trigger span { overflow-wrap: anywhere; }
.model-picker-trigger::after {
  content: ''; width: 7px; height: 7px; flex: 0 0 7px;
  border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg); margin: -4px 2px 0;
}
.model-picker-trigger[aria-expanded="true"] { border-color: rgb(var(--color-accent)); }
.model-picker-panel {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 30;
  padding: 12px 0 0; background: rgb(var(--color-canvas));
  border: 1px solid rgb(var(--color-border)); border-radius: 4px;
  box-shadow: 0 8px 24px rgb(0 0 0 / .12);
}
.model-picker-search {
  display: block; width: calc(100% - 24px); margin: 0 12px; min-height: 44px;
  padding: 10px; border: 1px solid rgb(var(--color-border)); border-radius: 3px;
  background: rgb(var(--color-canvas)); color: rgb(var(--color-text));
  font-size: 16px; line-height: 1.4;
}
.model-picker-search::placeholder { color: rgb(var(--color-muted)); font-size: 13px; }
.model-picker-status { margin: 10px 12px; color: rgb(var(--color-muted)); font-size: 11px; line-height: 1.5; }
.model-picker-list {
  position: relative; max-height: 280px; max-height: min(280px, 40dvh);
  overflow-y: auto; overscroll-behavior: contain; list-style: none; padding: 0; margin: 0;
  border-top: 1px solid rgb(var(--color-border));
}
.model-picker-list li { padding: 11px 12px; cursor: pointer; border-bottom: 1px solid rgb(var(--color-border)); }
.model-picker-list li:last-child { border-bottom: 0; }
.model-picker-list strong { display: block; font-family: ui-monospace, monospace; font-size: 13px; overflow-wrap: anywhere; }
.model-picker-list li span { display: block; margin-top: 3px; color: rgb(var(--color-muted)); font-size: 12px; }
.model-picker-list li:hover, .model-picker-list .is-active { background: rgb(var(--color-surface)); }
.model-picker-list [aria-selected="true"] { box-shadow: inset 3px 0 rgb(var(--color-accent)); }
.compare-picker-error { grid-column: 1 / -1; font-size: 13px; color: rgb(var(--color-text)); margin: 0; }