/* Bureo shell M1: the chat column's messages on the kit (app/m1-chat.js puts the classes on; the study = docs/ux/chat-studies/mix/M1,
   mix.js ai() / h.steps / ref()). Bridge rules only, scoped under html.b-m1 and #agThread / #agChips, kit tokens only; the confirm
   card (.b-confirm / k-cc) is shell-m1.css's. #agThread outranks the classic look's light-mode bridge (shell-m1.css .ag-btn …). */

/* the message: k-amsg = k-aw (mark, Bureo, time) over k-ab; the Bureo row is real markup now, not shell-m1.css's ::before */
html.b-m1 #agThread .m.ai:is(.k-amsg,.m1k-amsg){display:flex;flex-direction:column;gap:6px;color:var(--k-text);font-size:var(--k-t-md);line-height:1.5}
html.b-m1 #agThread .m.ai:is(.k-amsg,.m1k-amsg)::before{content:none;display:none}
html.b-m1 #agThread .m.ai:is(.k-amsg,.m1k-amsg)>*{margin-left:26px}
html.b-m1 #agThread .m.ai:is(.k-amsg,.m1k-amsg)>:is(.k-aw,.m1k-aw){margin:0;min-height:18px}
html.b-m1 #agThread .m.ai:is(.k-amsg,.m1k-amsg)>:is(.k-ab,.m1k-ab){margin-left:0;padding-left:26px}
html.b-m1 #agThread .m.ai:is(.k-amsg,.m1k-amsg)>:is(.k-ab,.m1k-ab)~*{margin-top:4px}
html.b-m1 #agThread .m.ai:is(.k-amsg,.m1k-amsg)>:is(.k-aw,.m1k-aw) b{color:var(--k-text);font-weight:600}
html.b-m1 #agThread .m.ai.m1c-cont{margin-top:-4px}
html.b-m1 #agThread :is(.k-ab,.m1k-ab){gap:10px;font-size:var(--k-t-base);line-height:1.55}
html.b-m1 #agThread :is(.k-ab,.m1k-ab)>p,html.b-m1 #agThread :is(.k-ab,.m1k-ab) p{margin:0}
html.b-m1 #agThread :is(.k-amsg,.m1k-amsg) b{color:var(--k-text);font-weight:600}
html.b-m1 #agThread :is(.k-amsg,.m1k-amsg) .muted{color:var(--k-text-2)}
html.b-m1 #agThread .m.fresh :is(.k-steps,.m1k-steps){opacity:0;animation:agIn .32s ease forwards}

/* the tools it used: the study's folded "Used 3 tools" (kit :is(.k-steps,.m1k-steps), mix overrides: no box, 13 px) */
html.b-m1 #agThread :is(.k-steps,.m1k-steps) summary{color:var(--k-text-2)}
html.b-m1 #agThread :is(.k-steps,.m1k-steps) summary>svg:first-child{color:var(--k-text-2);flex:none}
html.b-m1 #agThread :is(.k-steps,.m1k-steps) summary :is(.k-chev,.m1k-chev){display:inline-flex}
html.b-m1 #agThread :is(.k-steps,.m1k-steps) li{font-size:var(--k-t-sm)}

/* the result card: m1c-card = a k-card2 in the chat (the study chat card: ka-card, 20 px radius, the soft ring + shadow of .k-chat :is(.k-cc,.m1k-cc)) */
html.b-m1 #agThread .ag-card.m1c-card{display:block;margin:0;padding:8px 16px;border-radius:20px;background:var(--ka-card);color:var(--k-text);box-shadow:0 14px 40px -26px rgba(20,22,30,.45),0 0 0 1px var(--ka-soft)}
/* whitespace instead of lines (declutter rule): rows apart by space, no rules between them */
html.b-m1 #agThread .ag-card .ag-row,html.b-m1 #agThread .ag-card .ag-kv{border-top:0}
html.b-m1 #agThread .ag-card .ag-row{padding:12px 0 2px;font-size:var(--k-t-md);align-items:flex-start}
html.b-m1 #agThread .ag-card .ag-row>span{min-width:0;color:var(--k-text)}
html.b-m1 #agThread .ag-card .ag-row b,html.b-m1 #agThread .ag-card :is(.k-kv,.m1k-kv)>span:last-child{font-weight:500;color:var(--k-text);font-variant-numeric:tabular-nums;text-align:right}
html.b-m1 #agThread .ag-card :is(.k-kv,.m1k-kv){display:flex;padding:6px 0;font-size:var(--k-t-md);line-height:1.45}
html.b-m1 #agThread .ag-card :is(.k-kv,.m1k-kv)>span:first-child{color:var(--k-text-2);min-width:0}
html.b-m1 #agThread .ag-card :is(.k-kv,.m1k-kv).tot>span{color:var(--k-text)}
html.b-m1 #agThread .ag-card :is(.k-kv,.m1k-kv).tot>span:last-child{font-size:var(--k-t-base);font-weight:600}
html.b-m1 #agThread .ag-card small{color:var(--k-text-3);font-size:var(--k-t-xs);margin-top:1px}
html.b-m1 #agThread .ag-card .code.m1c-code{display:inline-flex;font-family:var(--k-mono);font-size:var(--k-t-cap);letter-spacing:.02em;padding:1px 7px;margin-right:4px;border-radius:999px;background:var(--ka-canvas);color:var(--k-text-2);vertical-align:1px;min-width:0;border:0}
html.b-m1 #agThread .ag-card .ag-acts{margin:6px 0 0;padding-bottom:10px}

