/* ==========================================================================
   f-ask-lume.css — CAT-17 only. Tokens only: no colours, no radii, no fonts
   declared here that are not already in tokens.css.
   ========================================================================== */

.al-head { padding: var(--s-6) var(--gutter) var(--s-4); }
.al-head h1 {
  font-family: var(--font-display);
  font-size: var(--t-title);
  line-height: var(--lh-title);
  letter-spacing: var(--tr-title);
  font-weight: var(--w-regular);
}
.al-head p { margin-top: var(--s-3); color: var(--ink-muted); max-width: var(--measure); }

.al-block { padding: var(--s-5) var(--gutter); border-top: 1px solid var(--hairline); }
.al-block > * + * { margin-top: var(--s-4); }
.al-foot { padding: var(--s-5) var(--gutter) var(--s-8); }
.al-foot > * + * { margin-top: var(--s-3); }

.al-frame {
  border: 1px solid var(--hairline);
  padding: var(--s-4);
}
.al-frame > * + * { margin-top: var(--s-3); }
.al-alarm { border-color: var(--ink-alarm); }
.al-done { border-color: var(--ink); }

/* Every tap target in this category clears the minimum, including the
   shared chip, which is smaller by default. */
.al-screen .chip,
.sheet .chip { min-height: var(--tap); }

/* ---- facts ---------------------------------------------------------------- */

.al-fact {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding-block: var(--s-2);
  border-bottom: 1px solid var(--hairline);
}
.al-fact:last-child { border-bottom: 0; }
.al-fact-value { font-size: var(--t-body); }

.al-band {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
  padding: var(--s-3) var(--gutter);
  background: var(--wash);
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}

.al-stamp { display: block; padding: 0 var(--gutter); color: var(--ink-muted); }

/* ---- the conversation ------------------------------------------------------ */

.al-stream { padding: var(--s-4) var(--gutter); }
.al-stream > * + * { margin-top: var(--s-5); }

.al-turn { display: flex; flex-direction: column; gap: var(--s-2); }
.al-who { text-transform: uppercase; }

.al-bubble > * + * { margin-top: var(--s-3); }
.al-bubble p { max-width: var(--measure); }

.al-turn-guest .al-bubble {
  border-left: 2px solid var(--ink);
  padding-left: var(--s-3);
}
.al-turn-lume .al-bubble {
  border-left: 2px solid var(--hairline);
  padding-left: var(--s-3);
}
.al-turn-staff .al-bubble {
  border-left: 2px solid var(--accent);
  padding-left: var(--s-3);
}

.al-typing {
  display: flex;
  gap: var(--s-2);
  align-items: center;
  min-height: var(--tap);
  padding-left: var(--s-3);
}
.al-dot {
  width: 6px;
  height: 6px;
  background: var(--ink-muted);
  display: inline-block;
  animation: al-pulse 1s var(--ease-inout) infinite;
}
.al-dot:nth-child(3) { animation-delay: 0.15s; }
.al-dot:nth-child(4) { animation-delay: 0.3s; }

@keyframes al-pulse {
  0%, 100% { opacity: 0.25; }
  50% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .al-dot { animation: none; opacity: 0.6; }
}

/* ---- the composer ----------------------------------------------------------- */

.al-composer {
  display: flex;
  gap: var(--s-2);
  align-items: stretch;
  padding: var(--s-4) var(--gutter);
  border-top: 1px solid var(--hairline);
}
.al-block .al-composer { padding: 0; border-top: 0; }

.al-input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: var(--tap);
  padding: var(--s-3);
  border: 1px solid var(--hairline);
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-text);
  font-size: var(--t-body);
  border-radius: var(--radius);
}
.al-input:focus-visible { border-color: var(--accent); outline: none; }
textarea.al-input { resize: vertical; }

.al-composer .btn { flex: 0 0 auto; }

/* ---- the proposal ------------------------------------------------------------ */

.al-proposal { margin-top: var(--s-4); }
.al-proposal > * + * { margin-top: var(--s-4); }

.al-line {
  border: 1px solid var(--hairline);
  padding: var(--s-3);
}
.al-line > * + * { margin-top: var(--s-2); }

.al-line-top,
.al-setline .al-line-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--s-3);
}
.al-line-name { font-size: var(--t-body); }
.al-line-price { font-variant-numeric: tabular-nums; white-space: nowrap; }

.al-setline { padding-block: var(--s-3); border-bottom: 1px solid var(--hairline); }

.al-qty { display: flex; align-items: center; gap: var(--s-3); }
.al-qty .chip { min-width: var(--tap); justify-content: center; }
.al-qty-count { font-variant-numeric: tabular-nums; min-width: 2ch; text-align: center; }

.al-mods > * + * { margin-top: var(--s-2); }

.al-line-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-3);
}

.al-total {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--s-3);
  padding-top: var(--s-3);
  border-top: 1px solid var(--ink);
}
.al-total-value { font-size: var(--t-sub); font-variant-numeric: tabular-nums; }

.al-unres, .al-amb {
  border: 1px solid var(--hairline);
  padding: var(--s-3);
}
.al-unres > * + *, .al-amb > * + * { margin-top: var(--s-3); }

/* ---- source chips -------------------------------------------------------------- */

.al-srcs { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: center; }
.al-srcs > .t-label { flex: 1 0 100%; }

.al-src {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
  padding: var(--s-1) var(--s-3);
  border: 1px solid var(--hairline);
  font-size: var(--t-label);
  letter-spacing: var(--tr-label);
  text-transform: uppercase;
  background-image: none;
}
.al-src.is-gone { opacity: 0.45; text-decoration: line-through; }

.al-src-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
  width: 100%;
  padding-block: var(--s-2);
}
.al-field {
  flex: 1 0 100%;
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-left: 2px solid var(--accent);
  padding-left: var(--s-3);
}
.al-field-value { font-size: var(--t-body); }

