.loading-feedback-dock {
  position: fixed;
  z-index: 1200;
  inset-inline-end: 1rem;
  bottom: 1rem;
  width: min(28rem, calc(100% - 2rem));
  display: grid;
  gap: .5rem;
  max-height: 40vh;
  overflow: auto;
}
.loading-feedback {
  display: flex;
  align-items: center;
  position: relative;
  gap: .85rem;
  padding: 1rem;
  border: 1px solid var(--border, #bdd5cc);
  border-inline-start: 4px solid var(--kbb-primary, #167568);
  border-radius: 12px;
  background: var(--surface-strong, #fff);
  color: var(--text-primary, #15352f);
  font-size: .9rem;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.loading-feedback-copy { min-width: 0; flex: 1; }
.loading-feedback-label { display: block; font-size: .95rem; margin-bottom: .2rem; }
.loading-feedback-icon {
  display: grid;
  place-items: center;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: var(--surface-soft, #e8f2ed);
  color: var(--text-primary, #15352f);
  font-size: 1.4rem;
  font-weight: 700;
}
.loading-feedback-inline {
  margin-block: .85rem 1rem;
  padding-bottom: 1.25rem;
  width: 100%;
  box-sizing: border-box;
  background: var(--surface-soft, #e8f2ed);
  overflow: hidden;
}
.loading-feedback-line {
  position: absolute;
  inset-inline: 0;
  bottom: 0;
  height: 4px;
  background: var(--border, #bdd5cc);
  overflow: hidden;
}
.loading-feedback-line::after {
  content: "";
  display: block;
  width: 35%;
  height: 100%;
  background: var(--kbb-primary, #167568);
  animation: loading-feedback-travel 1.6s ease-in-out infinite alternate;
}
.loading-feedback-inline:not([data-state="loading"]) .loading-feedback-line { display: none; }
.loading-feedback[data-state="error"] { border-inline-start-color: var(--text-muted, #526d65); }
.loading-feedback-spinner {
  flex: 0 0 auto;
  width: 1.15rem;
  height: 1.15rem;
  border: 2px solid currentColor;
  border-inline-end-color: transparent;
  border-radius: 50%;
  animation: loading-feedback-spin .8s linear infinite;
}
.loading-feedback-spinner[hidden] { display: none; }
.loading-feedback-dismiss {
  flex: 0 0 44px;
  width: 44px;
  min-width: 44px;
  height: 44px;
  min-height: 44px;
  padding: 0;
  margin-inline-start: auto;
  border: 1px solid currentColor;
  border-radius: 4px;
  background: var(--surface-strong, #fff);
  color: inherit;
  font-size: 1.4rem;
  cursor: pointer;
}
.loading-feedback-dismiss:focus-visible { outline: 3px solid currentColor; outline-offset: 2px; }
@keyframes loading-feedback-spin { to { transform: rotate(360deg); } }
@keyframes loading-feedback-travel { from { transform: translateX(-100%); } to { transform: translateX(285%); } }
@media (prefers-reduced-motion: reduce) {
  .loading-feedback-spinner { animation: none; border-style: dotted; }
  .loading-feedback-line::after { animation: none; width: 100%; opacity: .5; }
}
@media print { .loading-feedback-dock, .loading-feedback-inline { display: none; } }
