/* Hammer Remit: what genesee.css does not already cover. The shell, the cards, the tables,
   the seed row and the notes are genesee's; this file holds the sweep's two columns, the
   findings rows, the held figures beside the withhold, the sliders and the footer. */

.remit-hero .lede { max-width: 62ch; }
.remit-hero .seedrow { margin-top: 1.25rem; }
.runstatus { min-height: 1.4em; margin: 0.5rem 0 0; }
.runstatus:empty { margin: 0; min-height: 0; }

/* the sweep: calls on the left, the narration on the right */
.sweep-grid { display: grid; grid-template-columns: minmax(16rem, 2fr) 3fr; gap: 1.5rem; align-items: start; margin: 1rem 0 1.5rem; }
.sweep-col { min-width: 0; }
.calls { margin: 0; padding: 0; list-style: none; }
.calls > li { margin: 0 0 0.75rem; }
.calls details { border: 1px solid var(--line, #d9d4c7); border-radius: 6px; background: var(--paper, #fff); overflow: hidden; }
/* one row: number, tool, intent, the first argument, and the state in the last column */
.calls summary { cursor: pointer; padding: 0.55rem 0.75rem; font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 0.8rem; display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; grid-auto-flow: dense; gap: 0.25rem 0.6rem; align-items: baseline; list-style: none; }
.calls summary::-webkit-details-marker { display: none; }
.calls summary .n { font-size: 0.72rem; opacity: 0.6; min-width: 1.4em; }
.calls summary .label { white-space: nowrap; }
.calls summary .intent { font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calls summary .intent:empty { display: none; }
.calls summary .argpreview { grid-column: 2 / 4; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; opacity: 0.85; }
.calls summary .argpreview:empty { display: none; }
.calls summary .state { grid-column: 4; grid-row: 1; justify-self: end; opacity: 0.7; font-size: 0.7rem; letter-spacing: 0.04em; text-transform: uppercase; white-space: nowrap; }
.calls summary .state--refused { color: var(--bad, #a0231a); opacity: 1; }
.calls .callbody { padding: 0 0.75rem 0.75rem; font-size: 0.85rem; border-top: 1px solid var(--line, #d9d4c7); }
.calls .callbody .note { margin: 0.6rem 0 0.25rem; }
.calls .callbody .kv { margin: 0.4rem 0; }
.calls .callbody code, .calls .ids code { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 0.8rem; overflow-wrap: anywhere; }
/* every argument, wrapped, never wider than the card */
.calls .callbody .args { margin: 0; font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 0.75rem; line-height: 1.4; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 18rem; overflow: auto; background: var(--wash, #f6f3ea); padding: 0.5rem; border-radius: 4px; }
.calls .ids { display: flex; flex-wrap: wrap; gap: 0.3rem; margin: 0.4rem 0 0; padding: 0; list-style: none; }
.calls .ids li { padding: 0.1rem 0.4rem; border: 1px solid var(--line, #d9d4c7); border-radius: 4px; }
.calls .refusal { margin: 0.4rem 0 0; overflow-wrap: anywhere; }

/* the narration: the model's prose, the little markdown it writes rendered as nodes */
.narration { font-family: "Source Serif 4", Georgia, serif; font-size: 1rem; line-height: 1.55; min-width: 0; }
.narration .turn { margin: 0 0 1.5rem; }
.narration .you { font-family: "Archivo", system-ui, sans-serif; font-size: 0.85rem; opacity: 0.8; margin: 0 0 0.6rem; padding: 0.45rem 0.6rem; border-left: 3px solid var(--line, #d9d4c7); background: var(--wash, #f6f3ea); }
.narration .you .label { margin-right: 0.4rem; }
.narration .said { margin: 0; overflow-wrap: anywhere; }
.narration .said:empty::after { content: "…"; opacity: 0.5; }
.narration .said p { margin: 0 0 0.75rem; }
.narration .said ul, .narration .said ol { margin: 0 0 0.75rem; padding-left: 1.4rem; }
.narration .said li { margin: 0.15rem 0; }
.narration .said strong { font-weight: 600; }
.narration .said code { font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 0.85em; background: var(--wash, #f6f3ea); padding: 0 0.25em; border-radius: 3px; }
.narration .said details.pasted { margin: 0 0 0.75rem; border: 1px solid var(--line, #d9d4c7); border-radius: 6px; font-family: "Archivo", system-ui, sans-serif; font-size: 0.82rem; }
.narration .said details.pasted summary { cursor: pointer; padding: 0.4rem 0.6rem; opacity: 0.8; }
.narration .said details.pasted pre { margin: 0; padding: 0.5rem 0.6rem; border-top: 1px solid var(--line, #d9d4c7); font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 0.75rem; line-height: 1.4; white-space: pre-wrap; overflow-wrap: anywhere; max-height: 24rem; overflow: auto; }
.narration .aside { font-family: "Archivo", system-ui, sans-serif; font-size: 0.82rem; margin: 0.5rem 0 0; padding: 0.4rem 0.6rem; border-left: 3px solid var(--line, #d9d4c7); background: var(--wash, #f6f3ea); }
.narration .aside .label { margin-right: 0.4rem; }
.narration .aside--refusal, .narration .aside--error { border-left-color: var(--bad, #a0231a); }
.narration .thinking { font-family: "Archivo", system-ui, sans-serif; font-size: 0.82rem; opacity: 0.75; margin: 0 0 0.6rem; padding: 0.45rem 0.6rem; border-left: 3px solid var(--line, #d9d4c7); }
.narration .thinking summary { cursor: pointer; letter-spacing: 0.04em; text-transform: uppercase; font-size: 0.72rem; }
.narration .thinking p { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0.3rem 0 0; }

/* the chart the model draws, phone first: the figure has no margin of its own (a browser's
   default figure margin is 40px and would push it past the card), the label wraps, the bar
   keeps a floor, the value stays on one line, and nothing scrolls sideways. */
.narration .said figure.modelchart { margin: 0 0 0.75rem; padding: 0.6rem 0.7rem; border: 1px solid var(--line, #d9d4c7); border-radius: 6px; max-width: 100%; }
.modelchart figcaption { display: block; margin: 0 0 0.5rem; font-family: "Archivo", system-ui, sans-serif; }
.modelchart figcaption b { display: block; font-size: 0.9rem; }
.modelchart figcaption .note { display: block; margin: 0.15rem 0 0; font-size: 0.78rem; }
.modelchart .chartrows { width: 100%; table-layout: fixed; border-collapse: collapse; }
.modelchart .chartrows th, .modelchart .chartrows td { border: 0; padding: 0.25rem 0.4rem 0.25rem 0; vertical-align: middle; text-align: left; }
.modelchart .chartrows th { width: 40%; font-family: "Archivo", system-ui, sans-serif; font-size: 0.76rem; font-weight: 400; line-height: 1.3; overflow-wrap: anywhere; }
.modelchart .chartrows td.barcell { width: 36%; }
.modelchart .chartrows td.v { width: 24%; padding-right: 0; font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 0.76rem; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.modelchart .track { min-width: 2.5rem; background: var(--wash, #f6f3ea); border-radius: 3px; overflow: hidden; }
.modelchart .fill { height: 0.7rem; min-width: 2px; border-radius: 3px; background: var(--line, #b9b2a0); }
.modelchart .fill--served { background: var(--ink, #1a1916); }
.modelchart .notserved { display: inline-block; margin-left: 0.35rem; padding: 0 0.3rem; border: 1px solid var(--bad, #a0231a); border-radius: 3px; color: var(--bad, #a0231a); font-family: "IBM Plex Mono", ui-monospace, monospace; font-size: 0.62rem; text-transform: uppercase; letter-spacing: 0.04em; white-space: nowrap; }
.modelchart .note { margin: 0.5rem 0 0; font-size: 0.78rem; }
.modelchart details.pasted { margin: 0.5rem 0 0; }

/* the findings. genesee's `.tbl--mono td` is nowrap, which is right for its claim browser and
   wrong here: seven columns with an Ask sentence pushed the table past its card and into a
   scroll. The text columns wrap at any point; the claim id and the amount stay on one line.
   Every `.tbl` on this page sits in genesee's `.scrollx` (overflow-x: auto) as the last resort. */
.findings { table-layout: auto; }
.findings td { white-space: normal; overflow-wrap: anywhere; }
.findings td:first-child, .findings td.amount { white-space: nowrap; }
.findings td.amount, .findings th:nth-child(4) { text-align: right; font-variant-numeric: tabular-nums; }
.findings .class { cursor: help; border-bottom: 1px dotted currentColor; }
.findings .askbtn { font: inherit; background: none; border: 0; padding: 0; color: var(--ink, #1a1916); text-decoration: underline; cursor: pointer; white-space: normal; text-align: left; }
.findings .askbtn:hover { text-decoration: none; }
.classes td.why { overflow-wrap: anywhere; }

/* the held figures and the withhold beside them */
.held-stats dd, .declared-stats dd { font-variant-numeric: tabular-nums; }
.withhold { margin: 1.25rem 0 0; padding: 0.9rem 1rem; border: 1px dashed var(--line, #d9d4c7); border-radius: 6px; max-width: 46rem; }
.withhold p { margin: 0.25rem 0; }
.withhold .money { font-family: "IBM Plex Mono", ui-monospace, monospace; margin-left: 0.5rem; }
.classes td.why { font-size: 0.85rem; max-width: 24rem; }

/* the declared inputs */
.carcs { max-width: 40rem; }
.sliders { display: grid; gap: 0.9rem; max-width: 46rem; margin: 0.5rem 0 1rem; }
.slider, .rate { display: grid; grid-template-columns: 1fr auto; gap: 0.2rem 0.9rem; align-items: center; margin: 0; }
.slider__name { font-weight: 600; grid-column: 1 / -1; }
.slider__name .section-kicker { display: inline; margin-left: 0.5rem; }
.slider input[type=range] { width: 100%; accent-color: var(--ink, #1a1916); }
.slider output, .rate b { font-family: "IBM Plex Mono", ui-monospace, monospace; min-width: 4ch; text-align: right; }
.slider .hint, .rate .hint { grid-column: 1 / -1; font-size: 0.82rem; opacity: 0.8; }
.rate { grid-template-columns: 1fr auto; }
.rate .slider__name { grid-column: 1; }
.declared-stats { margin-top: 1rem; }

/* the composer for the follow-up questions */
.askrow input[type=text] { flex: 1; min-width: 0; }
.askrow input[type=text]:disabled, .askrow .btn:disabled { opacity: 0.55; cursor: not-allowed; }
.ask-card .card { margin-top: 0.75rem; }

.remit-foot { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; }
.remit-foot span { font-family: "IBM Plex Mono", ui-monospace, monospace; }

@media (max-width: 760px) {
  .sweep-grid { grid-template-columns: 1fr; }
  .slider, .rate { grid-template-columns: 1fr; }
  .slider output, .rate b { text-align: left; }
}

/* embedded on hammer.ai (`?embed&fill`, the only shape the site ships): the shell's chrome
   goes with style.css's embed rules, the cards stay, and so does the footer, because it is
   the one place the page names the model and the world build. No rule here hides it. */
