/* Voice capture UI. */

.rec-wrap { text-align: center; padding: 18px 0 6px; }

.rec-btn {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  border: 3px solid var(--border);
  background: var(--bg);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.15s, background 0.15s;
}
.rec-btn .rec-dot {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--out);
  transition: border-radius 0.18s, width 0.18s, height 0.18s;
}
.rec-btn.on { border-color: var(--out); background: color-mix(in srgb, var(--out) 12%, transparent); }
/* Circle becomes a square while recording: the universal stop affordance. */
.rec-btn.on .rec-dot { width: 30px; height: 30px; border-radius: 5px; animation: pulse 1.4s ease-in-out infinite; }

@keyframes pulse { 0%,100% { opacity: 1 } 50% { opacity: 0.45 } }
@media (prefers-reduced-motion: reduce) {
  .rec-btn.on .rec-dot { animation: none; }
  .spinner { animation-duration: 2.4s; }
}

.rec-time {
  margin-top: 14px;
  font-size: 1.5rem;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--text);
}

.spinner {
  width: 42px;
  height: 42px;
  margin: 26px auto 0;
  border: 3px solid var(--border);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: spin 0.9s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg) } }

.rec-transcript {
  font-style: italic;
  background: var(--bg);
  border-left: 3px solid var(--border);
  padding: 9px 12px;
  border-radius: 0 8px 8px 0;
  margin: 4px 0 12px;
  font-size: 0.88rem;
}

.inv-list.review .inv-row { gap: 9px; }
.inv-list.review .keep { flex: none; margin: 0; padding: 0; }
.inv-list.review .keep input { width: 22px; height: 22px; margin: 0; }

.inv-row.dropped { opacity: 0.4; }
.inv-row.dropped .inv-name { text-decoration: line-through; }
.inv-row.unsure .inv-name small { color: var(--low); }

.newbadge {
  margin-left: 6px;
  padding: 1px 7px;
  border-radius: 999px;
  background: var(--accent-dim);
  color: var(--accent);
  font-size: 0.66rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  vertical-align: 1px;
}

.stt-note { text-align: center; font-size: 0.75rem; margin: 12px 0 0; }