/* the actions: k-btn k-sm (one black k-pri per message), quiet ones as k-lnk, "show the page" as the study's reference chip */
html.b-m1 #agThread .ag-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:0}
html.b-m1 #agThread .ag-btn:is(.k-btn,.m1k-btn){border:1px solid var(--k-line-strong);background:var(--ka-card);color:var(--k-text);border-radius:999px;padding:5px 11px;font-size:var(--k-t-sm);font-weight:500;line-height:1.2;transition:background .15s,border-color .15s,color .15s}
html.b-m1 #agThread .ag-btn:is(.k-btn,.m1k-btn):hover{background:var(--ka-canvas);border-color:var(--k-line-strong)}
html.b-m1 #agThread .ag-btn:is(.k-btn,.m1k-btn):is(.k-pri,.m1c-pri){background:var(--k-text);color:var(--ka-card);border-color:transparent}
html.b-m1 #agThread .ag-btn:is(.k-btn,.m1k-btn):is(.k-pri,.m1c-pri):hover{background:var(--k-text);opacity:.88}
html.b-m1 #agThread .ag-btn:is(.k-lnk,.m1k-lnk){border:0;background:none;color:var(--k-text-2);text-decoration:underline;text-underline-offset:3px;font-size:var(--k-t-xs);font-weight:400;padding:0;border-radius:0}
html.b-m1 #agThread .ag-btn:is(.k-lnk,.m1k-lnk):hover{color:var(--k-text);background:none}
html.b-m1 #agThread .ag-btn:is(.k-refc,.m1k-refc){display:inline-flex;align-items:center;gap:6px;border:0;background:var(--ka-pill);color:var(--k-text);border-radius:999px;padding:4px 10px;font-size:var(--k-t-xs);font-weight:500}
html.b-m1 #agThread .ag-btn:is(.k-refc,.m1k-refc):hover{background:var(--ka-soft)}   /* polish (c): quiet, not lime: the screen's one lime is the work sheet's */
html.b-m1 #agThread .ag-btn:disabled{opacity:.5;cursor:default}
html.b-m1 #agThread .ag-done.m1c-done{gap:6px;padding:3px 9px;font-size:var(--k-t-cap);color:var(--k-ok-ink);background:var(--k-ok-soft)}
html.b-m1 #agThread .ag-done.m1c-done svg{width:12px;height:12px}

/* suggestions under the last answer and the chips under the composer: the study's k-sugc shape, quiet (no lime: one lime accent
   per view, the chips must not compete with the answer's card and its one primary button); two at most under the composer */
html.b-m1 #agThread .ag-sug{gap:6px;margin-top:0}
html.b-m1 #agThread .ag-sug button:is(.k-sugc,.m1c-sugc),html.b-m1 #agChips button:is(.k-sugc,.m1c-sugc){border:0;background:var(--ka-pill);color:var(--k-text-2);border-radius:999px;padding:4px 10px;font-size:var(--k-t-xs);font-weight:500;line-height:1.45;text-align:left}
html.b-m1 #agThread .ag-sug button:is(.k-sugc,.m1c-sugc):hover,html.b-m1 #agChips button:is(.k-sugc,.m1c-sugc):hover{background:var(--ka-soft);color:var(--k-text)}
html.b-m1 #agChips{gap:6px;padding-top:6px;justify-content:center}
html.b-m1 #agChips button:is(.k-sugc,.m1c-sugc){flex:none;white-space:nowrap}
/* polish (HQ prod e61a5674 a): the chips are never cut at the column's edges. A centred row that overflowed lost its start (centre
   + overflow cuts both ends, and the left one cannot be scrolled to); now the row wraps (two at most on the desk, one on a phone)
   and a chip longer than the column wraps its own text, centred: no sideways scroll, no edge mask */
html.b-m1 #agChips{flex-wrap:wrap;overflow:visible;padding:6px 14px 2px;-webkit-mask-image:none;mask-image:none}
html.b-m1 #agChips button:is(.k-sugc,.m1c-sugc){flex:0 1 auto;max-width:100%;min-width:0;white-space:normal;overflow-wrap:break-word;text-align:center}
html.b-m1 #agChips button:is(.k-sugc,.m1c-sugc):nth-child(n+3){display:none}