.al-sourced { padding-block: var(--s-4); border-bottom: 1px solid var(--hairline); }
.al-sourced > * + * { margin-top: var(--s-3); }

/* ---- answers ------------------------------------------------------------------- */

.al-answer { padding: var(--s-5) var(--gutter); border-top: 1px solid var(--hairline); }
.al-answer > * + * { margin-top: var(--s-3); }
.al-answer p { max-width: var(--measure); }

.al-fixed { border-left: 2px solid var(--ink-alarm); padding-left: var(--s-3); }
.al-derived { text-transform: uppercase; color: var(--ink-muted); }
.al-second { border-top: 1px solid var(--hairline); padding-top: var(--s-3); }

.al-controls { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.al-controls .btn { flex: 1 1 auto; }

.al-escalate { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-3); margin-top: var(--s-3); }
.al-or { display: inline-flex; align-items: center; }

.al-list > * + * { margin-top: var(--s-2); }
.al-list-row { display: flex; justify-content: space-between; gap: var(--s-3); }

/* ---- filters and flags ---------------------------------------------------------- */

.al-flags { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.al-excluded { opacity: 0.5; }
.al-excluded .row-note { color: var(--ink-alarm); }
.al-skip { padding: 0 var(--gutter); }
.al-cover { display: flex; flex-wrap: wrap; gap: var(--s-2); }
.al-cover .chip.al-on { border-color: var(--ink); }

.al-parsed { padding: var(--s-4) var(--gutter); border-top: 1px solid var(--hairline); }
.al-parsed > * + * { margin-top: var(--s-2); }
.al-hit { background: var(--wash); border-bottom: 1px solid var(--accent); }

/* ---- tonight -------------------------------------------------------------------- */

.al-struck .row-label { text-decoration: line-through; }
.al-struck { opacity: 0.6; }
.al-ranout { padding: var(--s-2) var(--gutter) var(--s-3); border-bottom: 1px solid var(--hairline); }

/* ---- pairing --------------------------------------------------------------------- */

.al-pour { padding-block: var(--s-4); border-bottom: 1px solid var(--hairline); }
.al-pour > * + * { margin-top: var(--s-2); }
.al-pour-name { font-size: var(--t-body); }
.al-gap { color: var(--ink-alarm); }

/* ---- voice ------------------------------------------------------------------------ */

.al-meter {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 42px;
  padding-block: var(--s-2);
}
.al-meter-bar {
  flex: 1 1 auto;
  height: 100%;
  background: var(--ink-muted);
  transform: scaleY(0.08);
  transform-origin: bottom;
  transition: transform 90ms linear;
}
.al-interim { min-height: 3em; }
.al-simlabel {
  display: block;
  text-transform: uppercase;
  color: var(--ink-alarm);
  border: 1px solid var(--ink-alarm);
  padding: var(--s-2);
}

/* ---- phone ------------------------------------------------------------------------- */

.al-callscript { border-top: 1px solid var(--hairline); }
.al-callline {
  display: grid;
  grid-template-columns: 4.5ch 6ch 1fr;
  gap: var(--s-2);
  padding-block: var(--s-3);
  border-bottom: 1px solid var(--hairline);
}
.al-callline-agent { background: var(--wash); }
.al-callstamp, .al-callwho { font-variant-numeric: tabular-nums; }
.al-number { font-variant-numeric: tabular-nums; }

/* ---- read aloud ---------------------------------------------------------------------- */

.al-readout { border-top: 1px solid var(--hairline); }
.al-readline {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: var(--s-3);
  border-bottom: 1px solid var(--hairline);
  border-left: 2px solid transparent;
}
.al-readline.al-speaking { border-left-color: var(--accent); background: var(--wash); }

/* ---- history and grounding -------------------------------------------------------- */

.al-thread { padding: var(--s-4) var(--gutter); border-bottom: 1px solid var(--hairline); }
.al-thread > * + * { margin-top: var(--s-3); }

.al-transcript > * + * { margin-top: var(--s-4); }

.al-plain {
  white-space: pre-wrap;
  overflow-x: auto;
  font-family: var(--font-text);
  font-size: var(--t-small);
  line-height: var(--lh-body);
  border: 1px solid var(--hairline);
  padding: var(--s-3);
  max-width: 100%;
}
.al-json { font-variant-numeric: tabular-nums; }

/* ---- your numbers -------------------------------------------------------------------- */

.al-figure {
  display: block;
  width: 100%;
  min-height: var(--tap-primary);
  text-align: left;
  font-family: var(--font-display);
  font-size: var(--t-title);
  line-height: var(--lh-title);
  border: 1px solid var(--ink);
  background: transparent;
  color: var(--ink);
  padding: var(--s-3);
  font-variant-numeric: tabular-nums;
  border-radius: var(--radius);
}
.al-figure[aria-expanded="true"] { background: var(--ink); color: var(--paper); }

/* ---- language ------------------------------------------------------------------------- */

.al-pair { padding-block: var(--s-3); border-bottom: 1px solid var(--hairline); }
.al-pair > * + * { margin-top: var(--s-1); }
.al-untranslated {
  display: block;
  text-transform: uppercase;
  color: var(--ink-alarm);
  max-width: var(--measure);
}

/* ---- limits ---------------------------------------------------------------------------- */

.al-limit { padding-block: var(--s-4); border-bottom: 1px solid var(--hairline); }
.al-limit > * + * { margin-top: var(--s-3); }
.al-limit .row-item:first-of-type { border-top: 0; }

/* ---- clock ------------------------------------------------------------------------------ */

.al-clock {
  font-size: var(--t-sub);
  font-variant-numeric: tabular-nums;
}