/* Show more (the kit's coming details:is(.k-more,.m1k-more), local until it lands): the rest of a long answer and its further cards */
html.b-m1 #agThread :is(.k-more,.m1k-more){display:flex;flex-direction:column;gap:10px}
html.b-m1 #agThread :is(.k-more,.m1k-more)>summary{list-style:none;display:inline-flex;align-items:center;gap:4px;align-self:flex-start;cursor:pointer;color:var(--k-text-2);font-size:var(--k-t-xs);font-weight:500}
html.b-m1 #agThread :is(.k-more,.m1k-more)>summary::-webkit-details-marker{display:none}
html.b-m1 #agThread :is(.k-more,.m1k-more)[open]>summary{order:2}
html.b-m1 #agThread :is(.k-more,.m1k-more) .m1c-morein{display:flex;flex-direction:column;gap:10px}

/* the agent is typing: the study's quiet dots */
html.b-m1 #agThread .m.typing{margin-left:26px}
html.b-m1 #agThread .m.typing i{background:var(--k-text-3)}

/* phone: every tap ≥ 44 px (the look stays the study's, the hit area grows around it) */
@media (max-width:860px){
  html.b-m1 #agThread .m.ai:is(.k-amsg,.m1k-amsg)>*,html.b-m1 #agThread .m.ai:is(.k-amsg,.m1k-amsg)>:is(.k-ab,.m1k-ab){margin-left:0;padding-left:0}
  html.b-m1 #agThread .m.typing{margin-left:0}
  html.b-m1 #agThread :is(.k-steps,.m1k-steps) summary,html.b-m1 #agThread :is(.k-more,.m1k-more)>summary{min-height:44px;margin:-13px 0}
  html.b-m1 #agThread .ag-btn:is(.k-btn,.m1k-btn){min-height:44px;padding:8px 14px}
  html.b-m1 #agThread .ag-btn:is(.k-lnk,.m1k-lnk),html.b-m1 #agThread .ag-btn:is(.k-refc,.m1k-refc){min-height:44px;display:inline-flex;align-items:center}
  html.b-m1 #agThread .ag-sug button:is(.k-sugc,.m1c-sugc),html.b-m1 #agChips button:is(.k-sugc,.m1c-sugc){min-height:44px;padding:8px 14px;font-size:var(--k-t-sm)}
}
/* an answer's figures list as its result card (m1-chat.js listCards): label + quiet second line left, the value right */
html.b-m1 #agThread .m1c-list .ag-kv{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:9px 0;border-top:1px solid var(--ka-soft)}
html.b-m1 #agThread .m1c-list .ag-kv:first-child{border-top:0}
html.b-m1 #agThread .m1c-list .ag-kv>span:first-child{display:flex;flex-direction:column;gap:2px;min-width:0}
html.b-m1 #agThread .m1c-list .m1c-sub{color:var(--k-text-2);font-size:var(--k-t-xs)}
html.b-m1 #agThread .m1c-list .num{font-variant-numeric:tabular-nums;white-space:nowrap}

/* polish (d), declutter 5/7 (the home answer: two bills, each with Pay + What is it?, then Pay all): the card lifts by a faint
   edge and a shorter shadow in light, a hairline alone in dark, the per-row Pay is a soft pill without a border so the answer's one
   outlined action is Pay all; more air between the rows and their actions instead of lines */
html.b-m1 #agThread .ag-card.m1c-card{box-shadow:0 0 0 1px rgba(20,22,30,.05),0 10px 30px -26px rgba(20,22,30,.32);padding:10px 18px}
html.b-m1[data-theme="dark"] #agThread .ag-card.m1c-card{box-shadow:0 0 0 1px var(--ka-soft)}
html.b-m1 #agThread .ag-card .ag-btn:is(.k-btn,.m1k-btn).m1-quiet.m1-quiet,html.b-m1 #agThread .ag-card .ag-btn:is(.k-btn,.m1k-btn):not(:is(.k-pri,.m1c-pri)){border-color:transparent;background:var(--ka-pill)}
html.b-m1 #agThread .ag-card .ag-btn:is(.k-btn,.m1k-btn).m1-quiet.m1-quiet:hover,html.b-m1 #agThread .ag-card .ag-btn:is(.k-btn,.m1k-btn):not(:is(.k-pri,.m1c-pri)):hover{background:var(--ka-soft)}
html.b-m1 #agThread .ag-card .ag-acts{gap:12px;margin-top:8px;padding-bottom:12px}
html.b-m1 #agThread .ag-card .ag-row{padding-top:14px}
/* the fold's line says what a tap does: «Pokaži več» closed, «Pokaži manj» open (the kit's chevron turns with it) */
html.b-m1 #agThread :is(.k-more,.m1k-more)>summary>.m1c-le,html.b-m1 #agThread :is(.k-more,.m1k-more)[open]>summary>.m1c-mo{display:none}
html.b-m1 #agThread :is(.k-more,.m1k-more)[open]>summary>.m1c-le{display:inline}
