/* polish layer for templates in mx-b.js: owned by the mx-b builder agent only. Every class is prefixed mx-b- */

/* ---------- layout primitives ---------- */
.mx .mx-b-g { display: grid; gap: 12px; min-height: 0; min-width: 0; }
.mx .mx-b-g > * { min-width: 0; min-height: 0; }
.mx .mx-b-main, .mx .mx-b-fillg { flex: 1 1 auto; grid-template-rows: minmax(0, 1fr); }
.mx .mx-b-g.fill { flex: 1 1 auto; grid-template-rows: minmax(0, 1fr); }
.mx .mx-b-col { display: flex; flex-direction: column; gap: 12px; min-height: 0; min-width: 0; }
.mx .mx-b-col.fill > :last-child { flex: 1 1 auto; min-height: 0; }
.mx .mx-b-row { display: flex; gap: 12px; align-items: center; }
.mx .mx-b-c { overflow: hidden; display: flex; flex-direction: column; }
.mx .mx-b-c > header { flex-shrink: 0; }
.mx .mx-b-c.tight > header { margin-bottom: 6px; }
.mx .mx-b-c.flush > header { padding: 12px 14px 8px; margin: 0; }
.mx .mx-b-c.accent { background: linear-gradient(180deg, var(--acs), #fff); border-color: color-mix(in srgb, var(--ac) 25%, #fff); }
.mx .mx-b-t.tight th { padding: 7px 12px; }
.mx .mx-b-t.tight td { padding: 7px 12px; }
.mx .mx-card:not(.flush) .mx-b-t td:last-child, .mx .mx-card:not(.flush) .mx-b-t th:last-child { padding-right: 0; }
.mx .mx-b-t td b { font-variant-numeric: tabular-nums; }

/* ---------- atoms ---------- */
.mx .mx-b-stats { display: grid; gap: 12px; flex-shrink: 0; }
.mx .mx-b-stat { background: #fff; border: 1px solid var(--bd); border-radius: var(--r4); padding: 9px 12px 9px; box-shadow: var(--sh2); min-width: 0; }
.mx .mx-b-stat small { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-stat small .mx-i { width: 12.5px; height: 12.5px; color: var(--mu2); }
.mx .mx-b-stat > b { display: flex; align-items: center; gap: 6px; font-size: 19px; font-weight: 650; letter-spacing: -.02em; margin: 2px 0 1px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mx .mx-b-stat em { font-style: normal; font-size: 11px; font-weight: 550; color: var(--mu); display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-stat em.good { color: #067647; }
.mx .mx-b-stat em.bad { color: #b42318; }
.mx .mx-b-stat em.warn { color: var(--am); }
.mx .mx-b-li { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid var(--bd2); min-width: 0; }
.mx .mx-b-c > header + .mx-b-li, .mx .mx-b-li:first-child, .mx .mx-b-rl2 > small + .mx-b-li { border-top: 0; }
.mx .mx-b-li-m { flex: 1; min-width: 0; }
.mx .mx-b-li-m b { display: block; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-li-m small { font-size: 11px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-li-r { flex-shrink: 0; display: flex; align-items: center; gap: 6px; }
.mx .mx-b-li-r small { color: var(--mu); font-size: 11px; }
.mx .mx-b-li-r .mx-dot { margin: 0; }
.mx .mx-b-pb { height: 6px; background: #eef0f3; border-radius: 999px; overflow: hidden; margin-top: 5px; }
.mx .mx-b-pb i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--acl), var(--ac)); }
.mx .mx-b-pb.amber i { background: linear-gradient(90deg, #fdd08a, #f79009); }
.mx .mx-b-pb.red i { background: linear-gradient(90deg, #fda29b, #f04438); }
.mx .mx-b-pb.blue i { background: linear-gradient(90deg, #a4c2ff, #2e6ff2); }
.mx .mx-b-pb.violet i { background: linear-gradient(90deg, #cdb8ff, #7c3aed); }
.mx .mx-b-pb.green i { background: linear-gradient(90deg, #86e0b7, #12a26f); }
.mx .mx-b-stars { display: inline-flex; gap: 1px; vertical-align: middle; }
.mx .mx-b-stars svg { width: 12px; height: 12px; fill: #e4e7ec; }
.mx .mx-b-stars svg.on { fill: #f5b301; }
.mx .mx-b-stars.sm svg { width: 10px; height: 10px; }
.mx .mx-b-chip { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 8px; border-radius: 6px; border: 1px solid var(--bd); background: #fff; font-size: 11.5px; font-weight: 550; color: var(--tx2); white-space: nowrap; }
.mx .mx-b-chip .mx-i { width: 12px; height: 12px; }
.mx .mx-b-chip.sel { border-color: color-mix(in srgb, var(--ac) 40%, #fff); background: var(--acs); color: var(--ac2); }
.mx .mx-b-chip.amber { border-color: #fcd9a8; background: #fffaf0; color: var(--am); }
.mx .mx-b-chip .mx-face { width: 16px; height: 16px; }
.mx .mx-b-ico { width: 26px; height: 26px; border-radius: 7px; display: inline-grid; place-items: center; background: #f2f4f7; color: var(--tx2); flex-shrink: 0; }
.mx .mx-b-ico .mx-i { width: 14px; height: 14px; }
.mx .mx-b-ico.green { background: var(--grs); color: #067647; }
.mx .mx-b-ico.red { background: var(--rds); color: #b42318; }
.mx .mx-b-ico.amber { background: var(--ams); color: var(--am); }
.mx .mx-b-ico.blue { background: var(--bls); color: #2f54d6; }
.mx .mx-b-ico.violet { background: var(--vis); color: #5925dc; }
.mx .mx-b-ft { width: 22px; height: 26px; border-radius: 3px 7px 3px 3px; display: inline-grid; place-items: end center; padding-bottom: 4px; font: 700 6.8px/1 Inter, sans-serif; letter-spacing: .02em; color: #fff; flex-shrink: 0; background: #667085; position: relative; box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .12); }
.mx .mx-b-ft::before { content: ""; position: absolute; top: 0; right: 0; width: 7px; height: 7px; background: linear-gradient(225deg, #fff 50%, rgba(0, 0, 0, .18) 50%); border-radius: 0 6px 0 2px; }
.mx .mx-b-ft.pdf { background: #e5484d; }
.mx .mx-b-ft.doc { background: #2f6fed; }
.mx .mx-b-ft.xls, .mx .mx-b-ft.csv { background: #1f9d55; }
.mx .mx-b-ft.img { background: #8b5cf6; }
.mx .mx-b-ft.ppt { background: #ea580c; }
.mx .mx-b-gauge { position: relative; width: 150px; height: 92px; margin: 0 auto; }
.mx .mx-b-gauge svg { width: 150px; height: 86px; overflow: visible; }
.mx .mx-b-gauge path { fill: none; stroke-width: 10; stroke-linecap: round; }
.mx .mx-b-gauge .bg { stroke: #eef0f3; }
.mx .mx-b-gauge .fg { stroke: var(--ac); }
.mx .mx-b-gauge.amber .fg { stroke: #f79009; }
.mx .mx-b-gauge b { position: absolute; left: 0; right: 0; bottom: 4px; text-align: center; font-size: 32px; font-weight: 700; letter-spacing: -.03em; line-height: 1; }
.mx .mx-b-gauge b small { display: inline; font-size: 13px; color: var(--mu); font-weight: 500; letter-spacing: 0; }
.mx .mx-b-ring { position: relative; display: inline-grid; place-items: center; flex-shrink: 0; }
.mx .mx-b-ring svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.mx .mx-b-ring circle { fill: none; stroke-width: 5; }
.mx .mx-b-ring .bg { stroke: #eef0f3; }
.mx .mx-b-ring .fg { stroke: var(--ac); stroke-linecap: round; }
.mx .mx-b-ring.red .fg { stroke: #f04438; }
.mx .mx-b-ring.amber .fg { stroke: #f79009; }
.mx .mx-b-ring b { position: relative; font-size: 14px; font-weight: 700; letter-spacing: -.02em; }
.mx .mx-b-line { display: block; overflow: visible; }
.mx .mx-b-line .gl { stroke: #eef0f3; stroke-width: 1; }
.mx .mx-b-line .ln { fill: none; stroke: var(--lc); stroke-width: 2; stroke-linecap: round; }
.mx .mx-b-line .ln.dash { stroke-dasharray: 4 4; opacity: .8; }
.mx .mx-b-line .dt { fill: #fff; stroke: var(--lc); stroke-width: 2; }
.mx .mx-b-line .band { fill: var(--lc); opacity: .1; }
.mx .mx-b-vb { display: flex; align-items: stretch; gap: 6px; padding-top: 16px; }
.mx .mx-b-vb > div { flex: 1; display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.mx .mx-b-vb span { flex: 1; display: flex; align-items: flex-end; }
.mx .mx-b-vb i { position: relative; display: block; width: 100%; border-radius: 4px 4px 2px 2px; background: color-mix(in srgb, var(--ac) 28%, #fff); }
.mx .mx-b-vb .hi i { background: linear-gradient(180deg, var(--acl), var(--ac)); }
.mx .mx-b-vb em { position: absolute; top: -15px; left: 50%; transform: translateX(-50%); font: 600 10px/1 Inter, sans-serif; color: var(--tx2); white-space: nowrap; font-style: normal; }
.mx .mx-b-vb small { font-size: 10px; color: var(--mu); text-align: center; white-space: nowrap; }
.mx .mx-b-hb > div { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) 46px; gap: 10px; align-items: center; padding: 5px 0; color: var(--tx2); }
.mx .mx-b-hb span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-hb > div > div { height: 8px; background: #f0f1f4; border-radius: 999px; overflow: hidden; }
.mx .mx-b-hb i { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--acl), var(--ac)); }
.mx .mx-b-hb b { text-align: right; font-variant-numeric: tabular-nums; color: var(--tx); }
.mx .mx-b-wave { display: flex; align-items: center; gap: 2px; height: 100%; }
.mx .mx-b-wave i { flex: 1; border-radius: 2px; background: #d0d5dd; min-height: 3px; }
.mx .mx-b-wave i.on { background: var(--ac); }
.mx .mx-b-note { position: relative; display: block; font-size: 11.5px; line-height: 1.45; color: var(--tx2); background: #f8f9fb; border-radius: 8px; padding: 7px 9px 7px 29px; margin: 8px 0 0; }
.mx .mx-b-note > .mx-i { position: absolute; left: 9px; top: 8px; width: 13px; height: 13px; color: var(--ac); }
.mx .mx-b-rk { width: 20px; height: 20px; border-radius: 50%; display: inline-grid; place-items: center; background: #f2f4f7; font: 700 10.5px/1 Inter, sans-serif; font-style: normal; color: var(--tx2); flex-shrink: 0; }
.mx .mx-b-li:first-child .mx-b-rk, .mx .mx-b-c > header + .mx-b-li .mx-b-rk { background: #fdecc8; color: #92400e; }
.mx .mx-b-date { flex: none; min-width: 42px; text-align: center; font-size: 10.5px; font-weight: 650; color: var(--tx2); background: #f2f4f7; border-radius: 6px; padding: 4px 6px; }
.mx .mx-agent-av.lg { width: 34px; height: 34px; }
.mx .mx-agent-av.sm { width: 24px; height: 24px; }
.mx .mx-agent-av.xs { width: 20px; height: 20px; }
.mx .mx-agent-av.xs i, .mx .mx-agent-av.sm i { display: none; }
.mx .mx-b-sb { display: inline-flex; gap: 4px; align-items: center; }
.mx .mx-b-sb svg { height: 9px; width: auto; fill: currentColor; }
.mx .mx-b-sb svg:last-child { height: 10px; }
.mx .mx-b-src { display: inline-flex; align-items: center; gap: 7px; padding: 5px 9px 5px 6px; border: 1px solid var(--bd); border-radius: 8px; background: #fafbfc; font-size: 11.5px; min-width: 0; }
.mx .mx-b-src sup { font-size: 9.5px; font-weight: 700; color: var(--ac); background: var(--acs); border-radius: 4px; padding: 1px 4px; top: 0; }
.mx .mx-b-src .mx-b-ft { transform: scale(.82); margin: -2px -2px; }
.mx .mx-b-src small { font-size: 10.5px; color: var(--mu); display: inline; }
.mx .mx-b-srcs { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.mx .mx-b-srcs.sm { margin-top: 8px; }
.mx .mx-b-mut { color: var(--mu); }

/* ---------- phones, bubbles, widgets ---------- */
.mx .mx-b-iph { width: 100%; max-width: 292px; height: 100%; max-height: 548px; justify-self: center; align-self: center; background: linear-gradient(145deg, #2b2f36, #0c0d10); border-radius: 42px; padding: 7px; box-shadow: 0 30px 50px -24px rgba(16, 24, 40, .45), inset 0 0 0 1.5px #4a4f58; }
.mx .mx-b-iph-in { position: relative; height: 100%; background: #fff; border-radius: 35px; overflow: hidden; display: flex; flex-direction: column; }
.mx .mx-b-iph-st { display: flex; align-items: center; justify-content: space-between; padding: 10px 22px 4px 26px; font-size: 12px; color: #111; flex-shrink: 0; }
.mx .mx-b-iph-st .isl { width: 80px; height: 22px; background: #000; border-radius: 999px; }
.mx .mx-b-iph-h { position: relative; display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 4px 12px 8px; border-bottom: 1px solid #eceef1; background: #f9f9fb; flex-shrink: 0; }
.mx .mx-b-iph-h b { font-size: 11.5px; font-weight: 600; }
.mx .mx-b-iph-h small { font-size: 9.5px; color: var(--mu); }
.mx .mx-b-iph-h .bk, .mx .mx-b-igh .bk { position: absolute; left: 12px; top: 14px; color: #0a84ff; transform: scaleX(-1); }
.mx .mx-b-igh .bk { position: static; color: #111; transform: scaleX(-1); display: inline-flex; }
.mx .mx-b-cav { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(180deg, #a9afb9, #7d8490); color: #fff; font-weight: 600; font-size: 15px; }
.mx .mx-b-th { flex: 1 1 auto; min-height: 0; overflow: hidden; display: flex; flex-direction: column; gap: 5px; padding: 10px 11px; }
.mx .mx-b-m { display: flex; flex-direction: column; max-width: 82%; }
.mx .mx-b-m > div { padding: 7px 11px; border-radius: 17px; font-size: 11.8px; line-height: 1.4; }
.mx .mx-b-m small { font-size: 9.5px; color: var(--mu); padding: 2px 8px 0; }
.mx .mx-b-m.in { align-self: flex-start; }
.mx .mx-b-m.out { align-self: flex-end; align-items: flex-end; }
.mx .mx-b-m.in > div { background: #e9e9eb; color: #111; border-bottom-left-radius: 5px; }
.mx .mx-b-m.out > div { background: #0a84ff; color: #fff; border-bottom-right-radius: 5px; }
.mx .sms .mx-b-m.out > div { background: #34c759; }
.mx .mx-b-sysm { align-self: center; font-size: 9.5px; color: var(--mu); padding: 2px 0; }
.mx .mx-b-iph-in2 { display: flex; align-items: center; gap: 8px; margin: 6px 10px 20px; padding: 5px 5px 5px 12px; border: 1px solid #d9dce1; border-radius: 999px; font-size: 11px; color: #a0a6b0; flex-shrink: 0; }
.mx .mx-b-iph-in2 span { flex: 1; }
.mx .mx-b-iph-in2 i { width: 22px; height: 22px; border-radius: 50%; background: #34c759; color: #fff; display: grid; place-items: center; }
.mx .mx-b-iph-in2 i .mx-i { width: 12px; height: 12px; stroke-width: 2.4; }
.mx .mx-b-home { position: absolute; bottom: 7px; left: 50%; transform: translateX(-50%); width: 104px; height: 4px; border-radius: 999px; background: #111; }
.mx .mx-b-jobc { align-self: flex-end; display: flex; gap: 8px; align-items: center; max-width: 88%; background: #fff; border: 1px solid #d9f0e3; border-radius: 14px; padding: 7px 10px; box-shadow: 0 2px 6px -2px rgba(16, 24, 40, .12); }
.mx .mx-b-jobc b { font-size: 11.5px; display: block; }
.mx .mx-b-jobc small { font-size: 10px; color: var(--mu); }
/* Instagram */
.mx .mx-b-igh { display: flex; align-items: center; gap: 8px; padding: 4px 12px 8px; border-bottom: 1px solid #eee; flex-shrink: 0; }
.mx .mx-b-igh > div { flex: 1; }
.mx .mx-b-igh b { font-size: 12px; display: block; }
.mx .mx-b-igh small { font-size: 9.5px; color: var(--mu); }
.mx .mx-b-igav { padding: 2px; border-radius: 50%; background: linear-gradient(45deg, #feda75, #fa7e1e, #d62976, #962fbf, #4f5bd5); display: inline-flex; }
.mx .mx-b-igav .mx-face { width: 26px; height: 26px; box-shadow: 0 0 0 2px #fff; }
.mx .ig .mx-b-m.in > div { background: #efefef; border-radius: 18px; }
.mx .ig .mx-b-m.out > div { background: linear-gradient(135deg, #5b51f5, #a033e3); border-radius: 18px; }
.mx .mx-b-car { display: flex; gap: 6px; align-self: flex-end; width: 94%; }
.mx .mx-b-car > div { flex: 1; min-width: 0; border: 1px solid #e6e6e6; border-radius: 12px; overflow: hidden; background: #fff; position: relative; display: flex; flex-direction: column; }
.mx .mx-b-car-i { height: 64px; min-height: 0; border-radius: 0; }
.mx .mx-b-car em { position: absolute; top: 5px; left: 5px; font-style: normal; font-size: 8.5px; font-weight: 700; background: #fff; color: #111; padding: 1px 5px; border-radius: 4px; z-index: 3; }
.mx .mx-b-car b { font-size: 10.5px; padding: 5px 7px 0; }
.mx .mx-b-car small { font-size: 9.5px; color: var(--tx); padding: 0 7px 5px; font-weight: 600; }
.mx .mx-b-car small s { color: var(--mu2); font-weight: 400; }
.mx .mx-b-car span { font-size: 10px; font-weight: 600; color: #0a84ff; text-align: center; border-top: 1px solid #eee; padding: 4px 0; }
.mx .mx-b-igf { display: flex; align-items: center; gap: 8px; margin: 6px 10px 20px; padding: 6px 10px; border-radius: 999px; background: #f1f1f2; font-size: 11px; color: #8e8e93; flex-shrink: 0; }
.mx .mx-b-igf span { flex: 1; }
.mx .mx-b-igf .mx-i:first-child { width: 20px; height: 20px; padding: 3px; border-radius: 50%; background: #5b51f5; color: #fff; }
/* web chat widget */
.mx .mx-b-prev { display: flex; flex-direction: column; min-height: 0; }
.mx .mx-b-prev-l { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; color: var(--mu); margin-bottom: 7px; }
.mx .mx-b-prev-l .mx-dot { margin: 0; }
.mx .mx-b-wid { --wc: #0e9384; display: flex; flex-direction: column; flex: 1; min-height: 0; background: #fff; border-radius: 16px; overflow: hidden; box-shadow: 0 24px 48px -22px rgba(16, 24, 40, .38), 0 0 0 1px rgba(16, 24, 40, .07); }
.mx .mx-b-wid-h { display: flex; gap: 10px; align-items: center; padding: 12px 14px; background: linear-gradient(135deg, var(--wc), color-mix(in srgb, var(--wc) 70%, #000)); color: #fff; flex-shrink: 0; }
.mx .mx-b-wid-h > div { flex: 1; }
.mx .mx-b-wid-h b { font-size: 13px; display: block; }
.mx .mx-b-wid-h small { font-size: 10.5px; color: rgba(255, 255, 255, .82); }
.mx .mx-b-wid-h > .mx-i { opacity: .8; }
.mx .mx-b-wid .mx-b-th { background: #f8f9fb; padding: 12px; gap: 6px; }
.mx .mx-b-wid .mx-b-m.in > div { background: #fff; box-shadow: 0 0 0 1px #eaecf0; }
.mx .mx-b-wid .mx-b-m.out > div { background: var(--wc); }
.mx .mx-b-wid .mx-b-m small { color: #067647; font-weight: 600; }
.mx .mx-b-qr { display: flex; gap: 6px; align-self: flex-start; }
.mx .mx-b-qr span { border: 1px solid var(--wc, var(--ac)); color: var(--wc, var(--ac)); background: #fff; padding: 3px 10px; border-radius: 999px; font-size: 11px; font-weight: 600; }
.mx .mx-b-wid-f { display: flex; justify-content: space-between; align-items: center; padding: 11px 14px; border-top: 1px solid var(--bd); color: var(--mu2); font-size: 12px; flex-shrink: 0; }
.mx .mx-b-wid-f .mx-i { color: var(--wc); }
.mx .mx-b-idn { display: flex; gap: 6px; margin-bottom: 10px; }
.mx .mx-b-idn span { padding: 3px; border-radius: 50%; border: 2px solid transparent; display: inline-flex; }
.mx .mx-b-idn span.on { border-color: var(--ac); }
.mx .mx-b-fl { display: block; margin-bottom: 10px; }
.mx .mx-b-fl small, .mx .mx-b-sw small { font-size: 10.5px; color: var(--mu); font-weight: 550; margin-bottom: 4px; }
.mx .mx-b-fl div { border: 1px solid var(--bd); border-radius: 8px; padding: 7px 10px; font-weight: 550; box-shadow: var(--sh1); }
.mx .mx-b-sw { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mx .mx-b-sw small { width: 100%; }
.mx .mx-b-sw i { width: 20px; height: 20px; border-radius: 50%; }
.mx .mx-b-sw i.on { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #0e9384; }
.mx .mx-b-sl { margin-bottom: 12px; }
.mx .mx-b-sl > div { display: flex; justify-content: space-between; margin-bottom: 6px; }
.mx .mx-b-sl > div small { font-size: 11px; color: var(--tx2); font-weight: 550; }
.mx .mx-b-sl > span { position: relative; display: block; height: 6px; border-radius: 999px; background: #eef0f3; }
.mx .mx-b-sl > span i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 999px; background: linear-gradient(90deg, var(--acl), var(--ac)); }
.mx .mx-b-sl > span b { position: absolute; top: 50%; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 2px solid var(--ac); transform: translate(-50%, -50%); box-shadow: var(--sh2); }
.mx .mx-b-rules > div { display: flex; align-items: center; gap: 9px; padding: 6px 0; font-size: 12px; color: var(--tx2); border-top: 1px solid var(--bd2); }
.mx .mx-b-rules > div:first-child { border-top: 0; }

/* ---------- 3 company brain / 50 research ---------- */
.mx .mx-b-ask { display: flex; align-items: center; gap: 12px; height: 52px; padding: 0 14px 0 16px; background: #fff; border: 1.5px solid color-mix(in srgb, var(--ac) 45%, #fff); border-radius: 14px; box-shadow: 0 0 0 4px var(--acs), var(--sh2); font-size: 14.5px; font-weight: 550; flex-shrink: 0; }
.mx .mx-b-ask > .mx-i { width: 18px; height: 18px; color: var(--ac); }
.mx .mx-b-ask > span:not(.mx-b-chip) { flex: 1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-ans { flex-shrink: 0; }
.mx .mx-b-ans > header { justify-content: flex-start; gap: 10px; }
.mx .mx-b-ans > header > div { flex: 1; }
.mx .mx-b-ans > header b { font-size: 13px; display: block; }
.mx .mx-b-ans > header small { font-size: 11px; color: var(--mu); }
.mx .mx-b-ans p, .mx .mx-b-aians p { font-size: 13.2px; line-height: 1.62; color: var(--tx); margin: 0; }
.mx .mx-b-ans sup, .mx .mx-b-aians sup, .mx .mx-b-cites sup { font-size: 9px; font-weight: 700; color: var(--ac); background: var(--acs); border-radius: 4px; padding: 1px 4px; margin-left: 2px; vertical-align: super; line-height: 1; }
.mx .mx-b-ans footer { display: flex; align-items: center; gap: 16px; border-top: 1px solid var(--bd2); padding-top: 10px; margin-top: 12px; font-size: 11.5px; color: var(--mu); }
.mx .mx-b-ans footer span { display: inline-flex; gap: 5px; align-items: center; }
.mx .mx-b-ans footer .mx-i { width: 13px; height: 13px; }
.mx .mx-b-ans footer em { margin-left: auto; font-style: normal; font-size: 11px; color: var(--mu2); }
.mx .mx-b-rank > div { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; gap: 9px; align-items: center; padding: 5.5px 0; border-top: 1px solid var(--bd2); }
.mx .mx-b-rank > div:first-child { border-top: 0; }
.mx .mx-b-rank em { width: 20px; height: 20px; border-radius: 6px; background: #f2f4f7; display: grid; place-items: center; font: 650 10.5px/1 Inter, sans-serif; font-style: normal; color: var(--tx2); }
.mx .mx-b-rank span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--tx2); }
.mx .mx-b-rank b { font-size: 11.5px; color: var(--mu); font-weight: 600; font-variant-numeric: tabular-nums; }
.mx .mx-b-acc { display: flex; flex-direction: column; gap: 6px; }
.mx .mx-b-acc small { font-size: 11px; color: var(--mu); }

/* ---------- 43 slack ---------- */
.mx .mx-b-slack { display: flex; flex-direction: column; }
.mx .mx-b-slack > header { display: flex; align-items: center; justify-content: space-between; padding: 11px 16px; border-bottom: 1px solid var(--bd); margin: 0; }
.mx .mx-b-slack > header > div { display: flex; align-items: center; gap: 6px; min-width: 0; }
.mx .mx-b-slack > header b { font-size: 14px; }
.mx .mx-b-slack > header small { font-size: 11.5px; color: var(--mu); margin-left: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-sl-b { flex: 1; min-height: 0; overflow: hidden; padding: 4px 16px; }
.mx .mx-b-sl-day { display: flex; align-items: center; gap: 10px; margin: 4px 0 2px; font-size: 10.5px; font-weight: 600; color: var(--mu); }
.mx .mx-b-sl-day::before, .mx .mx-b-sl-day::after { content: ""; flex: 1; height: 1px; background: var(--bd); }
.mx .mx-b-sl-day span { border: 1px solid var(--bd); border-radius: 999px; padding: 2px 10px; }
.mx .mx-b-sl-m { display: flex; gap: 10px; padding: 6px 0; }
.mx .mx-b-sl-m > .mx-av { border-radius: 8px; }
.mx .mx-b-sl-m > .mx-av, .mx .mx-b-sl-m > .mx-agent-av { width: 34px; height: 34px; flex-shrink: 0; }
.mx .mx-b-sl-m > div { flex: 1; min-width: 0; }
.mx .mx-b-sl-m p { margin: 0 0 2px; font-size: 12.5px; line-height: 1.5; color: var(--tx); }
.mx .mx-b-sl-m p:first-child { display: flex; align-items: center; gap: 6px; }
.mx .mx-b-sl-m p time { font-size: 10.5px; color: var(--mu2); }
.mx .mx-b-appb { font-size: 8.5px; font-weight: 700; color: var(--mu); background: #eef0f3; border-radius: 3px; padding: 1px 4px; }
.mx .mx-b-sl-m ol { margin: 2px 0 0; padding-left: 18px; font-size: 12.2px; line-height: 1.5; color: var(--tx); }
.mx .mx-b-sl-m ol li { margin: 1px 0; }
.mx .mx-b-react { display: flex; gap: 6px; margin-top: 6px; }
.mx .mx-b-react span { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; padding: 2px 8px; border-radius: 999px; background: #eef4ff; color: #2f54d6; box-shadow: inset 0 0 0 1px #d4e0ff; }
.mx .mx-b-react .mx-i { width: 12px; height: 12px; }
.mx .mx-b-sl-card { display: flex; align-items: center; gap: 10px; margin-top: 6px; padding: 8px 10px; border: 1px solid var(--bd); border-left: 3px solid #2e6ff2; border-radius: 8px; max-width: 420px; }
.mx .mx-b-sl-card > div { flex: 1; }
.mx .mx-b-sl-card b { font-size: 12px; display: block; }
.mx .mx-b-sl-card small { font-size: 11px; color: var(--mu); }
.mx .mx-b-sl-in { display: flex; align-items: center; gap: 10px; margin: 6px 16px 12px; padding: 9px 12px; border: 1px solid var(--bd3); border-radius: 10px; color: var(--mu2); flex-shrink: 0; }
.mx .mx-b-sl-in span { flex: 1; }

/* ---------- 41 website + widget ---------- */
.mx .mx-b-site { position: relative; border-radius: 12px; overflow: hidden; border: 1px solid var(--bd); background: #fff; box-shadow: var(--sh2); }
.mx .mx-b-site-bar { display: flex; align-items: center; gap: 6px; padding: 7px 12px; background: #f2f3f5; border-bottom: 1px solid var(--bd); }
.mx .mx-b-site-bar > i { width: 9px; height: 9px; border-radius: 50%; background: #d0d5dd; }
.mx .mx-b-site-bar span { margin-left: 10px; display: inline-flex; gap: 5px; align-items: center; font-size: 11px; color: var(--mu); background: #fff; border-radius: 6px; padding: 3px 12px; }
.mx .mx-b-site-bar .mx-i { width: 11px; height: 11px; }
.mx .mx-b-site-pg { filter: saturate(.9); opacity: .92; }
.mx .mx-b-site-pg nav { display: flex; align-items: center; gap: 18px; padding: 12px 22px; font-size: 12px; color: var(--tx2); border-bottom: 1px solid var(--bd2); }
.mx .mx-b-site-pg nav b { display: flex; align-items: center; gap: 8px; font-size: 14px; margin-right: auto; color: #0b3b66; }
.mx .mx-b-site-pg nav em { font-style: normal; font-weight: 600; background: #0b6bcb; color: #fff; padding: 6px 12px; border-radius: 999px; }
.mx .mx-b-site-hero { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 22px 22px 16px; align-items: center; background: linear-gradient(180deg, #f2f8ff, #fff); }
.mx .mx-b-site-hero small { font-size: 10px; letter-spacing: .1em; font-weight: 700; color: #0b6bcb; }
.mx .mx-b-site-hero h3 { font-size: 26px; line-height: 1.12; letter-spacing: -.025em; margin: 6px 0 8px; color: #0b2540; font-weight: 700; }
.mx .mx-b-site-hero p { font-size: 12.5px; color: var(--tx2); margin: 0 0 12px; line-height: 1.5; }
.mx .mx-b-site-hero > div > div { display: flex; gap: 12px; align-items: center; }
.mx .mx-b-site-hero em { font-style: normal; background: #0b6bcb; color: #fff; font-weight: 600; font-size: 12px; padding: 8px 14px; border-radius: 999px; }
.mx .mx-b-site-hero > div > div span { font-weight: 600; color: #0b2540; font-size: 12px; }
.mx .mx-b-site-hero p.rv { margin: 12px 0 0; display: flex; align-items: center; gap: 6px; font-size: 11.5px; }
.mx .mx-b-site-img { height: 210px; border-radius: 14px; }
.mx .mx-b-site-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 4px 22px 20px; }
.mx .mx-b-site-row span { border: 1px solid var(--bd); border-radius: 10px; padding: 12px; font-size: 12px; font-weight: 600; color: #0b2540; background: #fff; }
.mx .mx-b-wid.float { position: absolute; right: 16px; bottom: 66px; width: 300px; height: 392px; flex: none; z-index: 5; }
.mx .mx-b-launch { position: absolute; right: 16px; bottom: 14px; width: 42px; height: 42px; border-radius: 50%; background: var(--wc); color: #fff; display: grid; place-items: center; box-shadow: 0 8px 18px -6px rgba(11, 107, 203, .6); z-index: 5; }
.mx .mx-b-launch .mx-i { width: 18px; height: 18px; }

/* ---------- 21 speed to lead ---------- */
.mx .mx-b-lead { display: flex; gap: 10px; align-items: center; padding: 9px 14px; border-top: 1px solid var(--bd2); position: relative; }
.mx .mx-b-lead.sel { background: var(--acs); box-shadow: inset 3px 0 0 var(--ac); }
.mx .mx-b-lead > div:nth-child(2) { flex: 1; min-width: 0; }
.mx .mx-b-lead b { font-size: 12.5px; display: block; }
.mx .mx-b-lead small { font-size: 11px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-lead span { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; color: var(--tx2); margin-top: 2px; }
.mx .mx-b-lead .r { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.mx .mx-b-lead .r em { font-style: normal; font-size: 11px; font-weight: 650; color: #067647; display: inline-flex; gap: 3px; align-items: center; }
.mx .mx-b-lead .r em .mx-i { width: 12px; height: 12px; }
.mx .mx-b-convo { display: flex; flex-direction: column; }
.mx .mx-b-convo > header { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-bottom: 1px solid var(--bd); margin: 0; }
.mx .mx-b-convo > header > div { flex: 1; }
.mx .mx-b-convo > header b { font-size: 13.5px; display: block; }
.mx .mx-b-convo > header small { font-size: 11px; color: var(--mu); }
.mx .mx-b-race { display: grid; grid-template-columns: repeat(4, 1fr); padding: 12px 14px; border-bottom: 1px solid var(--bd); background: #fafbfc; flex-shrink: 0; }
.mx .mx-b-race > div { position: relative; padding: 16px 8px 0 0; }
.mx .mx-b-race > div::before { content: ""; position: absolute; top: 4px; left: 10px; right: 0; height: 2px; background: color-mix(in srgb, var(--ac) 35%, #fff); }
.mx .mx-b-race > div:last-child::before { display: none; }
.mx .mx-b-race i { position: absolute; top: 0; left: 0; width: 10px; height: 10px; border-radius: 50%; background: var(--ac); box-shadow: 0 0 0 3px var(--acs); }
.mx .mx-b-race b { font-size: 11.5px; display: block; }
.mx .mx-b-race small { font-size: 10.5px; color: var(--mu); line-height: 1.35; }
.mx .mx-b-th.web { padding: 12px 16px; gap: 7px; }
.mx .mx-b-th.web .mx-b-m > div { font-size: 12.3px; }
.mx .mx-b-th.biz .mx-b-m.in { align-self: flex-end; align-items: flex-end; }
.mx .mx-b-th.biz .mx-b-m.in > div { background: var(--ac); color: #fff; border-radius: 16px 16px 5px 16px; }
.mx .mx-b-th.biz .mx-b-m.out { align-self: flex-start; align-items: flex-start; }
.mx .mx-b-th.biz .mx-b-m.out > div { background: #f2f4f7; color: var(--tx); border-radius: 16px 16px 16px 5px; }

/* ---------- 22 missed calls ---------- */
.mx .mx-b-call { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto 168px; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--bd2); }
.mx .mx-b-c > header + .mx-b-call { border-top: 0; }
.mx .mx-b-call b { font-size: 12.5px; font-variant-numeric: tabular-nums; }
.mx .mx-b-call small { font-size: 11px; color: var(--mu); }
.mx .mx-b-miss { width: 30px; height: 30px; border-radius: 50%; background: var(--rds); color: #d92d20; display: grid; place-items: center; }
.mx .mx-b-miss .mx-i { width: 14px; height: 14px; }
.mx .mx-b-tb { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: #067647; font-weight: 550; background: var(--grs); border-radius: 999px; padding: 2px 8px 2px 5px; }
.mx .mx-b-tb .mx-i { width: 12px; height: 12px; }
.mx .mx-b-call .r { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.mx .mx-b-call .r b { min-width: 48px; text-align: right; }

/* ---------- 32 ai visibility ---------- */
.mx .mx-b-vis { align-items: center; }
.mx .mx-b-gcap { display: flex; flex-direction: column; align-items: center; gap: 3px; margin: 2px 0 8px; }
.mx .mx-b-gcap small { font-size: 11px; color: var(--mu); }
.mx .mx-b-engr { display: grid; grid-template-columns: 24px 70px minmax(0, 1fr) 34px; gap: 9px; align-items: center; padding: 7px 0; border-top: 1px solid var(--bd2); }
.mx .mx-b-c > header + .mx-b-engr { border-top: 0; }
.mx .mx-b-engr .mx-b-pb { margin: 0; height: 8px; }
.mx .mx-b-engr em { font-style: normal; font-weight: 650; text-align: right; font-variant-numeric: tabular-nums; }
.mx .mx-b-eng { width: 24px; height: 24px; border-radius: 7px; background: var(--ec); display: inline-grid; place-items: center; flex-shrink: 0; }
.mx .mx-b-eng svg { width: 14px; height: 14px; fill: none; stroke: #fff; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.mx .mx-b-pr { display: inline-block; max-width: 210px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; color: var(--tx); font-weight: 500; }
.mx .mx-b-pos { font-size: 11px; font-weight: 650; background: #f2f4f7; color: var(--tx2); border-radius: 6px; padding: 2px 7px; }
.mx .mx-b-pos.top { background: var(--grs); color: #067647; }
.mx .mx-b-pos.no { background: none; color: var(--mu2); font-weight: 450; padding: 0; }
.mx .mx-b-aians > header { display: flex; align-items: center; gap: 8px; justify-content: flex-start; }
.mx .mx-b-aians > header b { font-size: 12.5px; }
.mx .mx-b-aians > header small { font-size: 11px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-style: italic; }
.mx .mx-b-aians p { font-size: 12.5px; }
.mx .mx-b-aians mark { background: #fff1b8; color: var(--tx); font-weight: 650; border-radius: 3px; padding: 0 3px; }
.mx .mx-b-cites { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.mx .mx-b-cites span { font-size: 10.5px; color: var(--tx2); border: 1px solid var(--bd); border-radius: 999px; padding: 2px 9px 2px 4px; }
.mx .mx-b-fix { display: flex; gap: 8px; align-items: flex-start; background: var(--acs); border-radius: 8px; padding: 8px 10px; font-size: 11.8px; line-height: 1.45; margin-top: auto; }
.mx .mx-b-fix .mx-i { width: 14px; height: 14px; color: var(--ac); flex-shrink: 0; margin-top: 1px; }

/* ---------- 45 lead lanes ---------- */
.mx .mx-b-lane { background: #f3f4f6; border: 1px solid var(--bd2); border-radius: 12px; padding: 10px; display: flex; flex-direction: column; gap: 7px; min-height: 0; overflow: hidden; }
.mx .mx-b-lane > header { display: flex; align-items: center; gap: 7px; padding: 0 2px 2px; }
.mx .mx-b-lane > header i { width: 8px; height: 8px; border-radius: 50%; }
.mx .mx-b-lane > header b { font-size: 12.5px; }
.mx .mx-b-lane > header em { margin-left: auto; font-style: normal; font-size: 11px; color: var(--mu); background: #fff; border-radius: 999px; padding: 0 8px; box-shadow: inset 0 0 0 1px var(--bd); }
.mx .mx-b-lc { background: #fff; border: 1px solid var(--bd); border-radius: 10px; padding: 8px 10px; box-shadow: var(--sh1); flex-shrink: 0; }
.mx .mx-b-lc .t { display: flex; align-items: center; gap: 7px; }
.mx .mx-b-lc .t b { flex: 1; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-lc > small { font-size: 11px; color: var(--mu); margin: 1px 0 0 29px; }
.mx .mx-b-lc p { font-size: 11.5px; color: var(--tx2); line-height: 1.4; margin: 4px 0 6px; }
.mx .mx-b-lc .f { display: flex; justify-content: space-between; gap: 6px; font-size: 10.5px; color: var(--mu); border-top: 1px solid var(--bd2); padding-top: 6px; }
.mx .mx-b-lc .f span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.mx .mx-b-lc .f .mx-i { width: 11px; height: 11px; }

/* ---------- 46 helpdesk ---------- */
.mx .mx-b-q, .mx .mx-b-tk { display: flex; flex-direction: column; }
.mx .mx-b-q > header { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--bd); margin: 0; }
.mx .mx-b-q > header b { font-size: 13px; }
.mx .mx-b-q > header span { display: flex; gap: 2px; }
.mx .mx-b-q > header em { font-style: normal; font-size: 11px; padding: 2px 7px; border-radius: 6px; color: var(--mu); }
.mx .mx-b-q > header em.on { background: #f2f4f7; color: var(--tx); font-weight: 600; }
.mx .mx-b-qt { display: flex; gap: 9px; padding: 9px 12px; border-top: 1px solid var(--bd2); }
.mx .mx-b-qt:first-of-type { border-top: 0; }
.mx .mx-b-qt.sel { background: var(--acs); box-shadow: inset 3px 0 0 var(--ac); }
.mx .mx-b-qt > div { flex: 1; min-width: 0; }
.mx .mx-b-qt b { font-size: 12px; display: block; }
.mx .mx-b-qt small { font-size: 11px; color: var(--tx2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: 4px; }
.mx .mx-b-qt time { font-size: 10.5px; color: var(--mu2); }
.mx .mx-b-tk > header { display: flex; justify-content: space-between; align-items: center; padding: 11px 14px; border-bottom: 1px solid var(--bd); margin: 0; }
.mx .mx-b-tk > header b { font-size: 13.5px; display: block; }
.mx .mx-b-tk > header small { font-size: 11px; color: var(--mu); }
.mx .mx-b-csat { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--bd); background: #fafbfc; font-size: 12px; flex-shrink: 0; }
.mx .mx-b-csat small { margin-left: auto; color: var(--mu); font-size: 11px; }
.mx .mx-b-cust { display: flex; flex-direction: column; gap: 12px; }
.mx .mx-b-cust-h { display: flex; gap: 10px; align-items: center; }
.mx .mx-b-cust-h b { font-size: 13px; display: block; }
.mx .mx-b-cust-h small { font-size: 11px; color: var(--mu); }
.mx .mx-b-kv { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mx .mx-b-kv > div, .mx .mx-b-kv3 > div { background: #f8f9fb; border-radius: 8px; padding: 7px 9px; }
.mx .mx-b-kv small, .mx .mx-b-kv3 small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-kv b, .mx .mx-b-kv3 b { font-size: 14px; }
.mx .mx-b-ord { display: flex; gap: 10px; align-items: center; border: 1px solid var(--bd); border-radius: 10px; padding: 6px; }
.mx .mx-b-ord b { font-size: 12px; display: block; }
.mx .mx-b-ord small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-thumb { width: 46px; height: 46px; min-height: 0; flex: none; border-radius: 8px; }
.mx .mx-b-trk > small { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--tx2); font-weight: 600; margin-bottom: 8px; }
.mx .mx-b-trk > small .mx-i { width: 13px; height: 13px; color: #d92d20; }
.mx .mx-b-trk > div { position: relative; padding: 0 0 10px 18px; }
.mx .mx-b-trk > div::before { content: ""; position: absolute; left: 4px; top: 10px; bottom: 0; width: 1.5px; background: var(--bd); }
.mx .mx-b-trk > div:last-child::before { display: none; }
.mx .mx-b-trk > div i { position: absolute; left: 0; top: 3px; width: 10px; height: 10px; border-radius: 50%; background: #d0d5dd; }
.mx .mx-b-trk > div.now i { background: var(--ac); box-shadow: 0 0 0 3px var(--acs); }
.mx .mx-b-trk b { font-size: 11.5px; display: block; }
.mx .mx-b-trk > div small { font-size: 10.5px; color: var(--mu); }

/* ---------- 48 roleplay ---------- */
.mx .mx-b-rp { display: flex; flex-direction: column; }
.mx .mx-b-rp > header { display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-bottom: 1px solid var(--bd); margin: 0; }
.mx .mx-b-rp > header > div { flex: 1; min-width: 0; }
.mx .mx-b-rp > header b { font-size: 13.5px; display: block; }
.mx .mx-b-rp > header small { font-size: 11px; color: var(--mu); }
.mx .mx-b-rec { margin-left: auto; display: inline-flex; align-items: center; gap: 7px; font-size: 11.5px; font-weight: 650; color: #b42318; font-variant-numeric: tabular-nums; }
.mx .mx-b-rec .mx-dot { margin: 0; animation: mxbPulse 1.4s infinite; }
.mx .mx-b-rp-b { flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; gap: 9px; padding: 12px 16px; }
.mx .mx-b-rl { display: flex; gap: 9px; max-width: 78%; align-items: flex-end; }
.mx .mx-b-rl > .mx-av, .mx .mx-b-rl > .mx-agent-av { width: 28px; height: 28px; flex-shrink: 0; }
.mx .mx-b-rl small { font-size: 10.5px; color: var(--mu); margin: 0 0 3px 2px; }
.mx .mx-b-rl p { margin: 0; background: #f2f4f7; border-radius: 14px 14px 14px 4px; padding: 8px 11px; font-size: 12.3px; line-height: 1.45; }
.mx .mx-b-rl.me { align-self: flex-end; flex-direction: row-reverse; }
.mx .mx-b-rl.me small { text-align: right; }
.mx .mx-b-rl.me p { background: var(--ac); color: #fff; border-radius: 14px 14px 4px 14px; }
.mx .mx-b-coach { display: flex; align-items: center; gap: 10px; margin: 0 38px; background: #f6f3ff; border: 1px solid #e4dbff; border-radius: 10px; padding: 7px 10px; }
.mx .mx-b-coach > div { flex: 1; }
.mx .mx-b-coach b { font-size: 11px; color: #5925dc; text-transform: uppercase; letter-spacing: .05em; }
.mx .mx-b-coach p { margin: 1px 0 0; font-size: 12px; color: var(--tx); }
.mx .mx-b-coach.warn { background: #fffaf0; border-color: #fcd9a8; }
.mx .mx-b-coach.warn b { color: var(--am); }
.mx .mx-b-score { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; font-weight: 750; font-size: 13px; background: #fff; color: #067647; box-shadow: inset 0 0 0 1px var(--bd); }
.mx .mx-b-rp-f { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-top: 1px solid var(--bd); color: var(--mu); font-size: 12px; flex-shrink: 0; }
.mx .mx-b-rp-f .mic { width: 30px; height: 30px; border-radius: 50%; background: var(--ac); color: #fff; display: grid; place-items: center; box-shadow: 0 0 0 4px var(--acs); }
.mx .mx-b-rp-f .mic .mx-i { width: 15px; height: 15px; }
.mx .mx-b-rp-f > span:not(.mx-btn) { flex: 1; }
.mx .mx-b-sc { display: flex; gap: 12px; align-items: center; margin-bottom: 8px; }
.mx .mx-b-sc b { font-size: 14px; display: block; }
.mx .mx-b-sc small { font-size: 11px; color: #067647; }
.mx .mx-b-scr { display: grid; grid-template-columns: 112px minmax(0, 1fr) 70px; gap: 10px; align-items: center; padding: 4px 0; font-size: 12px; color: var(--tx2); }
.mx .mx-b-scr .mx-b-pb { margin: 0; height: 7px; }
.mx .mx-b-scr b { text-align: right; font-variant-numeric: tabular-nums; color: var(--tx); font-size: 11.5px; }

/* ---------- 49 social ---------- */
.mx .mx-b-avw { position: relative; display: inline-flex; flex-shrink: 0; }
.mx .mx-b-avw .mx-appi { position: absolute; right: -4px; bottom: -3px; width: 13px; height: 13px; box-shadow: 0 0 0 1.5px #fff; border-radius: 4px; }
.mx .mx-b-kw { display: flex; gap: 10px; align-items: center; }
.mx .mx-b-kw > span { font: 700 12px/1 "IBM Plex Mono", monospace; padding: 8px 10px; border-radius: 8px; color: #fff; background: linear-gradient(45deg, #fa7e1e, #d62976, #962fbf); }
.mx .mx-b-kw b { font-size: 12px; display: block; }
.mx .mx-b-kw small { font-size: 11px; color: var(--mu); }

/* ---------- voice ---------- */
.mx .mx-b-player { display: flex; align-items: center; gap: 10px; padding: 10px 14px; color: var(--mu); flex-shrink: 0; }
.mx .mx-b-player.dark { background: #0f1422; color: #aab3c5; margin: 12px 14px 4px; border-radius: 12px; }
.mx .mx-b-player .pl { width: 30px; height: 30px; border-radius: 50%; background: var(--ac); color: #fff; display: grid; place-items: center; flex-shrink: 0; }
.mx .mx-b-player .pl .mx-i { width: 12px; height: 12px; fill: currentColor; stroke: none; }
.mx .mx-b-player .tm { font: 500 11px/1 "IBM Plex Mono", monospace; min-width: 30px; }
.mx .mx-b-player > .mx-i { width: 15px; height: 15px; }
.mx .mx-b-pw { position: relative; flex: 1; height: 38px; }
.mx .mx-b-player.dark .mx-b-wave i { background: #34405a; }
.mx .mx-b-player.dark .mx-b-wave i.on { background: linear-gradient(180deg, #c4b5fd, var(--ac)); }
.mx .mx-b-pw .ph { position: absolute; top: -4px; bottom: -4px; width: 2px; background: var(--tx); border-radius: 2px; }
.mx .mx-b-player.dark .mx-b-pw .ph { background: #fff; }
.mx .mx-b-pw .ph::after { content: ""; position: absolute; top: -3px; left: 50%; width: 8px; height: 8px; border-radius: 50%; background: inherit; transform: translateX(-50%); }
.mx .mx-b-live { display: flex; flex-direction: column; }
.mx .mx-b-live > header { display: flex; align-items: center; gap: 10px; padding: 12px 14px 0; margin: 0; }
.mx .mx-b-live > header > div { flex: 1; }
.mx .mx-b-live > header b { font-size: 13.5px; display: block; }
.mx .mx-b-live > header small { font-size: 11px; color: var(--mu); }
.mx .mx-b-lvi { position: relative; width: 34px; height: 34px; border-radius: 50%; background: #fef0ee; color: #d92d20; display: grid; place-items: center; }
.mx .mx-b-lvi::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid #fda29b; animation: mxbRing 1.6s infinite; }
.mx .mx-b-tr { flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; gap: 4px; padding: 8px 14px 12px; }
.mx .mx-b-tr > div { display: grid; grid-template-columns: 22px minmax(0, 1fr); column-gap: 9px; padding: 5px 0; }
.mx .mx-b-tr > div > :first-child { grid-row: span 2; margin-top: 1px; }
.mx .mx-b-tr small { display: flex; gap: 8px; font-size: 10.5px; font-weight: 600; color: var(--mu); }
.mx .mx-b-tr small time { font-weight: 400; color: var(--mu2); font-family: "IBM Plex Mono", monospace; }
.mx .mx-b-tr p { margin: 2px 0 0; font-size: 12.3px; line-height: 1.45; color: var(--tx); }
.mx .mx-b-tr .ai p { background: #f5f3ff; border-radius: 4px 12px 12px 12px; padding: 6px 10px; }
.mx .mx-b-tr .now p { box-shadow: inset 2px 0 0 var(--ac); }
.mx .mx-b-cl { width: 20px; height: 20px; border-radius: 50%; background: #eef0f3; color: var(--tx2); display: grid; place-items: center; }
.mx .mx-b-cl .mx-i { width: 11px; height: 11px; }
.mx .mx-b-job > header { justify-content: space-between; margin-bottom: 4px; }
.mx .mx-b-job > header small { display: flex; gap: 5px; align-items: center; font-size: 10px; font-weight: 700; letter-spacing: .08em; color: var(--ac); }
.mx .mx-b-job > header .mx-i { width: 12px; height: 12px; }
.mx .mx-b-job > b { font-size: 15px; letter-spacing: -.01em; }
.mx .mx-b-job dl { display: grid; grid-template-columns: 70px 1fr; gap: 7px 10px; margin: 10px 0 0; font-size: 12px; }
.mx .mx-b-job dt { color: var(--mu); }
.mx .mx-b-job dd { margin: 0; display: flex; align-items: center; gap: 6px; font-weight: 550; }
.mx .mx-b-cr { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto 36px; gap: 10px; align-items: center; padding: 6.5px 0; border-top: 1px solid var(--bd2); }
.mx .mx-b-c > header + .mx-b-cr { border-top: 0; }
.mx .mx-b-cr > span:first-child { width: 24px; height: 24px; border-radius: 50%; background: #f2f4f7; display: grid; place-items: center; color: var(--mu); }
.mx .mx-b-cr > span:first-child .mx-i { width: 12px; height: 12px; }
.mx .mx-b-cr b { font-size: 12px; display: block; }
.mx .mx-b-cr small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-cr time { font: 500 10.5px/1 "IBM Plex Mono", monospace; color: var(--mu); text-align: right; }
.mx .mx-b-orbc { position: relative; overflow: hidden; border-radius: 14px; color: #fff; padding: 22px 22px 18px; display: flex; flex-direction: column; align-items: center; text-align: center; background: radial-gradient(120% 70% at 50% 18%, #2d1f6b 0%, #120d2e 55%, #0a0918 100%); box-shadow: var(--sh3); }
.mx .mx-b-orb { position: relative; width: 128px; height: 128px; display: grid; place-items: center; margin-top: 4px; }
.mx .mx-b-orb > i { position: absolute; inset: 0; border-radius: 50%; border: 1px solid rgba(196, 181, 253, .35); animation: mxbRing 2.4s infinite; }
.mx .mx-b-orb > i:nth-child(2) { inset: 12px; animation-delay: .5s; }
.mx .mx-b-orb > i:nth-child(3) { inset: 24px; animation-delay: 1s; }
.mx .mx-b-orb span { width: 74px; height: 74px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 35% 30%, #e9ddff, #a78bfa 35%, #6d28d9 70%, #3b0764); box-shadow: 0 0 40px 6px rgba(139, 92, 246, .55), inset 0 -6px 14px rgba(0, 0, 0, .3); }
.mx .mx-b-orb span .mx-i { width: 26px; height: 26px; color: #fff; }
.mx .mx-b-lis { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; color: #c4f5dc; background: rgba(255, 255, 255, .08); border-radius: 999px; padding: 3px 10px; margin-top: 8px; }
.mx .mx-b-lis .mx-dot { margin: 0; }
.mx .mx-b-orbc h3 { font-size: 20px; font-weight: 600; letter-spacing: -.02em; margin: 10px 0 12px; font-family: "Instrument Serif", Georgia, serif; font-style: italic; font-weight: 400; font-size: 26px; }
.mx .mx-b-otr { text-align: left; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .08); border-radius: 12px; padding: 4px 12px; font-size: 12px; line-height: 1.5; width: 100%; color: #e7e3f7; }
.mx .mx-b-otr p { margin: 8px 0; }
.mx .mx-b-otr p b { display: block; font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: #a78bfa; margin-bottom: 1px; }
.mx .mx-b-otr p.me b { color: #8fa0bd; }
.mx .mx-b-otr p.me { color: #b9c2d4; }
.mx .mx-b-otr mark { background: rgba(167, 139, 250, .28); color: #fff; border-radius: 3px; padding: 0 3px; font-weight: 600; }
.mx .mx-b-sug { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: auto; padding-top: 12px; }
.mx .mx-b-sug span { font-size: 11px; color: #d6d0f0; border: 1px solid rgba(255, 255, 255, .16); border-radius: 999px; padding: 3px 10px; }
.mx .mx-b-spike { position: relative; }
.mx .mx-b-spike .lab { position: absolute; transform: translateX(-100%); font-size: 10.5px; font-weight: 650; color: #b42318; background: #fef0ee; border-radius: 6px; padding: 2px 7px; }
.mx .mx-b-spike .base { position: absolute; left: 0; bottom: 4px; font-size: 10.5px; color: var(--mu); background: rgba(255, 255, 255, .85); padding: 0 4px; }
.mx .mx-b-days { display: flex; justify-content: space-between; font-size: 10px; color: var(--mu2); margin-top: 4px; }
.mx .mx-b-ba > div:first-child { display: flex; gap: 10px; align-items: center; }
.mx .mx-b-ba small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-ba b { font-size: 13px; display: block; }
.mx .mx-b-ba .ba { display: grid; grid-template-columns: 1fr auto 1fr 1fr; gap: 10px; align-items: center; margin-top: 10px; background: #f8f9fb; border-radius: 10px; padding: 10px 12px; }
.mx .mx-b-ba .ba b { font-size: 19px; letter-spacing: -.02em; }
.mx .mx-b-ba .ba > .mx-i { color: var(--mu2); }
.mx .mx-b-ba .bad { color: #d92d20; }
.mx .mx-b-ba .good { color: #067647; }
.mx .mx-b-script { display: flex; flex-direction: column; }
.mx .mx-b-script > header { display: flex; align-items: center; gap: 6px; padding: 11px 14px; border-bottom: 1px solid var(--bd); margin: 0; }
.mx .mx-b-script > header > div { flex: 1; min-width: 0; }
.mx .mx-b-script > header b { font-size: 13.5px; display: block; }
.mx .mx-b-script > header small { font-size: 11px; color: var(--mu); }
.mx .mx-b-words { flex: 1; min-height: 0; padding: 16px 20px; font-size: 18px; line-height: 1.65; color: #b4bcc9; letter-spacing: -.01em; font-family: "Instrument Serif", Georgia, serif; font-size: 23px; line-height: 1.45; }
.mx .mx-b-words .said { color: var(--tx); }
.mx .mx-b-words .cur { color: var(--ac2); background: var(--acs); border-radius: 4px; padding: 0 3px; box-shadow: inset 0 -2px 0 var(--ac); }
.mx .mx-b-script .mx-b-player { border-top: 1px solid var(--bd); }
.mx .mx-b-vc { display: flex; gap: 10px; align-items: center; padding: 9px 10px; border-radius: 10px; border: 1px solid transparent; margin-top: 4px; }
.mx .mx-b-vc.sel { border-color: color-mix(in srgb, var(--ac) 35%, #fff); background: var(--acs); }
.mx .mx-b-vc > div { flex: 1; min-width: 0; }
.mx .mx-b-vc b { font-size: 12.5px; display: block; }
.mx .mx-b-vc small { font-size: 11px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-vc .pl, .mx .mx-b-rends .pl { width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--bd); display: grid; place-items: center; color: var(--tx2); flex-shrink: 0; background: #fff; }
.mx .mx-b-vc .pl .mx-i, .mx .mx-b-rends .pl .mx-i { width: 10px; height: 10px; fill: currentColor; stroke: none; }
.mx .mx-b-rends { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.mx .mx-b-rends > div { display: flex; gap: 8px; align-items: center; border: 1px solid var(--bd); border-radius: 10px; padding: 7px 9px; min-width: 0; }
.mx .mx-b-rends > div > div { flex: 1; min-width: 0; }
.mx .mx-b-rends b { font-size: 12px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-rends small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-rends em { font: 500 10.5px/1 "IBM Plex Mono", monospace; color: var(--mu); }
.mx .mx-b-rends .mx-tag { display: none; }

/* ---------- email ---------- */
.mx .mx-b-seq { position: relative; display: flex; flex-direction: column; }
.mx .mx-b-seq::before { content: ""; position: absolute; left: 22px; top: 18px; bottom: 18px; width: 2px; background: #e4e7ec; }
.mx .mx-b-seq > * { position: relative; }
.mx .mx-b-trig { display: flex; gap: 10px; align-items: center; padding: 8px 10px; background: #fffaf0; border: 1px dashed #f5c26b; border-radius: 10px; }
.mx .mx-b-trig > .mx-i { width: 26px; height: 26px; padding: 6px; border-radius: 7px; background: #f79009; color: #fff; }
.mx .mx-b-trig small, .mx .mx-b-ss small { font-size: 10px; color: var(--mu); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.mx .mx-b-trig b { font-size: 12.5px; display: block; }
.mx .mx-b-ss { display: flex; gap: 10px; align-items: flex-start; padding: 9px 10px; background: #fff; border: 1px solid var(--bd); border-radius: 10px; margin-top: 8px; box-shadow: var(--sh1); }
.mx .mx-b-ss > div { flex: 1; min-width: 0; }
.mx .mx-b-ss b { font-size: 12.3px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-ss.sel { border-color: color-mix(in srgb, var(--ac) 50%, #fff); box-shadow: 0 0 0 3px var(--acs); }
.mx .mx-b-ssm { display: flex; gap: 10px; font-size: 10.5px; color: var(--mu); margin-top: 3px; }
.mx .mx-b-ssm b { display: inline; font-size: 10.5px; color: var(--tx); }
.mx .mx-b-sw8 { display: inline-flex; align-self: flex-start; align-items: center; gap: 5px; margin: 7px 0 0 8px; font-size: 10.5px; color: var(--mu); background: #f2f4f7; border-radius: 999px; padding: 2px 9px; box-shadow: 0 0 0 3px #fff; }
.mx .mx-b-sw8 .mx-i { width: 11px; height: 11px; }
.mx .mx-b-exit { display: flex; gap: 6px; align-items: center; margin-top: 8px; font-size: 11.5px; font-weight: 600; color: #067647; background: var(--grs); border-radius: 10px; padding: 7px 10px; }
.mx .mx-b-mail { display: flex; flex-direction: column; }
.mx .mx-b-mail-h { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px; align-items: center; padding: 9px 14px; border-bottom: 1px solid var(--bd); flex-shrink: 0; }
.mx .mx-b-mail-h small { font-size: 10px; color: var(--mu); }
.mx .mx-b-mail-h b { font-size: 12px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-mail-h .dev { display: flex; background: #f2f4f7; border-radius: 7px; padding: 2px; }
.mx .mx-b-mail-h .dev span { font-size: 10.5px; padding: 3px 8px; border-radius: 5px; color: var(--mu); }
.mx .mx-b-mail-h .dev span.on { background: #fff; color: var(--tx); font-weight: 600; box-shadow: var(--sh1); }
.mx .mx-b-mail-b { flex: 1; min-height: 0; overflow: hidden; background: #eceff3; padding: 14px 16px 0; display: flex; justify-content: center; }
.mx .mx-b-mail-p { width: 100%; max-width: 460px; background: #fff; border-radius: 8px 8px 0 0; box-shadow: 0 6px 20px -8px rgba(16, 24, 40, .2); overflow: hidden; align-self: flex-start; }
.mx .mx-b-em-top { display: flex; align-items: center; gap: 8px; padding: 10px 18px; border-bottom: 1px solid var(--bd2); }
.mx .mx-b-em-top .mx-mark { width: 22px; height: 22px; }
.mx .mx-b-em-top b { font-size: 13px; }
.mx .mx-b-em-top span { margin-left: auto; font-size: 10px; color: var(--mu); }
.mx .mx-b-em-hero { height: 104px; min-height: 0; border-radius: 0; }
.mx .mx-b-mail-p h6 { font-size: 16px; font-weight: 650; letter-spacing: -.015em; margin: 0; padding: 14px 20px 4px; }
.mx .mx-b-mail-p > p { font-size: 12px; line-height: 1.55; color: var(--tx2); margin: 0; padding: 0 20px; }
.mx .mx-b-coupon { display: flex; margin: 12px 20px 0; border: 1.5px dashed color-mix(in srgb, var(--ac) 60%, #fff); border-radius: 10px; background: var(--acs); }
.mx .mx-b-coupon > div { padding: 9px 12px; flex: 1; }
.mx .mx-b-coupon small { font-size: 9.5px; letter-spacing: .1em; font-weight: 700; color: var(--ac2); }
.mx .mx-b-coupon b { display: block; font-size: 20px; letter-spacing: -.02em; }
.mx .mx-b-coupon span { font-size: 10.5px; color: var(--tx2); }
.mx .mx-b-coupon .cd { flex: none; border-left: 1.5px dashed color-mix(in srgb, var(--ac) 60%, #fff); display: flex; flex-direction: column; justify-content: center; }
.mx .mx-b-coupon .cd b { font: 700 13px/1.2 "IBM Plex Mono", monospace; }
.mx .mx-b-cta { display: flex; justify-content: center; align-items: center; gap: 7px; margin: 12px 20px 0; background: var(--ac); color: #fff; border-radius: 8px; padding: 9px; font-style: normal; font-weight: 650; font-size: 12.5px; }
.mx .mx-b-cta .mx-i { width: 14px; height: 14px; }
.mx .mx-b-em-foot { display: flex; flex-direction: column; align-items: center; gap: 2px; text-align: center; font-size: 10px; color: var(--mu); padding: 10px 20px 14px; border-top: 1px solid var(--bd2); margin-top: 14px; }
.mx .mx-b-em-foot b { font-size: 11px; color: var(--tx2); }
.mx .mx-b-em-foot u { color: var(--tx2); }
.mx .mx-b-qsum { margin: 12px 20px 0; border: 1px solid var(--bd); border-radius: 10px; overflow: hidden; }
.mx .mx-b-qsum > div { background: #f8f9fb; padding: 10px 12px; border-bottom: 1px solid var(--bd2); }
.mx .mx-b-qsum small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-qsum b { font-size: 22px; letter-spacing: -.02em; display: block; }
.mx .mx-b-qsum span { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-qsum ul { display: grid; grid-template-columns: 1fr 1fr; gap: 3px 12px; list-style: none; margin: 0; padding: 8px 12px; font-size: 11px; color: var(--tx2); }
.mx .mx-b-qsum li::before { content: ""; display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--ac); margin: 0 6px 1px 0; }
.mx .mx-b-sig { display: flex; gap: 9px; align-items: center; padding: 12px 20px 16px !important; }
.mx .mx-b-sig span { display: flex; flex-direction: column; font-size: 10.5px; color: var(--mu); }
.mx .mx-b-sig span b { font-size: 12px; color: var(--tx); }
.mx .mx-b-smsp { display: flex; flex-direction: column; gap: 6px; min-height: 0; }
.mx .mx-b-smsp > small { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; color: var(--mu); }
.mx .mx-b-iph.mini { border-radius: 32px; padding: 5px; max-height: none; flex: 1; }
.mx .mx-b-iph.mini .mx-b-iph-in { border-radius: 28px; }
.mx .mx-b-iph.mini .mx-b-iph-st { padding: 8px 16px 2px 20px; font-size: 10px; }
.mx .mx-b-iph.mini .mx-b-iph-st .isl { width: 58px; height: 16px; }
.mx .mx-b-iph.mini .mx-b-cav { width: 28px; height: 28px; font-size: 12px; }
.mx .mx-b-iph.mini .mx-b-m > div { font-size: 10.8px; padding: 6px 9px; }
.mx .mx-b-iph.mini .mx-b-iph-in2 { margin: 4px 8px 16px; font-size: 10px; }
.mx .mx-b-inv { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 12px 20px 0; background: #f8f9fb; border-radius: 10px; padding: 10px 12px; }
.mx .mx-b-inv small { font-size: 10px; color: var(--mu); }
.mx .mx-b-inv b { font-size: 14px; display: block; font-variant-numeric: tabular-nums; }
.mx .mx-b-inv > div:first-child b { font-size: 18px; color: #b42318; }
.mx .mx-b-bank { display: flex; gap: 7px; align-items: center; margin: 10px 20px 0; font-size: 10.5px; color: var(--mu); }
.mx .mx-b-bank .mx-i { width: 14px; height: 14px; }
.mx .mx-b-aged { display: flex; gap: 4px; }
.mx .mx-b-aged > div { min-width: 58px; }
.mx .mx-b-aged i { display: block; height: 10px; border-radius: 3px; margin-bottom: 6px; }
.mx .mx-b-aged small { font-size: 10px; color: var(--mu); white-space: nowrap; }
.mx .mx-b-aged b { font-size: 12.5px; display: block; }
.mx .mx-b-cn { display: inline-flex; align-items: center; gap: 8px; max-width: 200px; }
.mx .mx-b-cn .mx-fav { width: 22px; height: 22px; }
.mx .mx-b-cn > span { display: flex; flex-direction: column; min-width: 0; }
.mx .mx-b-cn small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-cn b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 550; }
.mx .mx-b-od { font-size: 10.5px; font-weight: 650; background: #fef3dc; color: var(--am); border-radius: 999px; padding: 2px 8px; white-space: nowrap; }
.mx .mx-b-od.md { background: #ffe8d9; color: #c4320a; }
.mx .mx-b-od.hi { background: var(--rds); color: #b42318; }
.mx .mx-b-tri { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.mx .mx-b-tri > span { display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 1px solid var(--bd); border-radius: 999px; padding: 4px 11px; font-size: 12px; font-weight: 550; box-shadow: var(--sh1); }
.mx .mx-b-tri > span .mx-dot { margin: 0; width: 7px; height: 7px; box-shadow: none; }
.mx .mx-b-tri > span b { color: var(--mu); font-weight: 600; font-size: 11px; }
.mx .mx-b-tri > span.on { border-color: color-mix(in srgb, var(--ac) 45%, #fff); background: var(--acs); }
.mx .mx-b-tri em { margin-left: auto; font-style: normal; display: inline-flex; gap: 6px; align-items: center; font-size: 11.5px; color: var(--mu); }
.mx .mx-b-tri em .mx-i { width: 13px; height: 13px; color: var(--ac); }
.mx .mx-b-ml { display: flex; flex-direction: column; }
.mx .mx-b-mr { display: flex; gap: 10px; padding: 8px 12px; border-top: 1px solid var(--bd2); }
.mx .mx-b-mr:first-child { border-top: 0; }
.mx .mx-b-mr.sel { background: var(--acs); box-shadow: inset 3px 0 0 var(--ac); }
.mx .mx-b-mr.rd { opacity: .72; }
.mx .mx-b-mr > div { flex: 1; min-width: 0; }
.mx .mx-b-mr .t { display: flex; align-items: center; gap: 6px; }
.mx .mx-b-mr .t b { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-mr .t .mx-tag { font-size: 10px; padding: 0 6px; }
.mx .mx-b-mr time { margin-left: auto; font-size: 10.5px; color: var(--mu2); white-space: nowrap; }
.mx .mx-b-mr p { margin: 1px 0 0; font-size: 12px; font-weight: 550; color: var(--tx); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-mr small { display: flex; align-items: center; gap: 4px; font-size: 10.5px; color: var(--ac2); }
.mx .mx-b-mr small .mx-i { width: 11px; height: 11px; }
.mx .mx-b-rd { display: flex; flex-direction: column; }
.mx .mx-b-rd > header { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--bd); margin: 0; }
.mx .mx-b-rd > header > div { display: flex; align-items: center; gap: 8px; }
.mx .mx-b-rd > header b { font-size: 15px; letter-spacing: -.01em; }
.mx .mx-b-rd > header > span { display: flex; gap: 10px; color: var(--mu); }
.mx .mx-b-from { display: flex; gap: 10px; align-items: center; padding: 12px 16px 0; }
.mx .mx-b-from b { font-size: 12.5px; display: block; }
.mx .mx-b-from b span { font-weight: 400; color: var(--mu); }
.mx .mx-b-from small { font-size: 11px; color: var(--mu); }
.mx .mx-b-rd > p { font-size: 12.5px; line-height: 1.55; color: var(--tx2); margin: 0; padding: 10px 16px 10px; }
.mx .mx-b-att { display: flex; gap: 10px; align-items: center; margin: 0 16px; border: 1px solid var(--bd); border-radius: 10px; padding: 5px 12px 5px 5px; width: fit-content; }
.mx .mx-b-att-i { width: 60px; height: 40px; min-height: 0; border-radius: 6px; }
.mx .mx-b-att b { font-size: 11.5px; display: block; }
.mx .mx-b-att small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-done { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 16px 0; }
.mx .mx-b-done span { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 550; color: #067647; background: var(--grs); border-radius: 999px; padding: 3px 9px; }
.mx .mx-b-done .mx-i { width: 12px; height: 12px; }
.mx .mx-b-draft { margin: 10px 16px 14px; border: 1px solid #cddcff; background: linear-gradient(180deg, #f5f8ff, #fff); border-radius: 10px; padding: 10px 12px; }
.mx .mx-b-draft small { display: flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 700; letter-spacing: .08em; color: #2f54d6; }
.mx .mx-b-draft small .mx-i { width: 12px; height: 12px; }
.mx .mx-b-draft p { font-size: 12.3px; line-height: 1.55; margin: 6px 0 8px; }
.mx .mx-b-draft > div { display: flex; gap: 6px; align-items: center; }
.mx .mx-b-tone { margin-left: auto; font-style: normal; font-size: 10.5px; color: var(--mu); }
.mx .mx-b-sender .mx-fav { width: 30px; height: 30px; }

/* ---------- flow canvas ---------- */
.mx .mx-b-cvw { position: relative; display: flex; flex-direction: column; background-color: #fbfbfc; background-image: radial-gradient(#d5d9e0 1px, transparent 1.2px); background-size: 16px 16px; }
.mx .mx-b-cv { position: relative; margin: 14px auto 0; flex-shrink: 0; }
.mx .mx-b-cv > svg { position: absolute; inset: 0; overflow: visible; }
.mx .mx-b-cv > svg path { fill: none; stroke: #b3bcc9; stroke-width: 1.6; }
.mx .mx-b-cv > svg path.blue { stroke: #2e6ff2; }
.mx .mx-b-cv > svg path.violet { stroke: #7c3aed; }
.mx .mx-b-cv > svg path.amber { stroke: #d97706; }
.mx .mx-b-cv > svg path.yes { stroke: #12a26f; }
.mx .mx-b-cv > svg path.no { stroke: #f79009; stroke-dasharray: 4 4; }
.mx .mx-b-el { position: absolute; transform: translate(-50%, -50%); font-size: 10.5px; font-weight: 650; background: #fff; border: 1px solid var(--bd); border-radius: 999px; padding: 1px 8px; z-index: 2; }
.mx .mx-b-el.yes { color: #067647; border-color: #b7e4cc; }
.mx .mx-b-el.no { color: var(--am); border-color: #fcd9a8; }
.mx .mx-b-n { position: absolute; display: flex; align-items: center; gap: 9px; padding: 8px 10px; background: #fff; border: 1px solid var(--bd); border-radius: 11px; box-shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 6px 14px -8px rgba(16, 24, 40, .18); z-index: 1; }
.mx .mx-b-n > div { min-width: 0; flex: 1; }
.mx .mx-b-n small { display: block; font-size: 9.5px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; color: var(--mu); }
.mx .mx-b-n b { display: block; font-size: 12.3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-n em { display: block; font-style: normal; font-size: 10.5px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-n em b { display: inline; font-size: 10.5px; color: var(--tx); }
.mx .mx-b-ni { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; background: #f2f4f7; color: var(--tx2); flex-shrink: 0; }
.mx .mx-b-ni > .mx-appi, .mx .mx-b-ni > .mx-face, .mx .mx-b-ni > .mx-agent-av { width: 30px; height: 30px; }
.mx .mx-b-ni:has(> .mx-appi), .mx .mx-b-ni:has(> .mx-face), .mx .mx-b-ni:has(> .mx-agent-av), .mx .mx-b-ni:has(> .mx-b-agd), .mx .mx-b-ni:has(> .mx-b-ico) { background: none; }
.mx .mx-b-n.brand { border-color: color-mix(in srgb, var(--ac) 55%, #fff); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ac) 14%, transparent), 0 6px 14px -8px rgba(16, 24, 40, .2); }
.mx .mx-b-n.dep { border-top-width: 3px; }
.mx .mx-b-n.dep.blue, .mx .mx-b-n.tasks.blue { border-top-color: #2e6ff2; }
.mx .mx-b-n.dep.violet, .mx .mx-b-n.tasks.violet { border-top-color: #7c3aed; }
.mx .mx-b-n.dep.amber, .mx .mx-b-n.tasks.amber { border-top-color: #d97706; }
.mx .mx-b-n.tasks { display: block; padding: 8px 10px; background: #fcfcfd; }
.mx .mx-b-n.own { border: 1.5px dashed color-mix(in srgb, var(--ac) 60%, #fff); background: #fffdf7; }
.mx .mx-b-agd { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; color: #fff; background: radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--dc) 55%, #fff), var(--dc)); box-shadow: 0 3px 8px -3px var(--dc); flex-shrink: 0; }
.mx .mx-b-agd .mx-i { width: 14px; height: 14px; }
.mx .mx-b-tasks > div { display: flex; gap: 6px; align-items: center; font-size: 11.3px; padding: 3px 0; color: var(--tx2); }
.mx .mx-b-tasks > div .mx-i { width: 12px; height: 12px; color: #12a26f; stroke-width: 2.4; }
.mx .mx-b-tasks > div.run { color: var(--tx); font-weight: 550; }
.mx .mx-b-tasks small { display: block; font-size: 10.5px; color: var(--mu); border-top: 1px solid var(--bd2); padding-top: 5px; margin-top: 4px; text-transform: none; letter-spacing: 0; font-weight: 450; }
.mx .spin { width: 11px; height: 11px; border-radius: 50%; border: 2px solid var(--acs); border-top-color: var(--ac); display: inline-block; flex-shrink: 0; animation: mxbSpin 1s linear infinite; }
.mx .mx-b-cvt { position: absolute; right: 10px; top: 10px; display: flex; flex-direction: column; align-items: center; background: #fff; border: 1px solid var(--bd); border-radius: 8px; box-shadow: var(--sh2); z-index: 3; }
.mx .mx-b-cvt span { width: 28px; height: 26px; display: grid; place-items: center; color: var(--tx2); border-bottom: 1px solid var(--bd2); }
.mx .mx-b-cvt span .mx-i { width: 14px; height: 14px; }
.mx .mx-b-cvt em { font-style: normal; font-size: 9.5px; color: var(--mu); padding: 4px 0; }
.mx .mx-b-log { margin-top: auto; border-top: 1px solid var(--bd); background: #fff; padding: 6px 14px; }
.mx .mx-b-log > div { display: grid; grid-template-columns: 50px 78px minmax(0, 1fr); gap: 8px; align-items: center; font-size: 11.5px; padding: 3px 0; }
.mx .mx-b-log time { font: 500 10.5px/1 "IBM Plex Mono", monospace; color: var(--mu); }
.mx .mx-b-log em { font-style: normal; font-size: 10.5px; font-weight: 650; border-radius: 999px; padding: 1px 8px; text-align: center; }
.mx .mx-b-log em.blue { background: #eaf1ff; color: #2e6ff2; }
.mx .mx-b-log em.violet { background: #f3eeff; color: #6d28d9; }
.mx .mx-b-log em.amber { background: #fff4e0; color: #b45309; }
.mx .mx-b-log span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--tx2); }
.mx .mx-b-aa { display: flex; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--bd2); }
.mx .mx-b-c > header + .mx-b-aa { border-top: 0; }
.mx .mx-b-aa > div { flex: 1; min-width: 0; }
.mx .mx-b-aa b { font-size: 12.5px; display: block; }
.mx .mx-b-aa small { font-size: 11px; color: var(--mu); }
.mx .mx-b-n.trig { border-left: 3px solid #f79009; }
.mx .mx-b-n.wait { justify-content: center; gap: 6px; background: #f2f4f7; border-style: dashed; border-radius: 999px; font-size: 11.5px; color: var(--tx2); box-shadow: none; padding: 0 10px; }
.mx .mx-b-n.wait .mx-i { width: 13px; height: 13px; }
.mx .mx-b-n.cond { justify-content: center; gap: 6px; background: #fffaf0; border-color: #f5c26b; font-size: 12px; font-weight: 650; color: #92400e; }
.mx .mx-b-n.cond .mx-i { width: 13px; height: 13px; }
.mx .mx-b-n.email { border-left: 3px solid #2e6ff2; }
.mx .mx-b-n.sms { border-left: 3px solid #34c759; }
.mx .mx-b-n.exit { background: #f3fbf7; border-color: #b7e4cc; }
.mx .mx-b-n.rej { background: #fff6f5; border-color: #f7c6c0; }
.mx .mx-b-n.ok { border-left: 3px solid #12a26f; }
.mx .mx-b-n.sel { border-color: color-mix(in srgb, var(--ac) 60%, #fff); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ac) 16%, transparent), 0 6px 14px -8px rgba(16, 24, 40, .2); }
.mx .mx-b-mth { position: absolute; right: 10px; top: 9px; width: 40px; height: 52px; border-radius: 5px; border: 1px solid var(--bd); background: linear-gradient(180deg, #2e6ff2 0 12px, #fff 12px); padding: 16px 5px 0; display: flex; flex-direction: column; gap: 4px; }
.mx .mx-b-mth i { display: block; height: 3px; border-radius: 2px; background: #e4e7ec; }
.mx .mx-b-mth i:last-child { width: 60%; background: #2e6ff2; height: 5px; }
.mx .mx-b-n.email:has(.mx-b-mth) { padding-right: 60px; height: 72px !important; }
.mx .mx-b-tabs { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.mx .mx-b-tabs > span { display: inline-flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--bd); border-radius: 9px; padding: 6px 12px; font-size: 12px; font-weight: 600; box-shadow: var(--sh1); }
.mx .mx-b-tabs > span b { font-size: 11px; font-weight: 550; color: var(--mu); }
.mx .mx-b-tabs > span.on { border-color: color-mix(in srgb, var(--ac) 55%, #fff); background: var(--acs); color: var(--ac2); }
.mx .mx-b-tabs > span.on b { color: var(--ac2); }
.mx .mx-b-tabs em { margin-left: auto; font-style: normal; font-size: 12px; color: var(--mu); }
.mx .mx-b-tabs em b { color: var(--tx); font-size: 14px; }
.mx .mx-b-fun > div { display: grid; grid-template-columns: 100px minmax(0, 1fr) 44px; gap: 10px; align-items: center; padding: 5px 0; font-size: 12px; color: var(--tx2); }
.mx .mx-b-fun > div > div { height: 16px; background: #f2f4f7; border-radius: 4px; overflow: hidden; }
.mx .mx-b-fun i { display: block; height: 100%; background: linear-gradient(90deg, var(--acl), var(--ac)); border-radius: 4px; }
.mx .mx-b-fun b { text-align: right; font-variant-numeric: tabular-nums; }
.mx .mx-b-mix { display: flex; gap: 2px; height: 10px; border-radius: 999px; overflow: hidden; }
.mx .mx-b-mix.sm { margin-top: 10px; }
.mx .mx-b-mix i { display: block; height: 100%; }
.mx .mx-b-mix .em, .mx .mx-b-mixl .em { background: #2e6ff2; }
.mx .mx-b-mix .sm, .mx .mx-b-mixl .sm { background: #34c759; }
.mx .mx-b-mix .gy, .mx .mx-b-mixl .gy { background: #98a2b3; }
.mx .mx-b-mixl { display: flex; gap: 12px; flex-wrap: wrap; font-size: 11px; color: var(--mu); margin-top: 7px; }
.mx .mx-b-mixl span { display: inline-flex; align-items: center; gap: 5px; }
.mx .mx-b-mixl i { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.mx .mx-b-mixl .p, .mx .mx-b-sent .p { background: #12a26f; }
.mx .mx-b-mixl .n, .mx .mx-b-sent .n { background: #98a2b3; }
.mx .mx-b-mixl .x, .mx .mx-b-sent .x { background: #f04438; }
.mx .mx-b-cvh { display: flex; flex-direction: column; padding: 12px 14px 0; margin: 0; }
.mx .mx-b-cvh b { font-size: 13px; }
.mx .mx-b-cvh small { font-size: 11px; color: var(--mu); }
.mx .mx-b-req > header { align-items: flex-start; margin-bottom: 4px; }
.mx .mx-b-req > header > div:first-child { display: flex; gap: 10px; align-items: center; }
.mx .mx-b-req > header small { font-size: 11px; color: var(--mu); }
.mx .mx-b-req > header b { font-size: 14.5px; display: block; letter-spacing: -.01em; }
.mx .mx-b-req .amt { text-align: right; }
.mx .mx-b-req .amt b { font-size: 21px; letter-spacing: -.02em; }
.mx .mx-b-req-m { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 10px 0; }
.mx .mx-b-req-m > div { background: #f8f9fb; border-radius: 8px; padding: 6px 9px; min-width: 0; }
.mx .mx-b-req-m small { font-size: 10px; color: var(--mu); }
.mx .mx-b-req-m span { display: flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-req-m .mx-fav { width: 16px; height: 16px; }
.mx .mx-b-chain { display: flex; align-items: center; gap: 6px; margin: 12px 0 10px; }
.mx .mx-b-chain > div { display: flex; gap: 8px; align-items: center; padding: 7px 9px; border: 1px solid var(--bd); border-radius: 10px; flex: 1; min-width: 0; }
.mx .mx-b-chain > div > div { min-width: 0; }
.mx .mx-b-chain b { font-size: 12px; display: block; }
.mx .mx-b-chain small { font-size: 10.5px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-chain .done { background: #f3fbf7; border-color: #b7e4cc; }
.mx .mx-b-chain .now { background: #fffaf0; border-color: #f5c26b; box-shadow: 0 0 0 3px #fff3dc; }
.mx .mx-b-chain .skip { opacity: .55; }
.mx .mx-b-chain .ar { color: var(--mu2); display: inline-flex; }
.mx .mx-b-chain .ar .mx-i { width: 13px; height: 13px; }
.mx .mx-b-req-f { display: flex; gap: 8px; align-items: center; justify-content: flex-end; }
.mx .mx-b-req-f .sla { margin-right: auto; display: inline-flex; gap: 5px; align-items: center; font-size: 11.5px; font-weight: 600; color: var(--am); }
.mx .mx-b-ide { background: #0d1117; border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; border: 1px solid #1f2630; box-shadow: var(--sh3); }
.mx .mx-b-ide > header { display: flex; align-items: stretch; background: #161b22; border-bottom: 1px solid #21262d; padding: 0 6px; flex-shrink: 0; }
.mx .mx-b-ide > header span { display: inline-flex; align-items: center; gap: 6px; padding: 9px 12px; font-size: 11.5px; color: #8b949e; border-top: 2px solid transparent; }
.mx .mx-b-ide > header span.on { color: #e6edf3; background: #0d1117; border-top-color: #f0b429; }
.mx .mx-b-ide > header .mx-i { width: 13px; height: 13px; }
.mx .mx-b-ide > header em { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; font-style: normal; font-size: 11px; color: #8b949e; padding: 0 8px; }
.mx .mx-b-ide pre { flex: 1; min-height: 0; margin: 0; padding: 12px 0; font: 12px/1.8 "IBM Plex Mono", ui-monospace, Menlo, monospace; color: #e6edf3; overflow: hidden; white-space: pre; }
.mx .mx-b-ide pre > div { padding: 0 14px 0 0; }
.mx .mx-b-ide pre u { text-decoration: none; color: #484f58; display: inline-block; width: 34px; text-align: right; margin-right: 16px; }
.mx .mx-b-ide pre .cm { color: #8b949e; font-style: italic; }
.mx .mx-b-ide pre .hl { background: rgba(56, 139, 253, .12); box-shadow: inset 2px 0 0 #388bfd; }
.mx .mx-b-ide k { color: #ff7b72; }
.mx .mx-b-ide f { color: #d2a8ff; }
.mx .mx-b-ide s { color: #a5d6ff; text-decoration: none; }
.mx .mx-b-ide n { color: #79c0ff; }
.mx .mx-b-ide footer { display: flex; gap: 16px; align-items: center; padding: 6px 12px; background: #161b22; border-top: 1px solid #21262d; font-size: 10.5px; color: #8b949e; flex-shrink: 0; }
.mx .mx-b-ide footer .mx-dot { margin: 0 4px 0 0; box-shadow: none; }
.mx .mx-b-ide footer span:first-child { margin-right: auto; display: inline-flex; align-items: center; }
.mx .mx-b-mth2 { font: 700 9px/1 "IBM Plex Mono", monospace; padding: 3px 5px; border-radius: 4px; letter-spacing: .02em; }
.mx .mx-b-mth2.post { background: #fef3dc; color: #b45309; }
.mx .mx-b-mth2.get { background: var(--grs); color: #067647; }
.mx .mx-b-ep { display: inline-flex; align-items: center; gap: 7px; font: 500 11.5px/1 "IBM Plex Mono", monospace; color: var(--tx); }
.mx .mx-b-dp { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; }
.mx .mx-b-dp.green { background: var(--grs); color: #067647; }
.mx .mx-b-dp.blue { background: var(--bls); color: #2f54d6; }
.mx .mx-b-dp .mx-i { width: 13px; height: 13px; }
.mx .mx-b-up { display: flex; gap: 2px; height: 24px; }
.mx .mx-b-up i { flex: 1; border-radius: 2px; background: #34d399; }
.mx .mx-b-up i.w { background: #f5b544; }
.mx .mx-b-uptl { display: flex; justify-content: space-between; align-items: baseline; margin-top: 7px; }
.mx .mx-b-uptl b { font-size: 16px; }
.mx .mx-b-uptl small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-hub { display: flex; flex-direction: column; background-color: #fbfbfc; background-image: radial-gradient(#dde1e7 1px, transparent 1.2px); background-size: 16px 16px; }
.mx .mx-b-hubc { position: relative; width: 580px; height: 400px; margin: 10px auto 0; flex-shrink: 0; }
.mx .mx-b-hubc > svg { position: absolute; inset: 0; }
.mx .mx-b-hubc > svg path { fill: none; stroke: color-mix(in srgb, var(--ac) 45%, #cfd6e0); stroke-width: 1.8; stroke-dasharray: 4 5; animation: mxbDash 1.2s linear infinite; }
.mx .mx-b-core { position: absolute; width: 120px; height: 88px; border-radius: 18px; background: linear-gradient(160deg, #1d2f4d, #0f1b2d); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; box-shadow: 0 0 0 6px color-mix(in srgb, var(--ac) 16%, transparent), 0 16px 30px -12px rgba(15, 27, 45, .55); z-index: 2; }
.mx .mx-b-core .mx-mark { width: 30px; height: 30px; }
.mx .mx-b-core b { font-size: 13px; }
.mx .mx-b-core small { font-size: 9.5px; color: #9fb0c8; }
.mx .mx-b-hn { position: absolute; width: 72px; display: flex; flex-direction: column; align-items: center; gap: 3px; text-align: center; z-index: 2; }
.mx .mx-b-hn .mx-appi.lg { width: 42px; height: 42px; filter: drop-shadow(0 6px 10px rgba(16, 24, 40, .18)); }
.mx .mx-b-hn b { font-size: 11.5px; }
.mx .mx-b-hn small { font-size: 10px; color: var(--mu); line-height: 1.2; }
.mx .mx-b-hn i { position: absolute; top: -2px; right: 12px; width: 10px; height: 10px; border-radius: 50%; background: #12a26f; box-shadow: 0 0 0 2px #fff; }
.mx .mx-b-evs { margin-top: auto; border-top: 1px solid var(--bd); background: #fff; padding: 8px 14px; display: flex; flex-direction: column; gap: 5px; }
.mx .mx-b-evs > div { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--tx2); }
.mx .mx-b-evs > div > .mx-i { width: 12px; height: 12px; color: var(--mu2); }
.mx .mx-b-evs > div > span:not(.mx-appi) { flex: 1; margin-left: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-evs em { font-style: normal; font: 500 10.5px/1 "IBM Plex Mono", monospace; color: #067647; }
.mx .mx-b-src2 > header small { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--mu); }
.mx .mx-b-pdf { background: #fdfdfb; border: 1px solid #e6e3da; border-radius: 4px; padding: 14px 16px 12px; font: 11px/1.4 "IBM Plex Mono", monospace; color: #2b2b2b; box-shadow: 0 8px 18px -10px rgba(16, 24, 40, .25); transform: rotate(-.6deg); }
.mx .mx-b-pdf .h { border-bottom: 2px solid #1b1b1b; padding-bottom: 6px; margin-bottom: 6px; }
.mx .mx-b-pdf .h b { font-size: 11.5px; letter-spacing: .08em; display: block; }
.mx .mx-b-pdf .h small { font-size: 10px; color: #6b6b6b; }
.mx .mx-b-pdf .r { display: grid; grid-template-columns: 78px 1fr; gap: 8px; padding: 5px 0; border-bottom: 1px dotted #cfcac0; align-items: baseline; }
.mx .mx-b-pdf .r small { font-size: 9px; text-transform: uppercase; letter-spacing: .06em; color: #7b776e; }
.mx .mx-b-pdf .hl { border-radius: 3px; padding: 0 3px; }
.mx .mx-b-pdf .hl.a, .mx .mx-b-bx-a { background: #dbeafe; box-shadow: 0 0 0 1px #93c5fd; }
.mx .mx-b-pdf .hl.b { background: #fce7f3; box-shadow: 0 0 0 1px #f9a8d4; }
.mx .mx-b-pdf .hl.c { background: #fef3c7; box-shadow: 0 0 0 1px #fcd34d; }
.mx .mx-b-pdf .hl.d { background: #dcfce7; box-shadow: 0 0 0 1px #86efac; }
.mx .mx-b-pdf .hl.e { background: #ede9fe; box-shadow: 0 0 0 1px #c4b5fd; }
.mx .mx-b-pdf .hl.f { background: #ffedd5; box-shadow: 0 0 0 1px #fdba74; }
.mx .mx-b-pdf .sg { font: italic 400 22px/1 "Instrument Serif", Georgia, serif; margin-top: 12px; color: #1d3a8a; }
.mx .mx-b-arrow { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; position: relative; }
.mx .mx-b-arrow::before { content: ""; position: absolute; top: 50%; left: -6px; right: -6px; border-top: 2px dashed color-mix(in srgb, var(--ac) 55%, #fff); z-index: 0; }
.mx .mx-b-arrow span { position: relative; z-index: 1; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: var(--ac); color: #fff; box-shadow: 0 0 0 6px var(--acs); }
.mx .mx-b-arrow small { position: relative; z-index: 1; background: #f7f8fa; font-size: 10.5px; color: var(--mu); text-align: center; line-height: 1.35; padding: 0 2px; margin-top: 50px; }
.mx .mx-b-dest > header { justify-content: flex-start; gap: 10px; }
.mx .mx-b-dest > header b { font-size: 13px; display: block; }
.mx .mx-b-dest > header small { font-size: 11px; color: #067647; }
.mx .mx-b-ff { display: block; margin-top: 5px; }
.mx .mx-b-ff small { font-size: 10px; color: var(--mu); font-weight: 550; margin-bottom: 2px; }
.mx .mx-b-ff div { display: flex; justify-content: space-between; align-items: center; border: 1px solid #c9ecd9; background: #f6fef9; border-radius: 7px; padding: 5px 9px; font-size: 11.8px; font-weight: 550; }
.mx .mx-b-ff .mx-i { width: 12px; height: 12px; color: #12a26f; stroke-width: 2.4; }
.mx .mx-b-dest-f { display: flex; gap: 8px; align-items: center; margin-top: 10px; }
.mx .mx-b-dest-f small { font-size: 11px; color: var(--mu); }
.mx .mx-b-night { flex-shrink: 0; padding: 12px 14px; }
.mx .mx-b-sky { display: flex; height: 20px; border-radius: 6px; overflow: hidden; background: linear-gradient(90deg, #111a3a 0%, #1e1b4b 38%, #6d28d9 62%, #f59e0b 84%, #fde68a 100%); }
.mx .mx-b-sky span { flex: 1; font-size: 9.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(255, 255, 255, .75); padding: 4px 10px; }
.mx .mx-b-sky span:last-child { color: #7c4a03; text-align: right; }
.mx .mx-b-tl { position: relative; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.mx .mx-b-tl::before { content: ""; position: absolute; left: 4px; right: 4px; top: 25px; height: 2px; background: #e4e7ec; }
.mx .mx-b-tl > div { position: relative; min-width: 0; }
.mx .mx-b-tl time { font: 600 11px/1 "IBM Plex Mono", monospace; color: var(--tx2); }
.mx .mx-b-tl .dt { display: block; width: 10px; height: 10px; border-radius: 50%; background: var(--ac); box-shadow: 0 0 0 3px #fff, 0 0 0 4px color-mix(in srgb, var(--ac) 40%, #fff); margin: 7px 0 0 2px; position: relative; }
.mx .mx-b-tl .cd { display: flex; gap: 7px; align-items: center; border: 1px solid var(--bd); background: #fff; border-radius: 10px; padding: 7px 8px; margin-top: 9px; box-shadow: var(--sh1); position: relative; }
.mx .mx-b-tl .cd > div { min-width: 0; flex: 1; }
.mx .mx-b-tl .cd b { font-size: 11.5px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-tl .cd small { font-size: 10px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-tl .cd em { position: absolute; top: -8px; right: 6px; font-style: normal; font: 500 9.5px/1 "IBM Plex Mono", monospace; color: #067647; background: var(--grs); border-radius: 4px; padding: 2px 4px; }
.mx .mx-b-tl .chk .cd { border-color: #b7e4cc; background: #f6fef9; }
.mx .mx-b-tl .br { display: flex; flex-direction: column; gap: 3px; margin-top: 6px; font-size: 10px; }
.mx .mx-b-tl .br span { padding-left: 10px; position: relative; line-height: 1.3; }
.mx .mx-b-tl .br span::before { content: ""; position: absolute; left: 0; top: 4px; width: 5px; height: 5px; border-radius: 50%; }
.mx .mx-b-tl .br .y { color: #067647; }
.mx .mx-b-tl .br .y::before { background: #12a26f; }
.mx .mx-b-tl .br .n { color: var(--am); }
.mx .mx-b-tl .br .n::before { background: #f79009; }
.mx .mx-b-brief { display: flex; flex-direction: column; gap: 8px; }
.mx .mx-b-brief > small { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; color: var(--mu); }
.mx .mx-b-bm { flex: 1; border: 1px solid var(--bd); border-radius: 10px; overflow: hidden; display: flex; flex-direction: column; }
.mx .mx-b-bm .h { display: flex; align-items: center; gap: 8px; background: #0f1b2d; color: #fff; padding: 9px 12px; }
.mx .mx-b-bm .h .mx-mark { width: 20px; height: 20px; }
.mx .mx-b-bm .h b { font-size: 12.5px; }
.mx .mx-b-bm .k { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; padding: 10px 12px 4px; }
.mx .mx-b-bm .k small { font-size: 9.5px; color: var(--mu); }
.mx .mx-b-bm .k b { font-size: 13.5px; display: block; letter-spacing: -.01em; }
.mx .mx-b-bm .k em { font-style: normal; font-size: 10px; color: #067647; font-weight: 600; }
.mx .mx-b-bm .mx-b-line { margin: 4px 12px 0; }
.mx .mx-b-bm p { display: flex; gap: 6px; align-items: flex-start; font-size: 11px; margin: auto 12px 10px; background: #fffaf0; border-radius: 7px; padding: 6px 8px; color: var(--tx2); }
.mx .mx-b-bm p .mx-i { width: 12px; height: 12px; color: var(--am); }
.mx .mx-b-make { display: flex; flex-direction: column; background-color: #fbfaff; background-image: radial-gradient(#e0dcf0 1px, transparent 1.2px); background-size: 16px 16px; }
.mx .mx-b-mk { position: relative; width: 620px; height: 244px; margin: 8px auto 0; flex-shrink: 0; }
.mx .mx-b-mk > svg { position: absolute; inset: 0; }
.mx .mx-b-mk > svg path { fill: none; stroke: #b9a8f0; stroke-width: 4; stroke-linecap: round; stroke-dasharray: .1 10; }
.mx .mx-b-mod { position: absolute; width: 92px; display: flex; flex-direction: column; align-items: center; gap: 5px; z-index: 1; }
.mx .mx-b-mod .mx-appi.lg, .mx .mx-b-mod .rt { width: 64px; height: 64px; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 4px #fff, 0 10px 20px -8px rgba(76, 29, 149, .4); }
.mx .mx-b-mod .mx-appi.lg svg { transform: scale(1.02); }
.mx .mx-b-mod .rt { display: grid; place-items: center; background: #fff; border: 2px solid #b9a8f0; color: #6d4ed6; box-sizing: border-box; }
.mx .mx-b-mod .rt .mx-i { width: 22px; height: 22px; }
.mx .mx-b-mod b { font-size: 11.5px; }
.mx .mx-b-mod em { position: absolute; top: -2px; left: 62px; width: 18px; height: 18px; border-radius: 50%; background: #6d4ed6; color: #fff; font-style: normal; font-size: 10px; font-weight: 700; display: grid; place-items: center; box-shadow: 0 0 0 2px #fff; }
.mx .mx-b-ops { position: absolute; font-size: 10px; font-weight: 700; color: #fff; background: #6d4ed6; border-radius: 999px; padding: 2px 7px; z-index: 2; }
.mx .mx-b-mkf { display: flex; gap: 8px; align-items: center; padding: 9px 14px; border-top: 1px solid var(--bd); background: #fff; margin-top: auto; font-size: 11.5px; color: var(--mu); }
.mx .mx-b-mkf em { margin-left: auto; font-style: normal; }
.mx .mx-b-mkf em b { color: var(--tx); }
.mx .mx-b-cost { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mx .mx-b-cost > div { border-radius: 10px; padding: 10px 11px; border: 1px solid; }
.mx .mx-b-cost small { font-size: 10.5px; color: var(--mu); font-weight: 550; }
.mx .mx-b-cost b { display: block; font-size: 24px; letter-spacing: -.03em; margin: 2px 0; }
.mx .mx-b-cost span { font-size: 10.5px; color: var(--mu); line-height: 1.3; display: block; }
.mx .mx-b-cost .old { background: #fff6f5; border-color: #f7c6c0; }
.mx .mx-b-cost .old b { color: #b42318; text-decoration: line-through; text-decoration-thickness: 2px; }
.mx .mx-b-cost .new { background: #f3fbf7; border-color: #b7e4cc; }
.mx .mx-b-cost .new b { color: #067647; }
.mx .mx-b-save { display: flex; gap: 10px; align-items: center; margin-top: 10px; background: #0f1b2d; color: #fff; border-radius: 10px; padding: 10px 12px; }
.mx .mx-b-save > .mx-i { width: 28px; height: 28px; padding: 6px; border-radius: 50%; background: #12a26f; }
.mx .mx-b-save b { font-size: 13.5px; display: block; }
.mx .mx-b-save small { font-size: 11px; color: #9fb0c8; }

/* ---------- documents ---------- */
.mx .mx-b-paper { background: #fff; border: 1px solid var(--bd); border-radius: 10px; box-shadow: var(--sh3); padding: 18px 22px; overflow: hidden; min-height: 0; }
.mx .mx-b-paper h5 { font-size: 17px; font-weight: 650; letter-spacing: -.02em; margin: 0 0 8px; }
.mx .mx-b-ph { display: flex; gap: 10px; align-items: center; border-bottom: 1px solid var(--bd2); padding-bottom: 12px; margin-bottom: 14px; }
.mx .mx-b-ph .mx-mark { width: 30px; height: 30px; }
.mx .mx-b-ph b { font-size: 13px; display: block; }
.mx .mx-b-ph small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-ph time { margin-left: auto; font-size: 11px; color: var(--mu); }
.mx .mx-b-hello { display: flex; align-items: center; gap: 14px; color: #fff; border-radius: 14px; padding: 16px 20px; background: radial-gradient(90% 140% at 100% 0%, #38bdf8 0%, transparent 55%), linear-gradient(120deg, #0c4a6e, #075985 60%, #0369a1); box-shadow: var(--sh3); flex-shrink: 0; }
.mx .mx-b-hello > div:first-child { flex: 1; min-width: 0; }
.mx .mx-b-hello small { font-size: 10.5px; letter-spacing: .12em; font-weight: 700; color: #bae6fd; }
.mx .mx-b-hello h3 { font-size: 23px; letter-spacing: -.02em; margin: 4px 0 4px; font-weight: 650; }
.mx .mx-b-hello p { margin: 0; font-size: 12.5px; color: #e0f2fe; }
.mx .mx-b-wx, .mx .mx-b-cal1 { display: flex; gap: 9px; align-items: center; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .16); border-radius: 12px; padding: 9px 12px; flex-shrink: 0; }
.mx .mx-b-wx .mx-i { width: 24px; height: 24px; color: #fde68a; }
.mx .mx-b-cal1 .mx-i { width: 20px; height: 20px; color: #bae6fd; }
.mx .mx-b-wx b, .mx .mx-b-cal1 b { font-size: 16px; display: block; }
.mx .mx-b-cal1 b { font-size: 13px; }
.mx .mx-b-wx small, .mx .mx-b-cal1 small { font-size: 10.5px; letter-spacing: 0; font-weight: 500; color: #e0f2fe; }
.mx .mx-b-pri { display: flex; flex-direction: column; gap: 8px; }
.mx .mx-b-pri > header { display: flex; justify-content: space-between; align-items: center; margin: 0; }
.mx .mx-b-pri > header em { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: #0f1b2d; color: #fff; font-style: normal; font-weight: 700; font-size: 13px; }
.mx .mx-b-pri > b { font-size: 15px; letter-spacing: -.01em; }
.mx .mx-b-pri > p { font-size: 12.5px; line-height: 1.55; color: var(--tx2); margin: 0; flex: 1; }
.mx .mx-b-pri > footer { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid var(--bd2); padding-top: 10px; }
.mx .mx-b-pri > footer small { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--mu); }
.mx .mx-b-paper.q { padding: 0; display: flex; flex-direction: column; }
.mx .mx-b-cover { position: relative; height: 118px; flex-shrink: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 14px 22px; color: #fff; overflow: hidden; background: linear-gradient(110deg, #0f1b2d 0%, #16304f 55%, #1d3d63 100%); }
.mx .mx-b-cover > div { position: relative; z-index: 2; }
.mx .mx-b-cover > div:first-child { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.mx .mx-b-cover > div:first-child .mx-mark { width: 22px; height: 22px; }
.mx .mx-b-cover small { font-size: 9.5px; letter-spacing: .14em; color: #93c5fd; font-weight: 700; }
.mx .mx-b-cover h3 { font-size: 24px; margin: 1px 0 1px; letter-spacing: -.02em; font-family: "Instrument Serif", Georgia, serif; font-weight: 400; font-size: 30px; line-height: 1; }
.mx .mx-b-cover span { font-size: 11.5px; color: #cbd5e1; }
.mx .mx-b-cover-i { position: absolute; top: 0; bottom: 0; right: 0; width: 55%; min-height: 0; border-radius: 0; z-index: 1; -webkit-mask-image: linear-gradient(90deg, transparent, #000 45%); mask-image: linear-gradient(90deg, transparent, #000 45%); }
.mx .mx-b-qm { display: flex; border-bottom: 1px solid var(--bd2); flex-shrink: 0; }
.mx .mx-b-qm span { flex: 1; padding: 8px 22px; font-size: 12px; font-weight: 600; border-left: 1px solid var(--bd2); }
.mx .mx-b-qm span:first-child { border-left: 0; }
.mx .mx-b-qm small { font-size: 10px; color: var(--mu); font-weight: 500; }
.mx .mx-b-paper.q .mx-b-t { margin: 6px 10px 0; width: calc(100% - 20px); }
.mx .mx-b-tot { margin: 6px 22px 12px auto; width: 270px; font-size: 12px; }
.mx .mx-b-tot > div { display: flex; justify-content: space-between; padding: 3px 0; color: var(--tx2); }
.mx .mx-b-tot b { font-variant-numeric: tabular-nums; color: var(--tx); }
.mx .mx-b-tot .t { border-top: 1px solid var(--bd3); margin-top: 4px; padding-top: 7px; font-size: 13.5px; font-weight: 650; color: var(--tx); }
.mx .mx-b-tot .t b { font-size: 17px; letter-spacing: -.02em; }
.mx .mx-b-tot.sm { width: 230px; margin: 6px 0 0 auto; }
.mx .mx-b-acc2-h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.mx .mx-b-acc2-h small { font-size: 10.5px; color: var(--mu); font-weight: 600; text-transform: uppercase; letter-spacing: .06em; }
.mx .mx-b-acc2 > b { font-size: 14px; display: block; }
.mx .mx-b-acc2 > small { font-size: 11px; color: var(--mu); line-height: 1.4; }
.mx .mx-b-accbtn { margin-top: 10px; border: 1px dashed var(--bd3); border-radius: 10px; padding: 10px; text-align: center; background: #fafbfc; }
.mx .mx-b-accbtn span { display: inline-flex; gap: 6px; align-items: center; background: linear-gradient(180deg, #1fb07d, #12a26f); color: #fff; font-weight: 650; font-size: 12.5px; border-radius: 8px; padding: 7px 16px; box-shadow: 0 4px 10px -4px rgba(18, 162, 111, .6); }
.mx .mx-b-accbtn small { display: block; margin-top: 6px; font-size: 10.5px; color: var(--mu); }
.mx .mx-b-tlv > div { position: relative; padding: 0 0 9px 18px; }
.mx .mx-b-tlv > div::before { content: ""; position: absolute; left: 4px; top: 10px; bottom: 0; width: 1.5px; background: var(--bd); }
.mx .mx-b-tlv > div:last-child::before { display: none; }
.mx .mx-b-tlv i { position: absolute; left: 0; top: 3px; width: 10px; height: 10px; border-radius: 50%; }
.mx .mx-b-tlv i.blue { background: #2e6ff2; }
.mx .mx-b-tlv i.green { background: #12a26f; }
.mx .mx-b-tlv b { font-size: 12px; margin-right: 6px; }
.mx .mx-b-tlv small { display: inline; font-size: 11px; color: var(--mu); }
.mx .mx-b-aimsg { display: flex; gap: 8px; align-items: flex-start; background: linear-gradient(180deg, #f0f7ff, #fff); border: 1px solid #d6e4ff; border-radius: 10px; padding: 9px 11px; }
.mx .mx-b-aimsg .mx-i { width: 14px; height: 14px; color: var(--ac); flex-shrink: 0; margin-top: 2px; }
.mx .mx-b-aimsg p { margin: 0; font-size: 12px; line-height: 1.5; }
.mx .mx-b-thumbs { display: flex; flex-direction: column; gap: 10px; }
.mx .mx-b-thumbs > div { position: relative; height: 76px; background: #fff; border: 1px solid var(--bd); border-radius: 5px; padding: 10px 7px; box-shadow: var(--sh1); }
.mx .mx-b-thumbs > div.on { border: 2px solid var(--ac); }
.mx .mx-b-thumbs i { display: block; height: 3px; background: #e4e7ec; border-radius: 2px; margin-bottom: 5px; }
.mx .mx-b-thumbs i:nth-child(2) { width: 80%; }
.mx .mx-b-thumbs i:nth-child(4) { width: 60%; }
.mx .mx-b-thumbs b { position: absolute; left: 7px; bottom: 9px; width: 28px; height: 9px; background: #fde68a; border-radius: 2px; }
.mx .mx-b-thumbs small { position: absolute; right: 5px; bottom: 3px; font-size: 9px; color: var(--mu); }
.mx .mx-b-cl { font-size: 12.3px; line-height: 1.6; color: var(--tx2); margin: 0; }
.mx .mx-b-sigs { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 22px; }
.mx .mx-b-sigs > div > small { font-size: 10.5px; color: var(--mu); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 4px; }
.mx .mx-b-sigs .done .mx-sig { position: static; display: block; height: 52px; line-height: 52px; border-bottom: 1px solid var(--tx); font-size: 34px; color: #1d3a8a; }
.mx .mx-b-sigs b { font-size: 12px; display: block; margin-top: 6px; }
.mx .mx-b-sigs em { display: flex; align-items: center; gap: 5px; font-style: normal; font-size: 11px; color: var(--mu); margin-top: 2px; }
.mx .mx-b-sigs em .mx-i { width: 12px; height: 12px; }
.mx .mx-b-sigs .done em { color: #067647; }
.mx .mx-b-sigs .need em { color: var(--am); }
.mx .mx-b-signhere { position: relative; height: 52px; display: flex; align-items: center; justify-content: center; gap: 6px; background: #fffbea; border: 1.5px dashed #f5b544; border-radius: 8px; color: #92400e; font-size: 12px; font-weight: 650; }
.mx .mx-b-signhere .mx-i { width: 15px; height: 15px; }
.mx .mx-b-signhere .flag { position: absolute; left: -10px; top: -11px; background: #f5b544; color: #3b2a05; font-size: 10px; font-weight: 750; padding: 2px 9px 2px 8px; border-radius: 4px; box-shadow: 0 2px 6px -2px rgba(146, 64, 14, .5); }
.mx .mx-b-init { display: flex; gap: 8px; align-items: center; margin-top: 18px; font-size: 11px; color: var(--mu); }
.mx .mx-b-init span { border: 1px solid var(--bd); border-radius: 6px; padding: 4px 10px; font: italic 400 15px/1 "Instrument Serif", serif; color: #1d3a8a; }
.mx .mx-b-init span.need { font: 600 10.5px/1.4 Inter, sans-serif; color: #92400e; background: #fffbea; border: 1.5px dashed #f5b544; }
.mx .mx-b-signers > div { display: flex; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--bd2); }
.mx .mx-b-signers > div:first-child { border-top: 0; padding-top: 0; }
.mx .mx-b-signers > div > div { flex: 1; min-width: 0; }
.mx .mx-b-signers b { font-size: 12.3px; display: block; }
.mx .mx-b-signers small { font-size: 10.5px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-audit > div { display: grid; grid-template-columns: 50px minmax(0, 1fr); gap: 8px; padding: 6px 0; border-top: 1px solid var(--bd2); }
.mx .mx-b-audit > div:first-child { border-top: 0; }
.mx .mx-b-audit time { font: 500 10.5px/1.5 "IBM Plex Mono", monospace; color: var(--mu); }
.mx .mx-b-audit b { font-size: 11.8px; display: block; }
.mx .mx-b-audit small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-lockn { display: flex; gap: 8px; align-items: center; font-size: 11px; color: var(--mu); padding: 9px 11px; background: #f2f4f7; border-radius: 10px; flex-shrink: 0; }
.mx .mx-b-lockn .mx-i { width: 14px; height: 14px; }
.mx .mx-b-pros { display: flex; gap: 12px; align-items: center; flex-direction: row; flex-shrink: 0; }
.mx .mx-b-pros > .mx-fav { width: 42px; height: 42px; }
.mx .mx-b-pros > div:nth-child(2) { min-width: 0; }
.mx .mx-b-pros > div > b { font-size: 16px; display: block; letter-spacing: -.01em; }
.mx .mx-b-pros > div > small { font-size: 11.5px; color: var(--mu); }
.mx .mx-b-pros .who { margin-left: auto; display: flex; gap: 10px; align-items: center; padding-left: 16px; border-left: 1px solid var(--bd); }
.mx .mx-b-pros .who b { font-size: 12.5px; display: block; }
.mx .mx-b-pros .who small { font-size: 11px; color: var(--mu); }
.mx .mx-b-tp { list-style: none; margin: 0; padding: 0; counter-reset: tp; }
.mx .mx-b-tp li { position: relative; padding: 7px 0 7px 32px; border-top: 1px solid var(--bd2); font-size: 12.5px; line-height: 1.45; counter-increment: tp; }
.mx .mx-b-tp li:first-child { border-top: 0; padding-top: 2px; }
.mx .mx-b-tp li::before { content: counter(tp); position: absolute; left: 0; top: 7px; width: 22px; height: 22px; border-radius: 50%; background: var(--acs); color: var(--ac2); font-size: 11px; font-weight: 700; display: grid; place-items: center; }
.mx .mx-b-tp li:first-child::before { top: 2px; }
.mx .mx-b-obj { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--bd2); }
.mx .mx-b-obj small { width: 100%; font-size: 10.5px; color: var(--mu); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.mx .mx-b-open { font: italic 400 18px/1.35 "Instrument Serif", Georgia, serif; color: var(--tx); margin: 0; }
.mx .mx-b-cmp { gap: 10px; }
.mx .mx-b-cmp > header { justify-content: flex-start; gap: 10px; margin: 0; }
.mx .mx-b-cmp > header > div { flex: 1; min-width: 0; }
.mx .mx-b-cmp > header b { font-size: 12.5px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-cmp > header small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-cmp > header .mx-fav { width: 30px; height: 30px; }
.mx .mx-b-cmp > header .mx-tag { font-size: 10px; }
.mx .mx-b-price { background: #f8f9fb; border-radius: 10px; padding: 8px 10px; }
.mx .mx-b-price small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-price > div { display: flex; align-items: center; gap: 6px; }
.mx .mx-b-price s { color: var(--mu2); font-size: 13px; }
.mx .mx-b-price b { font-size: 20px; letter-spacing: -.02em; }
.mx .mx-b-price .mx-i { width: 14px; height: 14px; color: var(--mu2); }
.mx .mx-b-price b.down { color: #d92d20; }
.mx .mx-b-price b.up { color: #067647; }
.mx .mx-b-ads > small { font-size: 10.5px; color: var(--mu); font-weight: 600; margin-bottom: 5px; }
.mx .mx-b-ads > div { display: flex; gap: 6px; }
.mx .mx-b-adt { position: relative; flex: 1; height: 74px; border-radius: 8px; overflow: hidden; padding: 7px; color: #fff; }
.mx .mx-b-adt::after { content: ""; position: absolute; right: -14px; top: -14px; width: 46px; height: 46px; border-radius: 50%; background: rgba(255, 255, 255, .16); }
.mx .mx-b-adt b { position: relative; font-size: 9.5px; font-weight: 750; line-height: 1.15; display: block; z-index: 1; }
.mx .mx-b-adt i { position: absolute; left: 7px; bottom: 7px; width: 32px; height: 8px; border-radius: 3px; background: rgba(255, 255, 255, .9); }
.mx .mx-b-cn2 { display: flex; gap: 6px; font-size: 11.5px; color: var(--tx2); margin: 0; line-height: 1.4; }
.mx .mx-b-cn2 .mx-i { width: 13px; height: 13px; color: var(--ac); flex-shrink: 0; margin-top: 1px; }
.mx .mx-b-row2 { display: flex; gap: 6px; margin-top: 10px; }
.mx .mx-b-ask.q { height: 46px; font-size: 13.5px; }
.mx .mx-b-steps > div { position: relative; display: flex; gap: 10px; padding: 0 0 9px; }
.mx .mx-b-steps > div::before { content: ""; position: absolute; left: 9px; top: 20px; bottom: 0; width: 1.5px; background: #b7e4cc; }
.mx .mx-b-steps > div:last-child::before { display: none; }
.mx .mx-b-steps i { width: 20px; height: 20px; border-radius: 50%; background: #12a26f; color: #fff; display: grid; place-items: center; flex-shrink: 0; position: relative; }
.mx .mx-b-steps i .mx-i { width: 11px; height: 11px; stroke-width: 2.6; }
.mx .mx-b-steps b { font-size: 12px; display: block; }
.mx .mx-b-steps small { font-size: 10.5px; color: var(--mu); line-height: 1.35; }
.mx .mx-b-srcf { display: flex; flex-wrap: wrap; gap: 5px; margin-top: auto; padding-top: 6px; }
.mx .mx-b-srcf span { font-size: 10.5px; color: var(--tx2); border: 1px solid var(--bd); border-radius: 999px; padding: 1px 8px; }
.mx .mx-b-rt { display: inline-flex; gap: 5px; align-items: center; font-weight: 600; color: var(--tx); }
.mx .mx-b-sum { font-size: 12.5px; line-height: 1.55; margin: 0; }
.mx .mx-b-rec { display: flex; gap: 8px; align-items: center; padding-bottom: 8px; border-bottom: 1px solid var(--bd2); margin-bottom: 4px; }
.mx .mx-b-rec b { font-size: 12px; display: block; }
.mx .mx-b-rec small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-fld { display: flex; flex-direction: column; padding: 5px 0; }
.mx .mx-b-fld code { font: 500 10px/1.3 "IBM Plex Mono", monospace; color: #6941c6; background: #f4f3ff; padding: 1px 5px; border-radius: 4px; width: fit-content; }
.mx .mx-b-fld span { font-size: 12px; font-weight: 600; margin-top: 2px; }
.mx .mx-b-paper.tpl p { font-size: 12.5px; line-height: 1.7; margin: 0 0 8px; color: var(--tx2); }
.mx .mx-b-mf { background: #dcfce7; color: #065f46; padding: 1px 5px; border-radius: 4px; font-weight: 600; box-shadow: inset 0 0 0 1px #a7f3d0; }
.mx .mx-b-paper.tpl .mx-b-cond { background: #f8f7ff; border-left: 3px solid #7c3aed; padding: 6px 10px; border-radius: 4px; }
.mx .mx-b-cond span { display: flex; gap: 5px; align-items: center; font-size: 10.5px; font-weight: 700; color: #6d28d9; }
.mx .mx-b-cond .mx-i { width: 12px; height: 12px; }
.mx .mx-b-mfk { display: flex; gap: 8px; align-items: center; font-size: 11px; color: var(--mu); border-top: 1px solid var(--bd2); padding-top: 10px; margin-top: 12px; }
.mx .mx-b-big2 { font-size: 30px; font-weight: 700; letter-spacing: -.03em; line-height: 1.05; margin-bottom: 6px; }
.mx .mx-b-big2 small { font-size: 11px; color: var(--mu); font-weight: 500; letter-spacing: 0; }
.mx .mx-b-rep { background: #fff; border: 1px solid var(--bd); border-radius: 12px; box-shadow: var(--sh3); padding: 14px 16px; display: flex; flex-direction: column; gap: 12px; overflow: hidden; }
.mx .mx-b-rep > header { display: flex; gap: 10px; align-items: center; }
.mx .mx-b-rep > header .mx-fav { width: 32px; height: 32px; }
.mx .mx-b-rep > header b { font-size: 14px; display: block; }
.mx .mx-b-rep > header small { font-size: 11px; color: var(--mu); }
.mx .mx-b-rep .mx-b-stat { box-shadow: none; background: #fafbfc; }
.mx .mx-b-rc { border: 1px solid var(--bd2); border-radius: 10px; padding: 10px 12px; min-width: 0; }
.mx .mx-b-rc > small { font-size: 11px; color: var(--tx2); font-weight: 600; margin-bottom: 6px; }
.mx .mx-b-tick { display: inline-flex; color: #2e90fa; }
.mx .mx-b-tick .mx-i { width: 13px; height: 13px; stroke-width: 2.4; }
.mx .mx-b-tick .mx-i + .mx-i { margin-left: -8px; }
.mx .mx-b-tick.gy { color: var(--mu2); }
.mx .mx-b-cfoot { border-top: 1px solid var(--bd2); padding-top: 8px; margin-top: auto; }
.mx .mx-b-cfoot small { font-size: 11px; color: var(--mu); }
.mx .mx-b-pages { display: flex; gap: 10px; flex-shrink: 0; }
.mx .mx-b-pages > div { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.mx .mx-b-pages .pg { width: 100%; height: 50px; background: #fff; border: 1px solid var(--bd); border-radius: 5px; padding: 8px 9px; box-shadow: var(--sh1); }
.mx .mx-b-pages .pg i { display: block; height: 3px; background: #e4e7ec; border-radius: 2px; margin-bottom: 5px; }
.mx .mx-b-pages .pg i:first-child { width: 50%; height: 5px; background: #cbd2dc; }
.mx .mx-b-pages .pg i:last-child { width: 70%; }
.mx .mx-b-pages .pg.p0 { background: linear-gradient(135deg, #0f1b2d, #1d3d63); }
.mx .mx-b-pages .pg.p0 i { background: rgba(255, 255, 255, .3); }
.mx .mx-b-pages .on .pg { border: 2px solid var(--ac); }
.mx .mx-b-pages small { font-size: 10.5px; color: var(--mu); white-space: nowrap; }
.mx .mx-b-pages .on small { color: var(--ac2); font-weight: 600; }
.mx .mx-b-xl { display: flex; justify-content: space-between; font-size: 10px; color: var(--mu2); width: 400px; margin-top: 4px; }
.mx .mx-b-lg2 { display: flex; gap: 14px; font-size: 11px; color: var(--mu); margin-top: 8px; }
.mx .mx-b-lg2 span { display: inline-flex; align-items: center; gap: 6px; }
.mx .mx-b-lg2 i { width: 16px; height: 2px; background: var(--ac); display: inline-block; }
.mx .mx-b-lg2 i.d { background: repeating-linear-gradient(90deg, var(--ac) 0 4px, transparent 4px 7px); }
.mx .mx-b-rag { font-size: 10.5px; font-weight: 650; border-radius: 999px; padding: 2px 8px; white-space: nowrap; }
.mx .mx-b-rag::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: currentColor; margin: 0 5px 1px 0; }
.mx .mx-b-rag.g { background: var(--grs); color: #067647; }
.mx .mx-b-rag.a { background: var(--ams); color: var(--am); }
.mx .mx-b-rag.r { background: var(--rds); color: #b42318; }
.mx .mx-b-hs { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px; }
.mx .mx-b-hs > small { font-size: 10.5px; letter-spacing: .1em; font-weight: 700; color: var(--mu); }
.mx .mx-b-hs > b { font-size: 15px; }
.mx .mx-b-hs > p { font-size: 12px; line-height: 1.5; color: var(--tx2); margin: 0; }
.mx .mx-b-bench { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 6px; }
.mx .mx-b-bench span { font-size: 11px; color: var(--mu); background: #f2f4f7; border-radius: 999px; padding: 3px 9px; }
.mx .mx-b-bench b { color: var(--tx); }
.mx .mx-b-ar { display: flex; flex-direction: row; align-items: center; gap: 10px; padding: 10px 12px; }
.mx .mx-b-ar > div { min-width: 0; }
.mx .mx-b-ar b { font-size: 13px; display: block; }
.mx .mx-b-ar small { font-size: 10.5px; color: var(--mu); line-height: 1.3; }
.mx .mx-b-scg > div { display: grid; grid-template-columns: 170px minmax(0, 1fr) 26px 108px; gap: 10px; align-items: center; padding: 4.5px 0; font-size: 12px; color: var(--tx2); }
.mx .mx-b-scg .t { height: 8px; background: #f0f1f4; border-radius: 999px; overflow: hidden; }
.mx .mx-b-scg .t i { display: block; height: 100%; border-radius: 999px; }
.mx .mx-b-scg .t i.g { background: linear-gradient(90deg, #86e0b7, #12a26f); }
.mx .mx-b-scg .t i.a { background: linear-gradient(90deg, #fdd08a, #f79009); }
.mx .mx-b-scg .t i.r { background: linear-gradient(90deg, #fda29b, #f04438); }
.mx .mx-b-scg b { text-align: right; font-variant-numeric: tabular-nums; color: var(--tx); }
.mx .mx-b-scg small { font-size: 10.5px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-gv { color: #067647; font-size: 12.5px; }
.mx .mx-b-vq { gap: 7px; padding: 11px 13px; }
.mx .mx-b-vq .t { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.mx .mx-b-vq .t small { font-size: 10px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-vq p { margin: 0; font: italic 400 15.5px/1.32 "Instrument Serif", Georgia, serif; color: var(--tx); flex: 1; }
.mx .mx-b-vq .f { display: flex; gap: 6px; align-items: center; font-size: 11px; }
.mx .mx-b-vq .f small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-words2 { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.mx .mx-b-words2 span { border-radius: 999px; padding: 3px 10px; background: var(--acs); color: var(--ac2); font-weight: 550; }
.mx .mx-b-words2 .w5 { font-size: 15px; font-weight: 700; }
.mx .mx-b-words2 .w4 { font-size: 13.5px; font-weight: 650; }
.mx .mx-b-words2 .w3 { font-size: 12.5px; }
.mx .mx-b-words2 .w2 { font-size: 11.5px; background: #f2f4f7; color: var(--tx2); }
.mx .mx-b-words2 .w1 { font-size: 11px; background: #f7f8fa; color: var(--mu); }
.mx .mx-b-sent { display: flex; gap: 2px; height: 26px; border-radius: 8px; overflow: hidden; }
.mx .mx-b-sent > div { display: grid; place-items: center; color: #fff; font-size: 11px; font-weight: 650; }
.mx .mx-b-meet { display: flex; flex-direction: row; align-items: center; gap: 16px; padding: 10px 14px; flex-shrink: 0; }
.mx .mx-b-att2 { display: flex; gap: 10px; align-items: center; flex: none; }
.mx .mx-b-att2 b { font-size: 12.5px; display: block; }
.mx .mx-b-att2 small { font-size: 11px; color: var(--mu); }
.mx .mx-b-spk { flex: 1; display: flex; gap: 3px; height: 34px; align-items: center; min-width: 0; }
.mx .mx-b-spk > span { display: flex; gap: 2px; align-items: center; height: 100%; min-width: 0; }
.mx .mx-b-spk i { flex: 1; min-width: 2px; border-radius: 2px; background: var(--sc); opacity: .85; }
.mx .mx-b-spkl { display: grid; grid-template-columns: auto auto; gap: 2px 12px; font-size: 10.5px; color: var(--mu); flex: none; position: relative; padding-right: 50px; }
.mx .mx-b-spkl span { display: inline-flex; align-items: center; gap: 5px; }
.mx .mx-b-spkl i { width: 8px; height: 8px; border-radius: 2px; }
.mx .mx-b-spkl em { position: absolute; right: 0; top: 50%; transform: translateY(-50%); font: 600 12px/1 "IBM Plex Mono", monospace; font-style: normal; color: var(--tx); }
.mx .mx-b-sumul { list-style: none; margin: 0; padding: 0; }
.mx .mx-b-sumul li { position: relative; padding: 7px 0 7px 16px; border-top: 1px solid var(--bd2); font-size: 12.5px; line-height: 1.45; color: var(--tx2); }
.mx .mx-b-sumul li:first-child { border-top: 0; padding-top: 0; }
.mx .mx-b-sumul li::before { content: ""; position: absolute; left: 2px; top: 13px; width: 5px; height: 5px; border-radius: 50%; background: var(--ac); }
.mx .mx-b-sumul li:first-child::before { top: 6px; }
.mx .mx-b-sumul b { color: var(--tx); }
.mx .mx-b-dec { display: flex; gap: 8px; align-items: flex-start; background: #f3fbf7; border-radius: 8px; padding: 8px 10px; font-size: 12px; margin-top: auto; color: #065f46; }
.mx .mx-b-dec .mx-i { width: 14px; height: 14px; flex-shrink: 0; margin-top: 1px; }
.mx .mx-b-ai { display: grid; grid-template-columns: 18px minmax(0, 1fr) 84px 74px 18px; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--bd2); font-size: 12.5px; }
.mx .mx-b-c > header + .mx-b-ai { border-top: 0; }
.mx .mx-b-ai > b { font-weight: 550; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-ai .cb, .mx .mx-b-chk .cb { width: 17px; height: 17px; border-radius: 5px; border: 1.5px solid var(--bd3); display: grid; place-items: center; background: #fff; }
.mx .mx-b-ai.done .cb, .mx .mx-b-chk .done .cb { background: #12a26f; border-color: #12a26f; color: #fff; }
.mx .mx-b-ai .cb .mx-i, .mx .mx-b-chk .cb .mx-i { width: 11px; height: 11px; stroke-width: 2.8; }
.mx .mx-b-ai.done > b { color: var(--mu); text-decoration: line-through; }
.mx .mx-b-ai .as { display: inline-flex; gap: 5px; align-items: center; font-size: 11.5px; color: var(--tx2); }
.mx .mx-b-ai em { font-style: normal; font-size: 10.5px; font-weight: 600; background: #f2f4f7; color: var(--tx2); border-radius: 6px; padding: 3px 7px; text-align: center; }
.mx .mx-b-ai em.hot { background: var(--rds); color: #b42318; }
.mx .mx-b-ai .mx-appi, .mx .mx-b-ai .mx-fav { width: 16px; height: 16px; }
.mx .mx-b-per { align-items: center; text-align: center; gap: 7px; }
.mx .mx-b-per-i { width: 92px; height: 92px; border-radius: 50%; padding: 3px; background: linear-gradient(135deg, var(--ac), #7dd3fc); }
.mx .mx-b-per-i .mx-face { width: 86px; height: 86px; box-shadow: 0 0 0 3px #fff; }
.mx .mx-b-per > b { font-size: 17px; letter-spacing: -.01em; }
.mx .mx-b-per > small { font-size: 11.5px; color: var(--mu); margin-top: -4px; }
.mx .mx-b-per-t { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px; }
.mx .mx-b-q2 { font: italic 400 15.5px/1.35 "Instrument Serif", Georgia, serif; margin: 4px 0; color: var(--tx); }
.mx .mx-b-kv3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; width: 100%; }
.mx .mx-b-kv3 b { font-size: 12.5px; display: block; }
.mx .mx-b-chn { width: 100%; text-align: left; margin-top: auto; }
.mx .mx-b-chn small { font-size: 10.5px; color: var(--mu); font-weight: 600; margin-bottom: 5px; }
.mx .mx-b-chn > div { display: flex; gap: 5px; align-items: center; }
.mx .mx-b-chn span { font-size: 10.5px; color: var(--mu); margin-left: 4px; line-height: 1.3; }
.mx .mx-b-gl { list-style: none; margin: 0; padding: 0; }
.mx .mx-b-gl li { display: flex; gap: 8px; align-items: flex-start; padding: 5px 0; font-size: 12px; line-height: 1.4; color: var(--tx2); }
.mx .mx-b-gl li .mx-i { width: 14px; height: 14px; flex-shrink: 0; margin-top: 1px; stroke-width: 2.2; }
.mx .mx-b-gl.g li .mx-i { color: #12a26f; }
.mx .mx-b-gl.r li .mx-i { color: #f04438; }
.mx .mx-b-offer { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 14px; }
.mx .mx-b-offer .stack > div { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; border-top: 1px solid var(--bd2); font-size: 12px; }
.mx .mx-b-offer .stack > div:first-child { border-top: 0; }
.mx .mx-b-offer .stack span { display: flex; gap: 7px; align-items: center; }
.mx .mx-b-offer .stack .mx-i { width: 13px; height: 13px; color: #12a26f; stroke-width: 2.4; }
.mx .mx-b-offer .stack s { color: var(--mu2); font-variant-numeric: tabular-nums; }
.mx .mx-b-offer .px { background: linear-gradient(160deg, #1d2f4d, #0f1b2d); color: #fff; border-radius: 12px; padding: 12px 14px; display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.mx .mx-b-offer .px small { font-size: 10.5px; color: #9fb0c8; }
.mx .mx-b-offer .px b { font-size: 26px; letter-spacing: -.03em; }
.mx .mx-b-offer .px b span { font-size: 12px; color: #9fb0c8; font-weight: 500; }
.mx .mx-b-offer .px em { font-style: normal; font-size: 11px; color: #6ee7b7; line-height: 1.35; margin-bottom: 4px; }
.mx .mx-b-offer .px .mx-btn { background: #fff; color: var(--nv); border-color: #fff; }
.mx .mx-b-msgs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.mx .mx-b-msgs > div { background: #f8f9fb; border-radius: 8px; padding: 8px 10px; }
.mx .mx-b-msgs small { font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--ac); }
.mx .mx-b-msgs p { margin: 3px 0 0; font-size: 12px; font-weight: 600; line-height: 1.35; }
.mx .mx-b-paper.inv { padding: 16px 18px; }
.mx .mx-b-invh { display: flex; gap: 10px; align-items: center; }
.mx .mx-b-invh .mx-fav { width: 32px; height: 32px; }
.mx .mx-b-invh b { font-size: 13px; display: block; }
.mx .mx-b-invh small { font-size: 10px; color: var(--mu); }
.mx .mx-b-invh em { margin-left: auto; font-style: normal; font-size: 10.5px; font-weight: 750; letter-spacing: .14em; color: var(--mu); }
.mx .mx-b-invm { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 14px 0 8px; }
.mx .mx-b-invm small { font-size: 10px; color: var(--mu); }
.mx .mx-b-invm b { font-size: 12px; }
.mx .bx { border-radius: 3px; padding: 0 3px; }
.mx .bx.a { background: #dbeafe; box-shadow: 0 0 0 1.5px #60a5fa; }
.mx .bx.b { background: #fce7f3; box-shadow: 0 0 0 1.5px #f472b6; }
.mx .bx.c { background: #fef3c7; box-shadow: 0 0 0 1.5px #fbbf24; }
.mx .bx.d { background: #dcfce7; box-shadow: 0 0 0 1.5px #4ade80; }
.mx .mx-b-xf { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1px 8px; align-items: center; padding: 6px 8px; border-top: 1px solid var(--bd2); border-left: 3px solid transparent; }
.mx .mx-b-c > header + .mx-b-xf { border-top: 0; }
.mx .mx-b-xf small { grid-column: 1; font-size: 10px; color: var(--mu); }
.mx .mx-b-xf b { grid-column: 1; font-size: 12.3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-xf span { grid-column: 2; grid-row: 1 / span 2; font-size: 10.5px; font-weight: 650; color: #067647; background: var(--grs); border-radius: 999px; padding: 2px 7px; }
.mx .mx-b-xf span.lo { color: var(--am); background: var(--ams); }
.mx .mx-b-xf.a { border-left-color: #60a5fa; }
.mx .mx-b-xf.b { border-left-color: #f472b6; }
.mx .mx-b-xf.c { border-left-color: #fbbf24; }
.mx .mx-b-xf.d { border-left-color: #4ade80; }
.mx .mx-b-qi { display: flex; gap: 8px; align-items: flex-start; padding: 6px 0; border-top: 1px solid var(--bd2); }
.mx .mx-b-c > header + .mx-b-qi { border-top: 0; }
.mx .mx-b-qi b { font-size: 11.8px; display: block; }
.mx .mx-b-qi small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-hrs > div { display: grid; grid-template-columns: 160px minmax(0, 1fr) 38px; gap: 10px; align-items: center; padding: 5.5px 0; border-top: 1px solid var(--bd2); }
.mx .mx-b-hrs > div:first-child { border-top: 0; }
.mx .mx-b-hrs span { font-size: 12.3px; font-weight: 600; color: var(--tx); }
.mx .mx-b-hrs span small { font-size: 10.5px; font-weight: 400; color: var(--mu); }
.mx .mx-b-hrs > div > div { height: 12px; background: #f0f1f4; border-radius: 4px; overflow: hidden; }
.mx .mx-b-hrs i { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, var(--acl), var(--ac)); }
.mx .mx-b-hrs b { text-align: right; font-variant-numeric: tabular-nums; }
.mx .mx-b-mtx { position: relative; height: 262px; border: 1px solid var(--bd); border-radius: 10px; margin: 0 0 0 16px; background: linear-gradient(90deg, transparent calc(50% - .5px), var(--bd) calc(50% - .5px), var(--bd) calc(50% + .5px), transparent calc(50% + .5px)), linear-gradient(180deg, transparent calc(50% - .5px), var(--bd) calc(50% - .5px), var(--bd) calc(50% + .5px), transparent calc(50% + .5px)), linear-gradient(135deg, var(--acs) 0 50%, #fff 50%); }
.mx .mx-b-mtx > span { position: absolute; font-size: 9.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--mu2); }
.mx .mx-b-mtx .ql { left: 8px; top: 7px; color: var(--ac2); }
.mx .mx-b-mtx .qr { right: 8px; top: 7px; }
.mx .mx-b-mtx .bl { left: 8px; bottom: 7px; }
.mx .mx-b-mtx .br { right: 8px; bottom: 7px; }
.mx .mx-b-mtx > i { position: absolute; width: 12px; height: 12px; border-radius: 50%; background: #98a2b3; transform: translate(-50%, -50%); box-shadow: 0 0 0 3px #fff; }
.mx .mx-b-mtx > i.q { background: var(--ac); box-shadow: 0 0 0 3px #fff, 0 0 0 5px color-mix(in srgb, var(--ac) 30%, transparent); }
.mx .mx-b-mtx > i b { position: absolute; left: 14px; top: -3px; font-size: 10.5px; white-space: nowrap; color: var(--tx); font-style: normal; }
.mx .mx-b-mtx em { position: absolute; font-style: normal; font-size: 10px; color: var(--mu); }
.mx .mx-b-mtx .ax1 { bottom: -16px; left: 50%; transform: translateX(-50%); }
.mx .mx-b-mtx .ax2 { left: -14px; top: 50%; transform: translateX(-50%) rotate(-90deg); }
.mx .mx-b-paper.pol { padding: 18px 22px; }
.mx .mx-b-clause { font-size: 12.2px; line-height: 1.55; padding: 4px 0; color: var(--tx2); }
.mx .mx-b-clause b { color: var(--tx); }
.mx .mx-b-paper.pol .mx-b-t { margin-top: 6px; }
.mx .mx-b-cls { font-size: 10.5px; font-weight: 650; border-radius: 999px; padding: 2px 8px; }
.mx .mx-b-cls.pub { background: var(--grs); color: #067647; }
.mx .mx-b-cls.int { background: var(--bls); color: #2f54d6; }
.mx .mx-b-cls.con { background: var(--rds); color: #b42318; }
.mx .mx-b-tools > div { display: flex; gap: 9px; align-items: center; padding: 5.5px 0; border-top: 1px solid var(--bd2); font-size: 12px; }
.mx .mx-b-tools > div:first-child { border-top: 0; }
.mx .mx-b-tools > div > span:nth-child(2) { flex: 1; }
.mx .mx-b-tools > div.n > span:nth-child(2) { color: var(--mu); }
.mx .mx-b-tools .mx-b-ico { width: 20px; height: 20px; background: none; }
.mx .mx-b-tools .mx-b-ico .mx-i { width: 16px; height: 16px; }
.mx .mx-b-ack { display: flex; gap: 12px; align-items: center; }
.mx .mx-b-ack > div { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.mx .mx-b-ack b { font-size: 14px; }
.mx .mx-b-ack small { font-size: 11px; color: var(--mu); }
.mx .mx-b-pend { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.mx .mx-b-pend span { display: inline-flex; gap: 5px; align-items: center; font-size: 11px; background: #fffaf0; border: 1px solid #fcd9a8; border-radius: 999px; padding: 2px 9px 2px 3px; color: var(--tx2); }

/* ---------- forms (full frame) ---------- */
.mx .mx-b-wz { display: grid; grid-template-columns: 250px minmax(0, 1fr); height: 100%; background: #fff; }
.mx .mx-b-wz.rail { grid-template-columns: 250px minmax(0, 1fr) 300px; }
.mx .mx-b-wz > aside { background: radial-gradient(120% 60% at 0% 100%, rgba(18, 162, 111, .22), transparent 60%), linear-gradient(180deg, #0f1b2d, #0a1322); color: #cbd5e1; padding: 20px 16px 16px; display: flex; flex-direction: column; gap: 18px; min-height: 0; overflow: hidden; }
.mx .mx-b-wz > aside .mx-org { display: flex; gap: 10px; align-items: center; }
.mx .mx-b-wz > aside .mx-org b { color: #fff; font-size: 14px; display: block; }
.mx .mx-b-wz > aside .mx-org small { color: #8fa0bd; font-size: 11px; }
.mx .mx-b-wsteps { display: flex; flex-direction: column; gap: 2px; }
.mx .mx-b-wsteps > div { display: flex; gap: 10px; align-items: center; padding: 8px; border-radius: 10px; }
.mx .mx-b-wsteps span { width: 24px; height: 24px; border-radius: 50%; border: 1.5px solid rgba(255, 255, 255, .22); display: grid; place-items: center; font-size: 11px; font-weight: 650; flex-shrink: 0; color: #8fa0bd; }
.mx .mx-b-wsteps b { font-size: 12.5px; color: #e2e8f0; display: block; font-weight: 550; }
.mx .mx-b-wsteps small { font-size: 10.5px; color: #7d8ca6; }
.mx .mx-b-wsteps .done span { background: #12a26f; border-color: #12a26f; color: #fff; }
.mx .mx-b-wsteps .done span .mx-i { width: 12px; height: 12px; stroke-width: 2.6; }
.mx .mx-b-wsteps .now { background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08); }
.mx .mx-b-wsteps .now span { background: #fff; border-color: #fff; color: #0f1b2d; }
.mx .mx-b-wsteps .now b { color: #fff; font-weight: 650; }
.mx .mx-b-wprog > div:first-child { display: flex; justify-content: space-between; font-size: 11px; }
.mx .mx-b-wprog small { color: #8fa0bd; }
.mx .mx-b-wprog b { color: #fff; }
.mx .mx-b-wprog .mx-b-pb { background: rgba(255, 255, 255, .12); }
.mx .mx-b-wprog .mx-b-pb i { background: linear-gradient(90deg, #6ee7b7, #12a26f); }
.mx .mx-b-helpc { margin-top: auto; display: flex; gap: 10px; align-items: center; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .08); border-radius: 12px; padding: 10px; }
.mx .mx-b-helpc .mx-face { width: 34px; height: 34px; }
.mx .mx-b-helpc b { color: #fff; font-size: 12px; display: block; }
.mx .mx-b-helpc small { color: #8fa0bd; font-size: 10.5px; }
.mx .mx-b-wz > main { padding: 30px 36px 24px; display: flex; flex-direction: column; gap: 12px; min-height: 0; overflow: hidden; }
.mx .mx-b-wz > main h4 { font-size: 25px; font-weight: 650; letter-spacing: -.025em; margin: 0; }
.mx .mx-b-wz > main > p { margin: -4px 0 4px; font-size: 13px; }
.mx .mx-b-conn { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.mx .mx-b-conn > div { display: flex; gap: 10px; align-items: center; border: 1px solid var(--bd); border-radius: 12px; padding: 11px 12px; box-shadow: var(--sh1); min-width: 0; }
.mx .mx-b-conn > div > div { flex: 1; min-width: 0; }
.mx .mx-b-conn b { font-size: 12.5px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-conn small { font-size: 10.5px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-conn .ok { background: #f7fdfa; border-color: #c9ecd9; }
.mx .mx-b-conn .pend { background: #fffcf5; border-color: #fbe3b8; }
.mx .mx-b-conn .mx-appi.lg { width: 34px; height: 34px; }
.mx .mx-b-upl { display: flex; gap: 12px; align-items: center; border: 1.5px dashed var(--bd3); border-radius: 12px; padding: 11px 14px; }
.mx .mx-b-upl > .mx-i { width: 20px; height: 20px; color: var(--mu); }
.mx .mx-b-upl > div { flex: 1; }
.mx .mx-b-upl b { font-size: 12.5px; display: block; }
.mx .mx-b-upl small { font-size: 11px; color: var(--mu); }
.mx .mx-b-upl > span { display: flex; gap: 4px; }
.mx .mx-b-upl.now { border-color: color-mix(in srgb, var(--ac) 55%, #fff); background: var(--acs); }
.mx .mx-b-upl.now > .mx-i { color: var(--ac); }
.mx .mx-b-wf { display: flex; gap: 10px; align-items: center; margin-top: auto; padding-top: 12px; border-top: 1px solid var(--bd2); }
.mx .mx-b-wf small { flex: 1; text-align: center; color: var(--mu); font-size: 11px; }
.mx .mx-b-wf .mx-btn .mx-i { width: 13px; height: 13px; }
.mx .mx-b-wrail { background: #f7f8fa; border-left: 1px solid var(--bd); padding: 24px 18px; display: flex; flex-direction: column; gap: 16px; min-height: 0; overflow: hidden; }
.mx .mx-b-kick { background: linear-gradient(150deg, #1d2f4d, #0f1b2d); color: #fff; border-radius: 14px; padding: 14px; box-shadow: var(--sh3); }
.mx .mx-b-kick > small { font-size: 10px; letter-spacing: .12em; font-weight: 700; color: #6ee7b7; }
.mx .mx-b-kick > b { font-size: 19px; display: block; letter-spacing: -.02em; margin-top: 2px; }
.mx .mx-b-kick > span { font-size: 11.5px; color: #b6c2d6; }
.mx .mx-b-kick > div { display: flex; gap: 8px; align-items: center; margin-top: 10px; }
.mx .mx-b-kick > div small { font-size: 11px; color: #b6c2d6; }
.mx .mx-b-kick .mx-avs .mx-av { box-shadow: 0 0 0 2px #1d2f4d; }
.mx .mx-b-rl2 > small { font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); margin-bottom: 2px; }
.mx .mx-b-rl2 .mx-b-li .mx-tag { font-size: 10px; padding: 0 7px; }
.mx .mx-b-quiz { height: 100%; display: flex; flex-direction: column; background: radial-gradient(70% 60% at 85% 20%, rgba(18, 162, 111, .08), transparent 60%), #fbf9f5; }
.mx .mx-b-quiz > header { display: flex; align-items: center; gap: 10px; padding: 16px 30px; border-bottom: 1px solid #ece7dd; flex-shrink: 0; }
.mx .mx-b-quiz > header b { font-size: 14px; }
.mx .mx-b-quiz > header .t { color: var(--mu); font-size: 12.5px; padding-left: 12px; margin-left: 2px; border-left: 1px solid #e3ddd1; }
.mx .mx-b-qp { display: flex; gap: 4px; margin-left: auto; }
.mx .mx-b-qp i { width: 28px; height: 5px; border-radius: 3px; background: #e7e2d8; }
.mx .mx-b-qp i.d { background: var(--ac); }
.mx .mx-b-qp i.n { background: linear-gradient(90deg, var(--ac) 50%, #e7e2d8 50%); }
.mx .mx-b-quiz > header > small { color: var(--mu); font-size: 11.5px; }
.mx .mx-b-quiz > main { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 48px; align-items: center; padding: 20px 60px; }
.mx .mx-b-qq > small { display: flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 650; color: var(--ac); }
.mx .mx-b-qq > small .mx-i { width: 13px; height: 13px; }
.mx .mx-b-qq h3 { font-size: 31px; line-height: 1.15; letter-spacing: -.025em; margin: 8px 0 8px; font-weight: 650; color: #13201b; }
.mx .mx-b-qq > p { font-size: 14px; color: var(--mu); margin: 0; }
.mx .mx-b-qa { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 22px 0 18px; }
.mx .mx-b-qa > div { display: flex; gap: 12px; align-items: center; background: #fff; border: 1.5px solid #e3ddd1; border-radius: 12px; padding: 12px 14px; }
.mx .mx-b-qa kbd { width: 26px; height: 26px; border-radius: 6px; display: grid; place-items: center; font: 700 12px/1 Inter, sans-serif; background: #f4f1ea; border: 1px solid #e3ddd1; color: var(--tx2); flex-shrink: 0; }
.mx .mx-b-qa > div > div { flex: 1; }
.mx .mx-b-qa b { font-size: 15px; display: block; }
.mx .mx-b-qa small { font-size: 11.5px; color: var(--mu); }
.mx .mx-b-qa > div.on { border-color: var(--ac); background: var(--acs); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ac) 14%, transparent); }
.mx .mx-b-qa > div.on kbd { background: var(--ac); color: #fff; border-color: var(--ac); }
.mx .mx-b-qa > div.on > .mx-i { color: var(--ac); width: 18px; height: 18px; stroke-width: 2.4; }
.mx .mx-b-qf { display: flex; gap: 12px; align-items: center; }
.mx .mx-b-qf .mx-btn { color: #fff; background: linear-gradient(180deg, #1fb07d, var(--ac)); border-color: #0d8a5d; height: 38px; padding: 0 18px; font-size: 13.5px; }
.mx .mx-b-qf small { font-size: 12px; color: var(--mu); }
.mx .mx-b-qf span { margin-left: auto; color: var(--mu2); }
.mx .mx-b-qs { background: #fff; border: 1px solid #ece7dd; border-radius: 18px; box-shadow: 0 24px 50px -30px rgba(19, 32, 27, .35); padding: 18px; display: flex; flex-direction: column; gap: 10px; }
.mx .mx-b-qs > small { font-size: 10.5px; letter-spacing: .12em; font-weight: 700; color: var(--mu); }
.mx .mx-b-qsr { display: flex; gap: 14px; align-items: center; margin-bottom: 4px; }
.mx .mx-b-qsr .mx-b-ring b { font-size: 26px; }
.mx .mx-b-qsr .mx-b-ring circle { stroke-width: 4.5; }
.mx .mx-b-qsr > div b { font-size: 16px; display: block; }
.mx .mx-b-qsr > div small { font-size: 11.5px; color: var(--mu); }
.mx .mx-b-qs .mx-b-scr { grid-template-columns: 90px minmax(0, 1fr) 72px; }
.mx .mx-b-qs p { display: flex; gap: 7px; align-items: flex-start; font-size: 11.8px; line-height: 1.45; color: var(--tx2); background: #f8f7f3; border-radius: 10px; padding: 9px 10px; margin: 4px 0 0; }
.mx .mx-b-qs p .mx-i { width: 13px; height: 13px; color: var(--ac); flex-shrink: 0; margin-top: 1px; }
.mx .mx-b-quiz > footer { display: flex; gap: 30px; justify-content: center; align-items: center; padding: 14px; border-top: 1px solid #ece7dd; font-size: 12px; color: var(--mu); flex-shrink: 0; }
.mx .mx-b-quiz > footer span { display: inline-flex; align-items: center; gap: 7px; }
.mx .mx-b-quiz > footer .mx-i { width: 14px; height: 14px; }
.mx .mx-b-calc { height: 100%; display: flex; flex-direction: column; background: #f3f6f4; }
.mx .mx-b-calc > header { display: flex; align-items: center; gap: 22px; padding: 13px 28px; background: #fff; border-bottom: 1px solid var(--bd); flex-shrink: 0; }
.mx .mx-b-calc > header .lg { display: flex; gap: 8px; align-items: center; }
.mx .mx-b-calc > header .lg b { font-size: 15px; }
.mx .mx-b-calc > header nav { display: flex; gap: 20px; margin-left: auto; font-size: 12.5px; color: var(--tx2); }
.mx .mx-b-cs { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 14px; flex-shrink: 0; }
.mx .mx-b-cs > span { display: inline-flex; gap: 8px; align-items: center; font-size: 12.5px; font-weight: 600; color: var(--mu); }
.mx .mx-b-cs > span i { width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid var(--bd3); display: grid; place-items: center; font-style: normal; font-size: 11px; background: #fff; }
.mx .mx-b-cs > span i .mx-i { width: 12px; height: 12px; stroke-width: 2.6; }
.mx .mx-b-cs > span.d { color: var(--tx); }
.mx .mx-b-cs > span.d i { background: var(--ac); border-color: var(--ac); color: #fff; }
.mx .mx-b-cs > span.n { color: var(--tx); }
.mx .mx-b-cs > span.n i { border-color: var(--ac); color: var(--ac); box-shadow: 0 0 0 3px var(--acs); }
.mx .mx-b-cs > em { width: 44px; height: 2px; background: #dfe3e8; }
.mx .mx-b-calc > main { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px; padding: 0 44px 26px; }
.mx .mx-b-cin { background: #fff; border: 1px solid var(--bd); border-radius: 18px; box-shadow: var(--sh2); padding: 22px 24px; display: flex; flex-direction: column; gap: 16px; min-height: 0; overflow: hidden; }
.mx .mx-b-cin h3 { font-size: 22px; font-weight: 650; letter-spacing: -.02em; margin: 0; }
.mx .mx-b-cin > p { color: var(--mu); margin: -12px 0 0; font-size: 12.5px; }
.mx .mx-b-sli > div:first-child { display: flex; justify-content: space-between; align-items: baseline; }
.mx .mx-b-sli > div:first-child b { font-size: 13px; }
.mx .mx-b-sli .v { font-size: 20px; font-weight: 700; color: var(--ac2); letter-spacing: -.02em; }
.mx .mx-b-sli .tr { position: relative; height: 8px; background: #e9edf0; border-radius: 999px; margin: 14px 0 6px; }
.mx .mx-b-sli .tr i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 999px; background: linear-gradient(90deg, var(--acl), var(--ac)); }
.mx .mx-b-sli .tr b { position: absolute; top: 50%; width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 3px solid var(--ac); transform: translate(-50%, -50%); box-shadow: 0 2px 6px rgba(16, 24, 40, .2); }
.mx .mx-b-sli .tr b em { position: absolute; bottom: 26px; left: 50%; transform: translateX(-50%); background: #0f1b2d; color: #fff; font-style: normal; font-size: 11px; font-weight: 650; padding: 3px 7px; border-radius: 6px; white-space: nowrap; }
.mx .mx-b-sli .tk { display: flex; justify-content: space-between; }
.mx .mx-b-sli .tk small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-sli.sm .tr { margin: 9px 0 2px; }
.mx .mx-b-sli.sm .v { font-size: 16px; }
.mx .mx-b-opt > b { font-size: 13px; display: block; margin-bottom: 8px; }
.mx .mx-b-opt > div { display: flex; gap: 8px; flex-wrap: wrap; }
.mx .mx-b-opt span { display: inline-flex; gap: 7px; align-items: center; border: 1.5px solid #dfe3e8; border-radius: 10px; padding: 7px 12px; font-size: 12.5px; font-weight: 600; background: #fff; color: var(--tx2); }
.mx .mx-b-opt span .mx-i { width: 18px; height: 18px; }
.mx .mx-b-opt span.on { border-color: var(--ac); background: var(--acs); color: var(--ac2); }
.mx .mx-b-opt span.in { font-weight: 550; min-width: 220px; }
.mx .mx-b-res { background: radial-gradient(90% 60% at 100% 0%, rgba(52, 211, 153, .22), transparent 60%), linear-gradient(160deg, #0b3b2c, #0f1b2d 70%); color: #fff; border-radius: 18px; padding: 22px 24px; display: flex; flex-direction: column; gap: 13px; box-shadow: 0 30px 50px -30px rgba(11, 59, 44, .8); min-height: 0; overflow: hidden; }
.mx .mx-b-res > small { font-size: 10.5px; letter-spacing: .12em; font-weight: 700; color: #6ee7b7; }
.mx .mx-b-res h3 { font-size: 22px; font-weight: 550; margin: -6px 0 0; letter-spacing: -.02em; line-height: 1.2; }
.mx .mx-b-res h3 b { color: #6ee7b7; font-size: 34px; font-weight: 700; letter-spacing: -.03em; }
.mx .mx-b-sys { display: flex; gap: 6px; flex-wrap: wrap; }
.mx .mx-b-sys span { display: inline-flex; gap: 5px; align-items: center; font-size: 11.5px; background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .12); border-radius: 999px; padding: 3px 10px; }
.mx .mx-b-sys .mx-i { width: 13px; height: 13px; color: #fde68a; }
.mx .mx-b-pay > div:first-child { display: flex; justify-content: space-between; align-items: baseline; }
.mx .mx-b-pay small { font-size: 11px; color: #a7b8cc; }
.mx .mx-b-pay b { font-size: 15px; }
.mx .mx-b-pay .bar { position: relative; height: 8px; background: rgba(255, 255, 255, .12); border-radius: 999px; margin: 7px 0 4px; }
.mx .mx-b-pay .bar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 999px; background: linear-gradient(90deg, #a7f3d0, #34d399); }
.mx .mx-b-pay .bar span { position: absolute; top: -3px; width: 2px; height: 14px; background: #fff; }
.mx .mx-b-pay .tk { display: flex; justify-content: space-between; }
.mx .mx-b-ten > small { font-size: 11px; color: #a7b8cc; }
.mx .mx-b-ten > b { font-size: 18px; display: block; }
.mx .mx-b-res .mx-b-vb i { background: rgba(110, 231, 183, .3); }
.mx .mx-b-res .mx-b-vb .hi i { background: linear-gradient(180deg, #a7f3d0, #34d399); }
.mx .mx-b-res .mx-b-vb small { color: rgba(255, 255, 255, .5); font-size: 9.5px; }
.mx .mx-b-res .mx-b-vb { padding-top: 4px; }
.mx .mx-b-res > .mx-btn { height: 40px; justify-content: center; font-size: 13.5px; margin-top: auto; }
.mx .mx-b-res > p { margin: -4px 0 0; font-size: 11px; color: #8fa0bd; text-align: center; }
.mx .mx-b-chk > div { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto 22px; gap: 10px; align-items: center; padding: 7.5px 10px; border-top: 1px solid var(--bd2); font-size: 12.5px; }
.mx .mx-b-chk > div:first-child { border-top: 0; }
.mx .mx-b-chk em { font-style: normal; font-size: 11px; color: var(--mu); }
.mx .mx-b-chk .done > b { color: var(--mu); text-decoration: line-through; font-weight: 500; }
.mx .mx-b-chk .now { background: #fffbf2; border-radius: 8px; box-shadow: inset 0 0 0 1px #fbe3b8; }
.mx .mx-b-chk .now em { color: var(--am); font-weight: 600; }
.mx .mx-b-chk .mx-av { width: 20px; height: 20px; }
.mx .mx-b-mod2 { display: flex; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--bd2); position: relative; }
.mx .mx-b-rl2 > small + .mx-b-mod2 { border-top: 0; }
.mx .mx-b-mod2-i { width: 76px; height: 48px; min-height: 0; border-radius: 8px; flex: none; }
.mx .mx-b-mod2 .pl { position: absolute; left: 27px; top: 50%; width: 22px; height: 22px; border-radius: 50%; background: rgba(15, 23, 42, .6); color: #fff; display: grid; place-items: center; transform: translateY(-50%); z-index: 3; backdrop-filter: blur(2px); }
.mx .mx-b-mod2 .pl .mx-i { width: 9px; height: 9px; fill: currentColor; stroke: none; }
.mx .mx-b-mod2 > div { flex: 1; min-width: 0; }
.mx .mx-b-mod2 b { font-size: 12px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-mod2 small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-mcc { display: flex; flex-direction: column; min-height: 0; }
.mx .mx-b-mcc-b { flex: 1; min-height: 0; background: #fff; border: 1px solid var(--bd); border-radius: 16px; box-shadow: 0 24px 48px -26px rgba(16, 24, 40, .35); padding: 20px 24px; display: flex; flex-direction: column; gap: 14px; overflow: hidden; }
.mx .mx-b-mcc-b h3 { font-size: 21px; font-weight: 650; letter-spacing: -.02em; margin: 0; }
.mx .mx-b-lost { background: linear-gradient(180deg, #fff5f4, #fff); border: 1px solid #f8c9c3; border-radius: 12px; padding: 12px 16px; }
.mx .mx-b-lost small { font-size: 11.5px; color: var(--mu); }
.mx .mx-b-lost b { display: block; font-size: 32px; font-weight: 750; color: #d92d20; letter-spacing: -.03em; line-height: 1.1; }
.mx .mx-b-lost span { font-size: 12px; color: var(--tx2); }
.mx .mx-b-cap { display: flex; gap: 8px; }
.mx .mx-b-cap > span:not(.mx-btn) { flex: 1; border: 1px solid var(--bd); border-radius: 8px; padding: 6px 10px; color: var(--mu2); background: #fafbfc; font-size: 12px; }

/* ---------- motion ---------- */
@keyframes mxbSpin { to { transform: rotate(360deg); } }
@keyframes mxbRing { 0% { transform: scale(.9); opacity: .9; } 100% { transform: scale(1.18); opacity: 0; } }
@keyframes mxbPulse { 50% { opacity: .35; } }
@keyframes mxbDash { to { stroke-dashoffset: -18; } }

/* ---------- round 1 refinements ---------- */
.mx .mx-b-sender { display: flex; gap: 10px; align-items: center; margin: auto 16px 14px; padding-top: 12px; border-top: 1px solid var(--bd2); }
.mx .mx-b-sender > div { flex: 1; min-width: 0; }
.mx .mx-b-sender b { font-size: 12px; display: block; }
.mx .mx-b-sender small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-sender > span { text-align: right; padding-left: 12px; border-left: 1px solid var(--bd2); }
.mx .mx-b-sender > span b { font-size: 13px; }
.mx .mx-b-lf { margin-top: auto; display: flex; justify-content: space-between; align-items: center; padding: 6px 4px 0; font-size: 11px; color: var(--mu); }
.mx .mx-b-lf b { font-size: 12.5px; color: var(--tx); }
.mx .mx-b-acts { display: flex; flex-direction: column; gap: 5px; margin-top: auto; }
.mx .mx-b-acts > small, .mx .mx-b-also > small, .mx .mx-b-chap > small, .mx .mx-b-trig2 > small, .mx .mx-b-also2 > small, .mx .mx-b-road > small, .mx .mx-b-hist > small, .mx .mx-b-sign > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); margin-bottom: 2px; }
.mx .mx-b-acts span { display: flex; gap: 6px; align-items: center; font-size: 11.5px; color: #067647; background: var(--grs); border-radius: 7px; padding: 5px 8px; }
.mx .mx-b-acts .mx-i { width: 12px; height: 12px; }
.mx .mx-b-also { margin-top: 12px; }
.mx .mx-b-also > div { display: flex; gap: 8px; align-items: center; padding: 6px 0; border-top: 1px solid var(--bd2); font-size: 12px; }
.mx .mx-b-also > div .mx-dot { margin: 0; width: 7px; height: 7px; }
.mx .mx-b-also > div small { margin-left: auto; font-size: 11px; color: var(--mu); }
.mx .mx-b-conf { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.mx .mx-b-conf > span { display: inline-flex; gap: 5px; align-items: center; font-size: 11px; color: var(--tx2); background: #f2f4f7; border-radius: 999px; padding: 2px 9px; }
.mx .mx-b-conf .mx-dot { margin: 0; width: 7px; height: 7px; box-shadow: none; }
.mx .mx-b-log > div.kv { grid-template-columns: 62px minmax(0, 1fr); }
.mx .mx-b-log > div.kv em { background: #f2f4f7; color: var(--tx2); }
.mx .mx-b-recd { display: flex; gap: 8px; align-items: center; padding-bottom: 8px; border-bottom: 1px solid var(--bd2); margin-bottom: 4px; }
.mx .mx-b-recd b { font-size: 12px; display: block; }
.mx .mx-b-recd small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-hist { width: 100%; margin-top: auto; padding-top: 10px; border-top: 1px solid var(--bd2); text-align: left; }
.mx .mx-b-srcs2 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: auto; padding-top: 12px; }
.mx .mx-b-srcs2 > div { display: flex; gap: 8px; align-items: center; border: 1px solid var(--bd); border-radius: 10px; padding: 8px 10px; }
.mx .mx-b-srcs2 span { flex: 1; font-size: 11.5px; color: var(--tx2); line-height: 1.25; }
.mx .mx-b-srcs2 b { font-size: 14px; }
.mx .mx-b-chap { margin-top: 12px; }
.mx .mx-b-chap span { display: flex; gap: 10px; align-items: center; padding: 5px 0; border-top: 1px solid var(--bd2); font-size: 12px; color: var(--tx2); }
.mx .mx-b-chap time { font: 500 10.5px/1 "IBM Plex Mono", monospace; color: var(--ac2); background: var(--acs); border-radius: 4px; padding: 2px 5px; }
.mx .mx-b-trig2 { width: 100%; text-align: left; margin-top: 4px; }
.mx .mx-b-trig2 > div { display: flex; flex-wrap: wrap; gap: 4px; }
.mx .mx-b-msgs em { display: block; font-style: normal; font-size: 10.5px; font-weight: 650; color: var(--ac2); margin-top: 6px; }
.mx .mx-b-msgs .mx-b-pb { height: 5px; }
.mx .mx-b-brk { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.mx .mx-b-brk > div { background: #f8f9fb; border-radius: 8px; padding: 7px 9px; }
.mx .mx-b-brk small { font-size: 10px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-brk b { font-size: 15px; }
.mx .mx-b-mcc-b .mx-b-cap { margin-top: auto; }
.mx .mx-b-also2 { margin-top: 14px; }
.mx .mx-b-also2 .mx-b-li-r .mx-i { width: 14px; height: 14px; color: #12a26f; stroke-width: 2.4; }
.mx .mx-b-pom { display: flex; gap: 8px; align-items: center; margin-top: 12px; background: #f3fbf7; border: 1px solid #b7e4cc; border-radius: 8px; padding: 8px 10px; font-size: 11.5px; color: var(--tx2); }
.mx .mx-b-pom > .mx-i { width: 14px; height: 14px; color: #12a26f; stroke-width: 2.4; flex-shrink: 0; }
.mx .mx-b-bmx { display: flex; justify-content: space-between; font-size: 9.5px; color: var(--mu2); padding: 2px 12px 0; }
.mx .mx-b-pron { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; padding: 12px 20px 0; }
.mx .mx-b-pron span { display: inline-flex; gap: 5px; align-items: center; font-size: 11px; background: #f8f9fb; border: 1px solid var(--bd); border-radius: 999px; padding: 2px 9px; }
.mx .mx-b-pron em { font: 500 10px/1 "IBM Plex Mono", monospace; color: var(--ac2); font-style: normal; }
.mx .mx-b-pron .mx-i { width: 11px; height: 11px; color: #12a26f; stroke-width: 2.4; }
.mx .mx-b-pron small { margin-left: auto; font-size: 10.5px; color: var(--mu); }
.mx .mx-b-newv { margin-top: auto; display: flex; gap: 10px; align-items: center; border: 1.5px dashed var(--bd3); border-radius: 10px; padding: 9px 10px; }
.mx .mx-b-newv > .mx-i { width: 26px; height: 26px; padding: 6px; border-radius: 50%; background: var(--acs); color: var(--ac); }
.mx .mx-b-newv b { font-size: 12.5px; display: block; }
.mx .mx-b-newv small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-road { margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--bd2); }
.mx .mx-b-road > div { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 8px; align-items: center; padding: 4px 0; }
.mx .mx-b-road em { font-style: normal; font-size: 10.5px; font-weight: 650; color: var(--ac2); background: var(--acs); border-radius: 5px; padding: 2px 6px; text-align: center; }
.mx .mx-b-road span { font-size: 12px; font-weight: 550; }
.mx .mx-b-appr { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--bd2); }
.mx .mx-b-appr .mx-sig { position: static; display: block; font-size: 28px; color: #1d3a8a; line-height: 1; }
.mx .mx-b-appr small { font-size: 10.5px; color: var(--mu); margin-top: 4px; }
.mx .mx-b-pv { background: #f8f9fb; border-radius: 10px; padding: 8px 12px 24px; }
.mx .mx-b-pv > small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-pv .ax { position: relative; height: 18px; border-bottom: 2px solid #dbe3f0; margin: 16px 6px 0; }
.mx .mx-b-pv .ax i { position: absolute; bottom: -6px; width: 10px; height: 10px; border-radius: 50%; background: #2e6ff2; box-shadow: 0 0 0 2px #f8f9fb; transform: translateX(-50%); }
.mx .mx-b-pv .ax i:last-child { background: #f04438; }
.mx .mx-b-pv .ax em { position: absolute; top: 12px; left: 50%; transform: translateX(-50%); font-style: normal; font-size: 9.5px; color: var(--mu); white-space: nowrap; }
.mx .mx-b-adc { display: flex; flex-direction: column; gap: 7px; }
.mx .mx-b-adc > div { display: flex; gap: 9px; align-items: center; }
.mx .mx-b-adc-i { width: 46px; height: 34px; min-height: 0; flex: none; border-radius: 6px; }
.mx .mx-b-adc > div > div { flex: 1; display: grid; grid-template-columns: 1fr auto; gap: 1px 8px; align-items: center; }
.mx .mx-b-adc small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-adc b { font-size: 12.5px; text-align: right; }
.mx .mx-b-adc span { grid-column: span 2; height: 5px; background: #eef0f3; border-radius: 999px; overflow: hidden; }
.mx .mx-b-adc span i { display: block; height: 100%; background: linear-gradient(90deg, var(--acl), var(--ac)); }
.mx .mx-b-adc span.gy i { background: #b3bcc9; }
.mx .mx-b-adc .cap { font-size: 10px; color: var(--mu2); }
.mx .mx-b-debt > div { display: flex; gap: 8px; align-items: center; padding: 7px 0; border-top: 1px solid var(--bd2); }
.mx .mx-b-debt > div:first-child { border-top: 0; }
.mx .mx-b-debt .mx-fav { width: 22px; height: 22px; }
.mx .mx-b-debt b { flex: 1; font-size: 12px; }
.mx .mx-b-debt em { font-style: normal; font-size: 10.5px; font-weight: 650; color: #b42318; background: var(--rds); border-radius: 999px; padding: 1px 7px; }
.mx .mx-b-debt span { font-size: 12.5px; font-weight: 650; min-width: 52px; text-align: right; }
.mx .mx-b-trust { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.mx .mx-b-trust > div { display: flex; gap: 9px; align-items: flex-start; border: 1px solid var(--bd2); background: #fafbfc; border-radius: 12px; padding: 10px; }
.mx .mx-b-trust b { font-size: 12px; display: block; }
.mx .mx-b-trust small { font-size: 10.5px; color: var(--mu); line-height: 1.35; }
.mx .mx-b-pay2 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: auto 22px 16px; border: 1px solid var(--bd); border-radius: 10px; overflow: hidden; }
.mx .mx-b-pay2 > div { padding: 8px 12px; border-left: 1px solid var(--bd2); position: relative; }
.mx .mx-b-pay2 > div:first-child { border-left: 0; background: var(--acs); }
.mx .mx-b-pay2 small { font-size: 10px; color: var(--mu); }
.mx .mx-b-pay2 b { font-size: 13px; display: block; }
.mx .mx-b-pay2 em { position: absolute; right: 10px; top: 8px; font-style: normal; font-size: 10px; font-weight: 700; color: var(--ac2); }
.mx .mx-b-toc { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.mx .mx-b-toc span { display: inline-flex; gap: 5px; align-items: center; font-size: 11.5px; color: var(--tx2); background: #f8f9fb; border: 1px solid var(--bd2); border-radius: 6px; padding: 3px 8px; }
.mx .mx-b-toc .mx-i { width: 12px; height: 12px; color: #12a26f; stroke-width: 2.4; }
.mx .mx-b-clp { font-size: 12.3px; line-height: 1.6; color: var(--tx2); margin: 0; }
.mx .mx-b-seq.cmp .mx-b-ss { padding: 6px 10px; margin-top: 6px; }
.mx .mx-b-seq.cmp .mx-b-ss small { font-size: 9.5px; }
.mx .mx-b-seq.cmp .mx-b-ssm { margin-top: 1px; }
.mx .mx-b-seq.cmp .mx-b-trig { padding: 6px 10px; }
.mx .mx-b-seq.cmp .mx-b-exit { margin-top: 6px; padding: 6px 10px; }
.mx .mx-b-row3 { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: end; }
.mx .mx-b-tog > b { font-size: 13px; display: block; margin-bottom: 8px; }
.mx .mx-b-tog > div { display: flex; gap: 8px; align-items: center; height: 36px; }
.mx .mx-b-tog .sw { position: relative; width: 40px; height: 22px; border-radius: 999px; background: #d0d5dd; flex-shrink: 0; }
.mx .mx-b-tog .sw i { position: absolute; left: 2px; top: 2px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(16, 24, 40, .25); }
.mx .mx-b-tog small { font-size: 11px; color: var(--mu); white-space: nowrap; }
.mx .mx-b-opt span.in { min-width: 0; }
.mx .mx-b-foot2 { margin: auto 0 0; display: flex; gap: 6px; align-items: center; font-size: 11.5px; color: var(--mu); border-top: 1px solid var(--bd2); padding-top: 12px; }
.mx .mx-b-bill { display: flex; gap: 12px; align-items: center; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); border-radius: 12px; padding: 10px 14px; }
.mx .mx-b-bill > div { flex: 1; }
.mx .mx-b-bill small { font-size: 10.5px; color: #a7b8cc; }
.mx .mx-b-bill b { display: block; font-size: 20px; letter-spacing: -.02em; }
.mx .mx-b-bill b.g { color: #6ee7b7; }
.mx .mx-b-bill span { font-size: 10.5px; color: #8fa0bd; }
.mx .mx-b-bill > .mx-i { color: #8fa0bd; }
.mx .mx-b-kit { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.mx .mx-b-kit > div { display: flex; gap: 9px; align-items: center; border: 1px solid var(--bd); border-radius: 10px; padding: 9px 10px; min-width: 0; }
.mx .mx-b-kit > div > div { min-width: 0; }
.mx .mx-b-kit b { font-size: 12px; display: block; }
.mx .mx-b-kit small { font-size: 10.5px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-sign { margin-top: auto; background: #fff; border: 1px solid var(--bd); border-radius: 12px; padding: 12px; box-shadow: var(--sh1); }
.mx .mx-b-sign > b { font-size: 13px; display: block; }
.mx .mx-b-sign > span { font-size: 11px; color: var(--mu); line-height: 1.4; display: block; }
.mx .mx-b-sign .ln { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 10px; padding-top: 6px; border-top: 1px dashed var(--bd3); }
.mx .mx-b-sign .ln i { font: italic 400 20px/1 "Instrument Serif", Georgia, serif; color: #1d3a8a; }
.mx .mx-b-sign .ln em { font-style: normal; font-size: 10.5px; color: var(--mu); }
.mx .mx-b-cm3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.mx .mx-b-cm3 > div { background: #f8f9fb; border-radius: 8px; padding: 6px 8px; min-width: 0; }
.mx .mx-b-cm3 small { font-size: 10px; color: var(--mu); white-space: nowrap; }
.mx .mx-b-cm3 b { font-size: 12px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-cm3.you { margin-top: 10px; }
.mx .mx-b-cm3.you > div { background: var(--acs); }
.mx .mx-b-gl.n li .mx-i { color: var(--ac); }

.mx .mx-b-kw.r { padding: 6px 0; border-top: 1px solid var(--bd2); }
.mx .mx-b-c > header + .mx-b-kw.r { border-top: 0; padding-top: 0; }
.mx .mx-b-kw.r > span { min-width: 76px; text-align: center; }
.mx .mx-b-docf { display: flex; gap: 14px; align-items: center; margin-top: 26px; padding-top: 10px; border-top: 1px solid var(--bd2); font-size: 10.5px; color: var(--mu); }
.mx .mx-b-docf span { display: inline-flex; align-items: center; gap: 5px; }
.mx .mx-b-docf span:last-child { margin-left: auto; }
.mx .mx-b-docf .mx-i { width: 12px; height: 12px; }
.mx .mx-b-sign .ln i.wait { font: 500 11px/1 Inter, sans-serif; color: var(--am); background: var(--ams); border-radius: 999px; padding: 3px 9px; }
.mx .mx-b-jobs > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); margin-bottom: 6px; }
.mx .mx-b-jobs > div { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.mx .mx-b-jobs > div > div { display: flex; gap: 10px; align-items: center; border: 1px solid var(--bd); border-radius: 10px; padding: 6px; }
.mx .mx-b-jobs-i { width: 64px; height: 44px; min-height: 0; border-radius: 7px; flex: none; }
.mx .mx-b-jobs em { font-style: normal; font-size: 10.5px; font-weight: 700; color: var(--ac2); }
.mx .mx-b-jobs b { font-size: 12px; display: block; }
.mx .mx-b-jobs small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-fu { margin-top: auto; display: flex; flex-direction: column; gap: 8px; }
.mx .mx-b-fu > div { display: flex; gap: 10px; align-items: center; background: #f8f9fb; border-radius: 10px; padding: 9px 10px; }
.mx .mx-b-fu > div > div { flex: 1; }
.mx .mx-b-fu b { font-size: 12px; display: block; }
.mx .mx-b-fu small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-road { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.mx .mx-b-road > small { grid-column: span 2; }
.mx .mx-b-road > div { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 6px 8px; background: #f8f9fb; border-radius: 8px; }
.mx .mx-b-hrt { display: flex; align-items: baseline; gap: 10px; margin-top: auto; padding-top: 10px; border-top: 1px solid var(--bd); }
.mx .mx-b-hrt span { font-size: 11px; color: var(--mu); text-transform: uppercase; letter-spacing: .08em; font-weight: 700; }
.mx .mx-b-hrt b { font-size: 16px; }
.mx .mx-b-hrt em { margin-left: auto; font-style: normal; font-size: 11px; color: #067647; font-weight: 600; }
.mx .mx-b-pr { max-width: 200px; }
.mx .mx-b-paper.es { display: flex; flex-direction: column; }
.mx .mx-b-paper.es .mx-b-docf { margin-top: auto; }
.mx .mx-b-road.w4 { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: auto; }
.mx .mx-b-road.w4 > small { grid-column: span 4; }
.mx .mx-b-road.w4 span { font-size: 11.5px; }
.mx .mx-b-road.w4 + .mx-b-hrt { margin-top: 10px; }
.mx .mx-b-mtx { margin-bottom: 18px; }
.mx .mx-b-sched { margin-top: 16px; border: 1px solid var(--bd2); border-radius: 10px; padding: 10px 12px; background: #fafbfc; }
.mx .mx-b-sched > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); margin-bottom: 4px; }
.mx .mx-b-sched > div { display: grid; grid-template-columns: 70px minmax(0, 1fr); gap: 8px; padding: 3px 0; font-size: 12px; }
.mx .mx-b-sched span { color: var(--mu); }
.mx .mx-b-hand { display: flex; gap: 9px; align-items: center; margin-top: auto; padding: 9px 14px; border-top: 1px solid var(--bd); background: #fafbfc; font-size: 11.5px; color: var(--tx2); flex-shrink: 0; }
.mx .mx-b-hand > span:not(.mx-btn):not(.mx-agent-av) { flex: 1; }
.mx .mx-b-hand b { color: var(--tx); }
.mx .mx-b-convo .mx-b-th { flex: 1 1 auto; }
.mx .mx-b-prevq { display: flex; gap: 8px; margin-top: 22px; padding-top: 16px; border-top: 1px solid #ece7dd; }
.mx .mx-b-prevq span { display: inline-flex; gap: 7px; align-items: center; font-size: 12px; color: var(--mu); background: #fff; border: 1px solid #ece7dd; border-radius: 999px; padding: 4px 11px 4px 4px; }
.mx .mx-b-prevq em { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: var(--acs); color: var(--ac2); font-style: normal; font-size: 10.5px; font-weight: 700; }
.mx .mx-b-prevq b { color: var(--tx); font-weight: 600; }
.mx .mx-b-prevq .mx-i { width: 12px; height: 12px; color: var(--ac); stroke-width: 2.4; }
.mx .mx-b-goal { margin-top: auto; padding-top: 12px; border-top: 1px solid color-mix(in srgb, var(--ac) 20%, #fff); }
.mx .mx-b-goal small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--ac2); }
.mx .mx-b-goal b { display: block; font-size: 14px; margin: 2px 0 8px; }
.mx .mx-b-goal span { display: flex; gap: 6px; flex-wrap: wrap; }
.mx .mx-b-out { display: flex; gap: 10px; align-items: center; margin-top: 14px; padding: 10px 12px; border: 1px solid var(--bd); border-radius: 10px; background: #fafbfc; }
.mx .mx-b-out > div { flex: 1; min-width: 0; }
.mx .mx-b-out b { font-size: 12px; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-out small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-wid.float { width: 286px; height: 372px; right: 14px; bottom: 64px; }
.mx .mx-b-wid.float .mx-b-m > div { font-size: 11.3px; padding: 6px 10px; }
.mx .mx-b-wid.float .mx-b-th { gap: 5px; padding: 10px; }
.mx .mx-b-paper.tpl { display: flex; flex-direction: column; }
.mx .mx-b-paper.tpl .mx-b-out { margin-top: auto; }

/* ======================= round 2 polish (mx-b builder) ======================= */
/* shared: spread rows to fill a card, book tile */
.mx .mx-b-c.spread > .mx-b-li { flex: 1 1 0; padding: 4px 0; }
.mx .mx-b-rank.spread { flex: 1; display: flex; flex-direction: column; justify-content: space-between; }
.mx .mx-b-rank.spread > div { flex: 1; }
.mx .mx-b-bk { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; background: linear-gradient(145deg, #fff7e6, #fde7b8); color: #92400e; border: 1px solid #f7d58c; flex-shrink: 0; }
.mx .mx-b-bk .mx-i { width: 15px; height: 15px; }

/* mini ad creative */
.mx .mx-b-mad { position: relative; overflow: hidden; border-radius: 8px; isolation: isolate; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; padding: 7px 8px; min-height: 0; box-shadow: 0 1px 2px rgba(16, 24, 40, .12); }
.mx .mx-b-mad .mx-b-mad-i { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; border-radius: 0; }
.mx .mx-b-mad .mx-b-mad-i svg { width: 100%; height: 100%; display: block; }
.mx .mx-b-mad .scr { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0, 0, 0, .38) 0%, rgba(0, 0, 0, 0) 34%, rgba(0, 0, 0, .12) 50%, rgba(0, 0, 0, .78) 100%); }
.mx .mx-b-mad .t { position: absolute; top: 6px; left: 7px; right: 7px; display: flex; align-items: center; gap: 4px; font-size: 8.5px; font-weight: 650; letter-spacing: .01em; }
.mx .mx-b-mad .t .mx-logo, .mx .mx-b-mad .t .mx-fav { width: 13px !important; height: 13px !important; flex: none; }
.mx .mx-b-mad .t .mx-logo svg, .mx .mx-b-mad .t .mx-fav svg { width: 13px; height: 13px; }
.mx .mx-b-mad .fl { position: absolute; top: 5px; right: 6px; font-style: normal; font-size: 8px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; background: var(--ma); color: #fff; border-radius: 4px; padding: 2px 5px; }
.mx .mx-b-mad > b { font-size: 11px; line-height: 1.15; font-weight: 750; letter-spacing: -.01em; text-shadow: 0 1px 2px rgba(0, 0, 0, .4); }
.mx .mx-b-mad > small { font-size: 8.5px; opacity: .85; margin-top: 1px; }
.mx .mx-b-mad .cta { align-self: flex-start; margin-top: 5px; font-size: 8.5px; font-weight: 700; background: #fff; color: #101828; border-radius: 4px; padding: 2px 7px; }

/* 5 Daily AI briefing */
.mx .mx-b-pri > p { flex: none; }
.mx .mx-b-prib { flex: 1; display: flex; flex-direction: column; gap: 8px; min-height: 0; justify-content: flex-end; }
.mx .mx-b-pvt { background: #f8f9fb; border-radius: 10px; padding: 8px 12px; display: flex; flex-direction: column; gap: 5px; }
.mx .mx-b-pvt > small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-pvt > div { display: grid; grid-template-columns: minmax(0, 1fr) 70px 38px; gap: 8px; align-items: center; font-size: 11.5px; color: var(--tx2); }
.mx .mx-b-pvt span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-pvt i { height: 5px; border-radius: 999px; background: #e7ebf2; overflow: hidden; }
.mx .mx-b-pvt i b { display: block; height: 100%; background: linear-gradient(90deg, #93b4ff, #2e6ff2); border-radius: 999px; }
.mx .mx-b-pvt em { font-style: normal; font-size: 11px; color: var(--mu); text-align: right; font-variant-numeric: tabular-nums; }
.mx .mx-b-adc2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.mx .mx-b-adc2 > div { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.mx .mx-b-adc2 .mx-b-mad { height: 92px; }
.mx .mx-b-adc2 .m { display: grid; grid-template-columns: 1fr auto; gap: 2px 6px; align-items: center; }
.mx .mx-b-adc2 .m small { font-size: 10.5px; color: var(--mu); white-space: nowrap; }
.mx .mx-b-adc2 .m b { font-size: 12.5px; }
.mx .mx-b-adc2 .m span { grid-column: span 2; height: 5px; background: #eef0f3; border-radius: 999px; overflow: hidden; }
.mx .mx-b-adc2 .m span i { display: block; height: 100%; background: linear-gradient(90deg, var(--acl), var(--ac)); }
.mx .mx-b-adc2 .m span.gy i { background: #b3bcc9; }
.mx .mx-b-cap2 { font-size: 10px; color: var(--mu2); }
.mx .mx-b-draft2 { background: #fffaf0; border: 1px solid #fde7c2; border-radius: 10px; padding: 8px 11px; }
.mx .mx-b-draft2 small { display: flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #b54708; }
.mx .mx-b-draft2 small .mx-i { width: 11px; height: 11px; }
.mx .mx-b-draft2 p { margin: 3px 0 0; font-size: 11.5px; line-height: 1.45; color: var(--tx2); }
.mx .mx-b-prib { justify-content: flex-start; margin-top: 2px; }
.mx .mx-b-pri { gap: 7px; }
.mx .mx-b-pri > p { line-height: 1.45; }
.mx .mx-b-pv { padding: 7px 12px 22px; }
.mx .mx-b-pv .ax { margin-top: 10px; }
.mx .mx-b-hello { padding: 13px 20px; }
.mx .mx-b-adc2 .mx-b-mad { height: 84px; }
.mx .mx-b-grp { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 10px; }
.mx .mx-b-grp span { border: 1px solid var(--bd2); background: #fafbfc; border-radius: 8px; padding: 6px 8px; display: grid; grid-template-columns: 1fr auto; gap: 0 4px; }
.mx .mx-b-grp b { font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-grp em { font-style: normal; font-size: 11px; font-weight: 650; color: var(--ac2); }
.mx .mx-b-grp small { grid-column: span 2; font-size: 10px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-pvt.one { flex-direction: row; align-items: center; gap: 7px; padding: 7px 11px; font-size: 11.5px; color: var(--tx2); }
.mx .mx-b-pvt.one .mx-i { width: 13px; height: 13px; color: #2e6ff2; flex: none; }
.mx .mx-b-pvt.one span { white-space: normal; line-height: 1.35; }
/* 6 AI departments */
.mx .mx-b-n.sum { background: #fff; border: 1px solid #c7d7fe; box-shadow: 0 1px 2px rgba(16, 24, 40, .06), inset 3px 0 0 #2e6ff2; }
/* 8 Client onboarding */
.mx .mx-b-bft { display: flex; gap: 5px; align-items: center; }
.mx .mx-b-bft > i, .mx .mx-b-bft .ph { width: 30px; height: 30px; border-radius: 7px; overflow: hidden; display: grid; place-items: center; border: 1px solid var(--bd); background: #fff; flex: none; font-style: normal; }
.mx .mx-b-bft > i .mx-fav { width: 22px; height: 22px; }
.mx .mx-b-bft > i.fo { font: 600 13px/1 Georgia, 'Times New Roman', serif; color: #0b6bcb; background: #f0f6ff; }
.mx .mx-b-bft .ph svg { width: 100%; height: 100%; display: block; }
.mx .mx-b-kag { margin-top: 12px; }
.mx .mx-b-kag > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); }
.mx .mx-b-kag > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 6px; }
.mx .mx-b-kag span { display: flex; gap: 8px; align-items: flex-start; padding: 8px 10px; border-radius: 10px; background: linear-gradient(180deg, #f6fbf9, #fff); border: 1px solid #d7efe5; min-width: 0; }
.mx .mx-b-kag em { width: 20px; height: 20px; border-radius: 50%; flex: none; display: grid; place-items: center; background: #0f1b2d; color: #fff; font-style: normal; font-size: 10.5px; font-weight: 700; }
.mx .mx-b-kag div div { min-width: 0; }
.mx .mx-b-kag b { display: block; font-size: 12px; }
.mx .mx-b-kag span small { display: block; font-size: 10.5px; color: var(--mu); line-height: 1.35; }
.mx .mx-b-bft .mx-scene { height: 30px !important; min-height: 0 !important; aspect-ratio: auto; }
.mx .mx-b-kag span { align-items: center; padding: 7px 10px; }
.mx .mx-b-kag b { font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-kag { margin-top: 10px; }
/* 11 Quote builder */
.mx .mx-b-cov2 { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 0; height: 122px; flex-shrink: 0; background: linear-gradient(110deg, #0f1b2d 0%, #16304f 70%, #1d3b5f 100%); color: #fff; overflow: hidden; border-radius: 14px 14px 0 0; }
.mx .mx-b-cov2 .l { padding: 14px 22px; display: flex; flex-direction: column; justify-content: space-between; min-width: 0; }
.mx .mx-b-cov2 .b { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.mx .mx-b-cov2 .b .mx-mark { width: 22px; height: 22px; }
.mx .mx-b-cov2 small { font-size: 9.5px; letter-spacing: .14em; color: #93c5fd; font-weight: 700; }
.mx .mx-b-cov2 h3 { font-family: "Instrument Serif", Georgia, serif; font-weight: 400; font-size: 30px; line-height: 1; margin: 1px 0 2px; letter-spacing: -.01em; }
.mx .mx-b-cov2 .l span { font-size: 11.5px; color: #cbd5e1; }
.mx .mx-b-cov2 .r { position: relative; margin: 10px 10px 10px 0; border-radius: 10px; overflow: hidden; box-shadow: 0 6px 18px rgba(0, 0, 0, .35); }
.mx .mx-b-cov2 .r .mx-scene { position: absolute; inset: 0; width: 100%; height: 100%; min-height: 0; border-radius: 0; }
.mx .mx-b-cov2 .r .mx-scene svg { width: 100%; height: 100%; display: block; }
.mx .mx-b-cov2 .cap { position: absolute; left: 6px; bottom: 6px; display: inline-flex; align-items: center; gap: 4px; font-size: 9px; font-weight: 600; color: #fff; background: rgba(15, 27, 45, .72); backdrop-filter: blur(4px); border-radius: 5px; padding: 3px 6px; }
.mx .mx-b-cov2 .cap .mx-i { width: 10px; height: 10px; }
.mx .mx-b-qmid { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 18px; align-items: start; margin: 8px 22px 0; }
.mx .mx-b-qmid .mx-b-tot { margin: 0; width: auto; }
.mx .mx-b-sel > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); }
.mx .mx-b-sel > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 6px; }
.mx .mx-b-sel span { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 0 7px; align-items: center; }
.mx .mx-b-sel i { grid-row: span 2; width: 26px; height: 26px; border-radius: 7px; border: 1px solid rgba(0, 0, 0, .08); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .6); }
.mx .mx-b-sel i.mb { background: radial-gradient(60% 30% at 30% 30%, rgba(160, 160, 170, .35), transparent 70%), linear-gradient(120deg, transparent 40%, rgba(150, 150, 160, .5) 42%, transparent 46%), linear-gradient(160deg, #fbfbfa, #eceae6); }
.mx .mx-b-sel i.dn { background: linear-gradient(160deg, #e7ddcc, #cdbfa6); }
.mx .mx-b-sel i.br { background: linear-gradient(135deg, #f3dca0, #b8893a 55%, #e6c47a); }
.mx .mx-b-sel b { font-size: 11px; }
.mx .mx-b-sel span small { font-size: 10px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-terms { display: flex; gap: 16px; margin: 10px 22px 0; padding-top: 9px; border-top: 1px dashed var(--bd); }
.mx .mx-b-terms span { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; color: var(--mu); }
.mx .mx-b-terms .mx-i { width: 12px; height: 12px; color: var(--ac); }
.mx .mx-b-rnote { margin-top: auto; background: #fff; border: 1px solid var(--bd); border-radius: 12px; padding: 11px 13px; box-shadow: var(--sh2); }
.mx .mx-b-rnote p { margin: 0 0 8px; font-size: 12px; line-height: 1.5; color: var(--tx2); font-style: italic; }
.mx .mx-b-rnote > div { display: flex; align-items: center; gap: 7px; }
.mx .mx-b-rnote .mx-face { width: 22px; height: 22px; }
.mx .mx-b-rnote b { font-size: 11.5px; }
.mx .mx-b-rnote small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-wrail { display: flex; flex-direction: column; }
/* 12 E-sign */
.mx .mx-b-signhere .flag { left: auto; right: 10px; top: -10px; }
.mx .mx-b-thumbs.pg2 > div { padding: 8px 7px; overflow: hidden; }
.mx .mx-b-thumbs.pg2 u { display: block; height: 4px; width: 55%; background: #344054; border-radius: 2px; margin-bottom: 5px; text-decoration: none; }
.mx .mx-b-thumbs.pg2 u.s { width: 40%; height: 3px; background: #667085; }
.mx .mx-b-thumbs.pg2 i { height: 2px; margin-bottom: 4px; background: #d0d5dd; }
.mx .mx-b-thumbs.pg2 .lg { display: block; margin-bottom: 5px; }
.mx .mx-b-thumbs.pg2 .lg .mx-mark { width: 12px; height: 12px; }
.mx .mx-b-thumbs.pg2 .p1 u:not(.s) { width: 70%; height: 5px; }
.mx .mx-b-thumbs.pg2 em.sg { position: absolute; left: 7px; bottom: 22px; width: 20px; height: 8px; border-bottom: 1px solid #98a2b3; background: none; }
.mx .mx-b-thumbs.pg2 em.sg::before { content: ""; position: absolute; left: 1px; top: 1px; width: 17px; height: 6px; border: 1.2px solid #2f54d6; border-color: #2f54d6 transparent transparent transparent; border-radius: 50%; transform: rotate(-8deg); }
.mx .mx-b-thumbs.pg2 em.sh { position: absolute; right: 7px; bottom: 18px; width: 22px; height: 12px; background: #fde68a; border: 1px dashed #f5b544; border-radius: 2px; }
/* 17 Win-back */
.mx .mx-b-wbn { display: flex; gap: 6px; align-items: flex-start; margin-top: auto; padding-top: 10px; font-size: 10.5px; line-height: 1.4; color: var(--mu); }
.mx .mx-b-wbn .mx-i { width: 12px; height: 12px; color: var(--ac); flex: none; margin-top: 1px; }
.mx .mx-b-hero2 { position: relative; height: 82px; overflow: hidden; }
.mx .mx-b-hero2 svg { width: 100%; height: 100%; display: block; }
.mx .mx-b-hero2 span { position: absolute; left: 12px; bottom: 8px; font-size: 9.5px; font-weight: 650; color: #0f3d36; background: rgba(255, 255, 255, .85); border-radius: 4px; padding: 2px 6px; }
.mx .mx-b-mail-p h6 { padding-top: 11px; }
.mx .mx-b-lap { display: flex; flex-direction: column; gap: 7px; margin-top: 2px; }
.mx .mx-b-lap > div { display: grid; grid-template-columns: 66px minmax(0, 1fr) 30px 34px; gap: 7px; align-items: center; font-size: 11.5px; color: var(--tx2); }
.mx .mx-b-lap i { height: 7px; background: #f1f3f6; border-radius: 999px; overflow: hidden; }
.mx .mx-b-lap i b { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #f9a8d4, var(--ac)); }
.mx .mx-b-lap em { font-style: normal; font-size: 11px; color: var(--mu); text-align: right; font-variant-numeric: tabular-nums; }
.mx .mx-b-lap strong { font-size: 11.5px; text-align: right; color: #067647; }
.mx .mx-b-lap .h { order: -1; font-size: 9.5px; color: var(--mu2); text-transform: uppercase; letter-spacing: .06em; }
.mx .mx-b-lap .h em, .mx .mx-b-lap .h strong { font-size: 9.5px; color: var(--mu2); font-weight: 600; }
.mx .mx-b-lap .h strong { white-space: nowrap; }
.mx .mx-b-mail.zm .mx-b-mail-p { zoom: .86; max-width: 470px; }
.mx .mx-b-mail.zm .mx-b-mail-b { padding-top: 12px; }
.mx .mx-b-lap > div { grid-template-columns: 62px minmax(0, 1fr) 28px 30px; }
/* 21 Speed to lead */
.mx .mx-b-race.one small { white-space: nowrap; }
.mx .mx-b-race.one b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-lap > div { grid-template-columns: 58px minmax(0, 1fr) 34px 34px; }
.mx .mx-b-th.fade { -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 18px, #000 calc(100% - 34px), transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 18px, #000 calc(100% - 34px), transparent 100%); justify-content: flex-end; }
/* 22 Missed call */
.mx .mx-b-mct .mx-b-recw { margin-top: auto; padding-top: 10px; border-top: 1px solid var(--bd2); display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 16px; align-items: end; }
.mx .mx-b-recw .h small { display: block; font-size: 10.5px; color: var(--mu); }
.mx .mx-b-recw .h b { display: block; font-size: 20px; letter-spacing: -.02em; margin: 1px 0; }
.mx .mx-b-recw .h em { display: inline-flex; align-items: center; gap: 3px; font-style: normal; font-size: 11px; font-weight: 600; color: #067647; }
.mx .mx-b-recw .h em .mx-i { width: 11px; height: 11px; }
.mx .mx-b-recw .bars { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; height: 62px; }
.mx .mx-b-recw .bars > div { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; gap: 3px; }
.mx .mx-b-recw .bars i { width: 100%; max-width: 26px; border-radius: 4px 4px 2px 2px; background: #bfe8d4; }
.mx .mx-b-recw .bars .on i { background: linear-gradient(180deg, #34c759, #1f9d55); }
.mx .mx-b-recw .bars .fut i { background: repeating-linear-gradient(90deg, #eef0f3 0 100%); border: 1px dashed #d0d5dd; background: none; }
.mx .mx-b-recw .bars small { font-size: 9.5px; color: var(--mu); }
.mx .mx-b-cavf .mx-face { width: 38px; height: 38px; display: block; margin: 0 auto 2px; }
/* 23 Quiz */
.mx .mx-b-quiz > main { align-items: center; padding: 18px 56px; gap: 44px; grid-template-columns: minmax(0, 1fr) 310px; }
.mx .mx-b-qa .lv { display: flex; align-items: flex-end; gap: 2px; height: 18px; margin-left: auto; }
.mx .mx-b-qa .lv i { width: 4px; border-radius: 2px; background: #e8e2d6; }
.mx .mx-b-qa .lv i.f { background: #9bd3bb; }
.mx .mx-b-qa > div.on .lv i.f { background: var(--ac); }
.mx .mx-b-qa > div.on > .mx-i { margin-left: 4px; }
.mx .mx-b-qf .why { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-style: normal; font-size: 11.5px; color: #4b5b53; background: #f1ede4; border-radius: 999px; padding: 5px 11px; }
.mx .mx-b-qf .why .mx-i { width: 12px; height: 12px; color: var(--ac); }
.mx .mx-b-qs { gap: 9px; }
.mx .mx-b-qtm { display: block; border-top: 1px solid #ece7dd; margin-top: 4px; padding: 11px 0 0; }
.mx .mx-b-qtm .st { display: flex; align-items: center; justify-content: space-between; }
.mx .mx-b-qtm .st small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-qs .mx-b-qtm p { display: block; background: none; padding: 0; margin: 6px 0 9px; font-family: "Instrument Serif", Georgia, serif; font-size: 16px; line-height: 1.3; color: #13201b; }
.mx .mx-b-qtm .who { display: flex; align-items: center; gap: 8px; }
.mx .mx-b-qtm .who .mx-face { width: 28px; height: 28px; }
.mx .mx-b-qtm .who b { display: block; font-size: 12px; }
.mx .mx-b-qtm .who small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-qget { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.mx .mx-b-qget > div { display: flex; gap: 9px; align-items: center; background: #fff; border: 1px solid #ece7dd; border-radius: 12px; padding: 10px 12px; }
.mx .mx-b-qget span { min-width: 0; }
.mx .mx-b-qget b { display: block; font-size: 12.5px; }
.mx .mx-b-qget small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-qget .mx-b-ico { width: 30px; height: 30px; border-radius: 9px; }
.mx .mx-b-qf > .mx-btn { margin-left: 0; }
/* 46 Support */
.mx .mx-b-sysm .mx-i { width: 10px; height: 10px; vertical-align: -1px; margin-right: 3px; color: #12a26f; }
/* 24 Follow-up sequences */
.mx .mx-b-hseq { display: flex; align-items: stretch; gap: 6px; padding: 12px; flex-shrink: 0; }
.mx .mx-b-hseq .tr { display: flex; gap: 8px; align-items: center; padding: 8px 10px; background: #fffaf0; border: 1px dashed #f5c26b; border-radius: 10px; width: 150px; flex: none; }
.mx .mx-b-hseq .tr > .mx-i { width: 24px; height: 24px; padding: 5px; border-radius: 7px; background: #f79009; color: #fff; flex: none; }
.mx .mx-b-hseq small { font-size: 9.5px; color: var(--mu); font-weight: 650; text-transform: uppercase; letter-spacing: .05em; display: block; white-space: nowrap; }
.mx .mx-b-hseq .tr b { font-size: 11.5px; display: block; line-height: 1.25; }
.mx .mx-b-hseq .ar { display: grid; place-items: center; color: var(--mu2); flex: none; }
.mx .mx-b-hseq .ar .mx-i { width: 13px; height: 13px; }
.mx .mx-b-hseq .st { flex: 1; min-width: 0; display: flex; gap: 8px; align-items: flex-start; padding: 8px 9px; background: #fff; border: 1px solid var(--bd); border-radius: 10px; box-shadow: var(--sh1); }
.mx .mx-b-hseq .st.sel { border-color: color-mix(in srgb, var(--ac) 50%, #fff); box-shadow: 0 0 0 3px var(--acs); }
.mx .mx-b-hseq .st > div { min-width: 0; }
.mx .mx-b-hseq .st b { display: block; font-size: 11.5px; line-height: 1.25; margin: 1px 0 2px; }
.mx .mx-b-hseq .st span { font-size: 10px; color: var(--mu); white-space: nowrap; }
.mx .mx-b-hseq .st em { font-style: normal; font-weight: 700; color: var(--tx); }
.mx .mx-b-hseq .ex { flex: none; display: flex; gap: 6px; align-items: center; padding: 0 10px; border-radius: 10px; background: var(--grs); color: #067647; font-size: 10.5px; font-weight: 650; line-height: 1.3; margin-left: 4px; }
.mx .mx-b-hseq .ex .mx-i { width: 13px; height: 13px; }
.mx .mx-b-cn .mx-face.sm { width: 26px; height: 26px; }
.mx .mx-b-stp { display: inline-flex; align-items: center; gap: 3px; }
.mx .mx-b-stp i { width: 12px; height: 5px; border-radius: 3px; background: #e4e7ec; }
.mx .mx-b-stp i.d { background: var(--ac); }
.mx .mx-b-stp i.n { background: color-mix(in srgb, var(--ac) 35%, #fff); box-shadow: 0 0 0 1.5px var(--ac) inset; }
.mx .mx-b-stp small { margin-left: 5px; font-size: 10.5px; color: var(--mu); }
.mx .mx-b-paused { align-self: center; display: inline-flex; align-items: center; gap: 4px; font-size: 9.5px; font-weight: 650; color: #b54708; background: #fff4e5; border-radius: 999px; padding: 2px 8px; margin-top: 2px; }
.mx .mx-b-paused .mx-i { width: 9px; height: 9px; }
.mx .mx-b-hseq { flex-direction: column; gap: 8px; padding: 12px 14px; }
.mx .mx-b-hseq > header { display: flex; align-items: center; gap: 8px; margin: 0; }
.mx .mx-b-hseq > header h5 { margin: 0 auto 0 0; }
.mx .mx-b-hseq > header .tr, .mx .mx-b-hseq > header .ex { width: auto; display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 650; border-radius: 999px; padding: 3px 9px; margin: 0; }
.mx .mx-b-hseq > header .tr { background: #fff4e5; color: #b54708; border: 0; }
.mx .mx-b-hseq > header .tr .mx-i { width: 11px; height: 11px; padding: 0; background: none; color: #f79009; border-radius: 0; }
.mx .mx-b-hseq > header .ex .mx-i { width: 11px; height: 11px; }
.mx .mx-b-hseq .rw { display: flex; gap: 5px; align-items: stretch; }
/* 26 Pricing calculator */
.mx .mx-b-solm { width: 28px; height: 28px; display: inline-block; flex: none; }
.mx .mx-b-solm svg { width: 28px; height: 28px; display: block; }
.mx .mx-b-incl { border-top: 1px solid var(--bd2); padding-top: 12px; }
.mx .mx-b-incl > b { font-size: 12.5px; }
.mx .mx-b-incl > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
.mx .mx-b-incl > div > span { display: flex; gap: 8px; align-items: center; min-width: 0; padding: 7px 9px; border-radius: 10px; background: #f6faf8; border: 1px solid #e3efe9; }
.mx .mx-b-incl b { font-size: 12px; display: block; }
.mx .mx-b-incl small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-foot2 .cec { margin-left: auto; font-size: 10px; font-weight: 700; letter-spacing: .02em; color: #067647; background: #e7f6ee; border: 1px solid #bfe6d0; border-radius: 999px; padding: 2px 8px; }
.mx .mx-b-ten2 { position: relative; display: grid; grid-template-columns: repeat(10, 1fr); gap: 6px; height: 84px; margin-top: 6px; }
.mx .mx-b-ten2 > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.mx .mx-b-ten2 > div > span { flex: 1; display: flex; align-items: flex-end; }
.mx .mx-b-ten2 i { position: relative; display: block; width: 100%; border-radius: 4px 4px 2px 2px; background: rgba(110, 231, 183, .32); }
.mx .mx-b-ten2 .hi i { background: linear-gradient(180deg, #a7f3d0, #34d399); }
.mx .mx-b-ten2 em { position: absolute; left: 50%; bottom: calc(100% + 3px); transform: translateX(-50%); font-style: normal; font-size: 9.5px; font-weight: 700; color: #d1fae5; white-space: nowrap; }
.mx .mx-b-ten2 small { font-size: 9.5px; color: rgba(255, 255, 255, .5); text-align: center; }
.mx .mx-b-ten2 .pb { position: absolute; top: 0; bottom: 16px; width: 0; border-left: 1px dashed rgba(255, 255, 255, .45); }
.mx .mx-b-ten2 .pb em { left: 4px; top: 0; bottom: auto; transform: none; font-size: 9px; font-weight: 600; color: rgba(255, 255, 255, .6); }
.mx .mx-b-calc .mx-b-cin { gap: 13px; }
.mx .mx-b-incl { padding-top: 10px; }
.mx .mx-b-incl > div { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 7px; }
.mx .mx-b-incl > div > span { flex-direction: column; align-items: flex-start; gap: 5px; padding: 8px 9px; }
.mx .mx-b-incl .mx-b-ico { width: 22px; height: 22px; border-radius: 6px; }
.mx .mx-b-incl .mx-b-ico .mx-i { width: 12px; height: 12px; }
.mx .mx-b-incl b, .mx .mx-b-incl small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-incl b { font-size: 11.5px; }
.mx .mx-b-incl span > span { min-width: 0; max-width: 100%; }
.mx .mx-b-calc .mx-b-foot2 { padding-top: 10px; }
/* 27 Call prep */
.mx .mx-b-objl { margin-top: auto; padding-top: 10px; border-top: 1px solid var(--bd2); display: flex; flex-direction: column; gap: 5px; }
.mx .mx-b-objl > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); margin-bottom: 2px; }
.mx .mx-b-objl > div { display: grid; grid-template-columns: 14px 190px minmax(0, 1fr); gap: 8px; align-items: center; padding: 5px 9px; border-radius: 8px; background: #fffaf0; border: 1px solid #fde7c2; font-size: 11.5px; }
.mx .mx-b-objl .mx-i { width: 12px; height: 12px; color: #dc6803; }
.mx .mx-b-objl b { color: #93370d; font-weight: 650; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-objl span { color: var(--tx2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-objl > div { grid-template-columns: 14px 176px minmax(0, 1fr); }
/* 32 AI visibility */
.mx .mx-b-engt th { white-space: nowrap; }
.mx .mx-b-engt th .mx-b-eng { width: 16px; height: 16px; border-radius: 4px; vertical-align: -4px; margin-right: 4px; }
.mx .mx-b-engt th .mx-b-eng svg { width: 10px; height: 10px; }
.mx .mx-b-engt th i { font-style: normal; font-size: 10px; }
.mx .mx-b-cites { flex-wrap: nowrap !important; overflow: hidden; }
.mx .mx-b-cites span { white-space: nowrap; font-size: 10px !important; flex-shrink: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-hbf .mx-b-hb > div > span { display: flex; align-items: center; gap: 6px; min-width: 0; }
.mx .mx-b-hbf .mx-b-hb .mx-fav { width: 16px; height: 16px; flex: none; }
.mx .mx-b-hbf .mx-b-hb em { font-style: normal; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 35 flows */
.mx .mx-b-klv { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px; border: 1px solid var(--bd); border-radius: 7px; background: #fff; font: 700 13px/1 Inter, sans-serif; letter-spacing: -.03em; color: #1c1c1c; }
.mx .mx-b-klv svg { width: 13px; height: 10px; }
.mx .mx-b-engt th .mx-b-eng { width: 20px; height: 20px; border-radius: 6px; margin: 0; }
.mx .mx-b-engt th .mx-b-eng svg { width: 12px; height: 12px; }
.mx .mx-b-engt td:first-child { width: 46%; }
.mx .mx-b-hbf .mx-b-hb > div { grid-template-columns: minmax(0, 1.9fr) minmax(0, 1fr) 30px; }
.mx .mx-b-aians .mx-b-fix { margin-top: auto; }
.mx .mx-b-aians { display: flex; flex-direction: column; }
/* 38 Competitor tracking */
.mx .mx-b-cmk { width: 30px; height: 30px; display: inline-block; flex: none; }
.mx .mx-b-cmk svg { width: 100%; height: 100%; display: block; }
.mx .mx-b-cmk.xs { width: 13px; height: 13px; }
.mx .mx-b-ads > div { gap: 6px; }
.mx .mx-b-ads .mx-b-mad { flex: 1; height: 98px; min-width: 0; }
.mx .mx-b-ads .mx-b-mad > b { font-size: 10px; }
.mx .mx-b-ads .mx-b-mad .t span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-adm { flex: 1; min-width: 0; height: 98px; border-radius: 8px; border: 1px dashed var(--bd3, #d0d5dd); display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 15px; font-weight: 650; color: var(--tx2); background: #fafbfc; }
.mx .mx-b-adm small { font-size: 10px; color: var(--mu); font-weight: 500; }
/* mini ad v2: photo top, brand panel bottom (legible at any size) */
.mx .mx-b-mad { background: color-mix(in srgb, var(--ma) 42%, #0b1220); padding: 0 7px 7px; justify-content: flex-end; gap: 0; }
.mx .mx-b-mad .mx-b-mad-i { inset: 0 0 auto 0; height: 54%; }
.mx .mx-b-mad .scr { inset: 0 0 auto 0; height: 54%; background: linear-gradient(180deg, rgba(0, 0, 0, .42) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, 0) 70%, color-mix(in srgb, var(--ma) 42%, #0b1220) 100%); }
.mx .mx-b-mad > b { font-size: 10.5px; line-height: 1.15; text-shadow: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-mad > small { display: none; }
.mx .mx-b-mad .cta { margin-top: 4px; font-size: 8.5px; padding: 2px 6px; }
.mx .mx-b-mad .t { top: 5px; left: 6px; text-shadow: 0 1px 2px rgba(0, 0, 0, .5); }
.mx .mx-b-mad .t span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-mad .fl { top: 5px; right: 5px; }
.mx .mx-b-mad .mx-b-mad-i { min-height: 0; }
.mx .mx-b-ads .mx-b-mad > b { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; font-size: 10px; }
/* 41 Website chatbot */
.mx .mx-b-site-hero.h2 { position: relative; display: block; padding: 0; height: 214px; overflow: hidden; background: #eef4fb; }
.mx .mx-b-site-hero.h2 > svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.mx .mx-b-site-hero.h2::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(248, 251, 255, .97) 0%, rgba(248, 251, 255, .92) 42%, rgba(248, 251, 255, .2) 64%, rgba(248, 251, 255, 0) 80%); }
.mx .mx-b-site-hero.h2 .tx { position: relative; z-index: 1; width: 330px; padding: 22px 22px; }
.mx .mx-b-site-hero.h2 h3 { font-size: 25px; }
.mx .mx-b-site-row.r3 { grid-template-columns: repeat(3, minmax(0, 1fr)); width: 400px; padding: 14px 0 0 22px; gap: 8px; }
.mx .mx-b-site-row.r3 span { display: flex; flex-direction: column; gap: 2px; padding: 10px 11px; }
.mx .mx-b-site-row.r3 b { font-size: 11.5px; }
.mx .mx-b-site-row.r3 small { font-size: 10px; color: var(--mu); font-weight: 500; }
.mx .mx-b-site-rv { width: 400px; margin: 12px 0 0 22px; display: grid; grid-template-columns: 96px 1fr 1fr; gap: 10px; align-items: start; padding-top: 12px; border-top: 1px solid var(--bd2); }
.mx .mx-b-site-rv .sc { display: flex; flex-direction: column; gap: 2px; }
.mx .mx-b-site-rv .sc b { font-size: 20px; letter-spacing: -.02em; color: #0b2540; line-height: 1; margin-top: 3px; }
.mx .mx-b-site-rv .sc small { font-size: 10px; color: var(--mu); }
.mx .mx-b-site-rv p { margin: 0; font-size: 11px; line-height: 1.4; color: var(--tx2); }
.mx .mx-b-site-rv p small { display: block; margin-top: 3px; font-size: 10px; font-weight: 650; color: #0b2540; }
.mx .mx-b-wid.float { height: 352px; bottom: 12px; right: 12px; width: 280px; }
.mx .mx-b-site-hero.h2 { height: 200px; }
.mx .mx-b-site-hero.h2::after { background: linear-gradient(90deg, rgba(248, 251, 255, .97) 0%, rgba(248, 251, 255, .9) 40%, rgba(248, 251, 255, .15) 58%, rgba(248, 251, 255, 0) 70%); }
.mx .mx-b-site-row.r3 { width: 366px; }
.mx .mx-b-site-row.r3 b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-site-rv { width: 366px; grid-template-columns: 100px minmax(0, 1fr); }
.mx .mx-b-site-hf { width: 366px; margin: 12px 0 0 22px; display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.mx .mx-b-site-hf small { width: 100%; font-size: 10px; color: var(--mu); }
.mx .mx-b-site-hf span { font-size: 10.5px; font-weight: 700; color: #475467; border: 1px solid var(--bd); border-radius: 5px; padding: 2px 8px; background: #fafbfc; letter-spacing: .01em; }
.mx .mx-b-wid.float .mx-b-th { justify-content: flex-end; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 16px); mask-image: linear-gradient(180deg, transparent 0, #000 16px); }
/* 42 AI receptionist */
.mx .mx-b-live { display: flex; flex-direction: column; }
.mx .mx-b-sumj { margin: auto 14px 14px; display: flex; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid var(--bd); border-radius: 10px; background: #fafbfc; }
.mx .mx-b-sumj > div { flex: 1; min-width: 0; }
.mx .mx-b-sumj b { display: block; font-size: 12px; }
.mx .mx-b-sumj small { display: block; font-size: 11px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 43 Knowledge assistant: round human avatars to match the app */
.mx .mx-b-sl-m > .mx-av, .mx .mx-b-sl-m > .mx-face { border-radius: 50% !important; overflow: hidden; }
/* 44 inbox triage */
.mx .mx-b-ml { display: flex; flex-direction: column; }
.mx .mx-b-mlf { margin-top: auto; display: flex; align-items: center; gap: 7px; padding: 10px 14px; border-top: 1px solid var(--bd); background: #fafbfc; font-size: 11px; color: var(--mu); }
.mx .mx-b-mlf .mx-i { width: 12px; height: 12px; color: #12a26f; }
.mx .mx-b-mlf b { color: var(--tx2); }
.mx .mx-b-spamf { margin-top: auto; display: flex; align-items: center; gap: 6px; padding-top: 9px; border-top: 1px solid var(--bd2); font-size: 11px; color: var(--mu); }
.mx .mx-b-spamf .mx-i { width: 12px; height: 12px; color: #12a26f; }
/* 45 sales assistant */
.mx .mx-b-ghost { display: flex; align-items: center; gap: 7px; padding: 8px 10px; border: 1px dashed #cfd4dc; border-radius: 10px; font-size: 11.5px; color: var(--mu); background: rgba(255, 255, 255, .5); flex-shrink: 0; }
.mx .mx-b-ghost span { flex: 1; font-weight: 550; }
.mx .mx-b-ghost .mx-i { width: 12px; height: 12px; }
.mx .mx-b-ghost .mx-avs .mx-face { width: 18px; height: 18px; }
.mx .mx-b-ghost > .mx-i:first-child { width: 13px; height: 13px; }
/* 47 owner voice */
.mx .mx-b-earl { width: 100%; text-align: left; margin-top: 12px; }
.mx .mx-b-earl > small { font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: #8fa0bd; font-weight: 700; }
.mx .mx-b-earl > div { display: flex; gap: 10px; align-items: baseline; padding: 6px 0; border-top: 1px solid rgba(255, 255, 255, .07); font-size: 11.5px; color: #c9cfe0; }
.mx .mx-b-earl > div:nth-child(2) { border-top: 0; }
.mx .mx-b-earl time { font: 500 10.5px/1 "IBM Plex Mono", monospace; color: #8fa0bd; flex: none; }
.mx .mx-b-earl b { color: #fff; font-weight: 600; margin-right: 6px; }
/* 48 roleplay */
.mx .mx-b-pers { position: relative; flex: none; width: 34px; height: 34px; }
.mx .mx-b-pers .mx-face { width: 34px; height: 34px; }
.mx .mx-b-pers em { position: absolute; right: -4px; bottom: -3px; font-style: normal; font-size: 8px; font-weight: 800; color: #fff; background: linear-gradient(135deg, #8b5cf6, #6d28d9); border: 1.5px solid #fff; border-radius: 5px; padding: 0 3px; line-height: 12px; }
.mx .mx-b-nxs { display: flex; flex-direction: column; gap: 8px; background: linear-gradient(160deg, #1e1b4b, #312e81); color: #fff; border: 0; flex: none !important; }
.mx .mx-b-nxs > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: #c4b5fd; }
.mx .mx-b-nxs > div { display: flex; gap: 10px; align-items: center; }
.mx .mx-b-nxs .mx-face { width: 32px; height: 32px; flex: none; }
.mx .mx-b-nxs b { display: block; font-size: 12.5px; }
.mx .mx-b-nxs span { font-size: 11px; color: #c7d2fe; }
.mx .mx-b-nxs .mx-btn { align-self: flex-start; background: #fff; color: #1e1b4b; border-color: #fff; }
.mx .mx-b-nxs { padding: 11px 13px; }
.mx .mx-b-nxs > div > div { flex: 1; min-width: 0; }
.mx .mx-b-nxs small { display: block; font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: #c4b5fd; }
.mx .mx-b-nxs b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; }
.mx .mx-b-nxs .mx-btn { align-self: center; flex: none; }
/* 49 DM bots */
.mx .mx-b-avw .mx-face, .mx .mx-b-avw .mx-av { width: 30px !important; height: 30px !important; }
.mx .mx-b-avw .mx-appi { width: 14px; height: 14px; right: -3px; bottom: -2px; }
.mx .mx-b-col.fill > .mx-b-c:has(+ .mx-b-nxs) { flex: 1 1 auto; min-height: 0; }
/* 50 Research agents */
.mx .mx-b-pbar { display: flex; flex-direction: column; gap: 7px; margin-top: 2px; }
.mx .mx-b-pbar > div { display: grid; grid-template-columns: 82px minmax(0, 1fr) 40px; gap: 8px; align-items: center; font-size: 11.5px; color: var(--tx2); }
.mx .mx-b-pbar > div > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-pbar i { height: 10px; border-radius: 3px; background: repeating-linear-gradient(90deg, #f2f4f7 0 24.5%, #e4e7ec 24.5% 25%); overflow: hidden; }
.mx .mx-b-pbar i b { display: block; height: 100%; border-radius: 3px; background: #b3bcc9; }
.mx .mx-b-pbar .hi i b { background: linear-gradient(90deg, var(--acl), var(--ac)); }
.mx .mx-b-pbar .hi span, .mx .mx-b-pbar .hi em { color: var(--tx); font-weight: 650; }
.mx .mx-b-pbar .cur i b { background: repeating-linear-gradient(135deg, #d0d5dd 0 4px, #e4e7ec 4px 8px); }
.mx .mx-b-pbar em { font-style: normal; text-align: right; font-variant-numeric: tabular-nums; }
.mx .mx-b-pbar .ax { display: grid; grid-template-columns: 82px 1fr 1fr 1fr 40px; gap: 0; font-size: 9.5px; color: var(--mu2); }
.mx .mx-b-pbar .ax small:nth-child(3) { text-align: center; }
.mx .mx-b-pbar .ax small:nth-child(4) { text-align: right; }
.mx .mx-b-pbar { position: relative; }
.mx .mx-b-pbar .cur i b { background: #fff; border: 1.5px dashed #98a2b3; }
.mx .mx-b-pbar > span.bud { display: block; height: auto; border-radius: 0; background: none; position: absolute; top: -8px; bottom: 14px; width: 0; border-left: 1.5px dashed #f79009; }
.mx .mx-b-pbar > span.bud em { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); font-style: normal; font-size: 9px; font-weight: 700; color: #b54708; background: #fff; white-space: nowrap; padding: 0 3px; }
.mx .mx-b-pbar i { background: #f2f4f7; }
.mx .mx-b-tsv { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: auto; }
.mx .mx-b-tsv > div { background: #f8f9fb; border-radius: 8px; padding: 6px 8px; min-width: 0; }
.mx .mx-b-tsv small { display: block; font-size: 9.5px; color: var(--mu); }
.mx .mx-b-tsv b { font-size: 12px; white-space: nowrap; }
.mx .mx-b-tsv + .mx-b-srcf { margin-top: 8px; }
.mx .mx-b-pbar { margin-top: 12px; }
/* 57 approvals */
.mx .mx-b-c.cmp3 .mx-b-li { padding: 4px 0; }
.mx .mx-b-c.cmp3 .mx-b-ico { width: 22px; height: 22px; }
.mx .mx-b-c.cmp3 .mx-b-li-m b { font-size: 12px; }
.mx .mx-b-c.cmp3 .mx-b-li-m small { font-size: 10.5px; }
.mx .mx-b-c.cmp3 { padding-bottom: 8px; }
/* 58 doc automation */
.mx .mx-b-sgl { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin: 10px 0 4px; }
.mx .mx-b-sgl small { font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); }
.mx .mx-b-sgl .ln { display: flex; align-items: flex-end; height: 30px; border-bottom: 1px solid #98a2b3; margin: 2px 0 4px; }
.mx .mx-b-sgl .ln .mx-sig { font-style: normal; font-size: 22px; line-height: 1; }
.mx .mx-b-sgl .ln em { font-style: normal; font-size: 10.5px; color: #b54708; background: #fffaf0; border: 1px dashed #f5c26b; border-radius: 4px; padding: 1px 6px; margin-bottom: 4px; }
.mx .mx-b-sgl b { font-size: 11.5px; font-weight: 600; }
.mx .mx-b-paper.tpl p { margin: 0 0 7px; }
.mx .mx-b-paper.tpl .mx-b-out { margin-top: 10px; }
.mx .mx-b-sgl { margin: 8px 0 0; }
.mx .mx-b-sgl .ln .mx-sig { font-size: 22px; margin: 0 0 2px; }
.mx .mx-b-sgl .ln .mx-sig { position: static; }
/* 59 invoice chasing */
.mx .mx-b-rmd { display: inline-flex; gap: 3px; }
.mx .mx-b-rmd i { width: 16px; height: 16px; border-radius: 50%; background: #f2f4f7; border: 1px solid #e4e7ec; display: grid; place-items: center; }
.mx .mx-b-rmd i .mx-i { width: 9px; height: 9px; stroke-width: 3; color: #fff; }
.mx .mx-b-rmd i.d { background: #12a26f; border-color: #12a26f; }
.mx .mx-b-rmd i.n { background: #fff; border: 2px solid #f79009; }
.mx .mx-b-tfoot { margin-top: auto; display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; border-top: 1px solid var(--bd2); font-size: 11px; color: var(--mu); }
.mx .mx-b-tfoot > span { display: inline-flex; align-items: center; gap: 5px; }
.mx .mx-b-tfoot .mx-i { width: 12px; height: 12px; }
.mx .mx-b-tfoot .lg i { width: 9px; height: 9px; border-radius: 50%; background: #f2f4f7; border: 1px solid #d0d5dd; margin-left: 6px; }
.mx .mx-b-tfoot .lg i.d { background: #12a26f; border-color: #12a26f; }
.mx .mx-b-tfoot .lg i.n { background: #fff; border: 2px solid #f79009; }
.mx .mx-b-cfc { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; height: 128px; margin-top: 4px; }
.mx .mx-b-cfc > div { display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 0; }
.mx .mx-b-cfc > div > span { flex: 1; width: 100%; max-width: 38px; display: flex; flex-direction: column-reverse; }
.mx .mx-b-cfc i { display: block; width: 100%; }
.mx .mx-b-cfc i.e { background: #c7d7fe; border-radius: 4px 4px 0 0; }
.mx .mx-b-cfc i.c { background: #12a26f; border-radius: 0 0 3px 3px; }
.mx .mx-b-cfc .on i.e { background: #2e6ff2; }
.mx .mx-b-cfc b { font-size: 11.5px; font-variant-numeric: tabular-nums; }
.mx .mx-b-cfc small { font-size: 10px; color: var(--mu); }
.mx .mx-b-mixl i.cc { background: #12a26f; }
.mx .mx-b-remc { display: flex; flex-direction: column; gap: 6px; }
.mx .mx-b-remc > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0; }
.mx .mx-b-remc > header small { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; color: var(--mu); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-remc > header .mx-i { width: 12px; height: 12px; }
.mx .mx-b-remc > b { font-size: 13px; }
.mx .mx-b-remc p { margin: 0; font-size: 11.5px; line-height: 1.5; color: var(--tx2); }
.mx .mx-b-remc .pay { margin-top: auto; display: flex; align-items: center; gap: 10px; }
.mx .mx-b-remc .pay span { display: inline-flex; align-items: center; gap: 6px; background: var(--ac); color: #fff; font-size: 11.5px; font-weight: 650; border-radius: 7px; padding: 6px 11px; }
.mx .mx-b-remc .pay .mx-i { width: 13px; height: 13px; }
.mx .mx-b-remc .pay small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-remc .pay { margin-top: 4px; }
.mx .mx-b-cfc { height: 104px; }
.mx .mx-b-remc .pay span { white-space: nowrap; }
/* 62 staff onboarding */
.mx .mx-b-chk > div.done b { text-decoration: none !important; color: var(--tx) !important; opacity: 1 !important; }
.mx .mx-b-crew { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 6px; }
.mx .mx-b-crew > span { display: flex; flex-direction: column; align-items: center; gap: 2px; background: #fff; border: 1px solid var(--bd); border-radius: 10px; padding: 8px 4px; }
.mx .mx-b-crew .mx-face { width: 30px; height: 30px; margin-bottom: 2px; }
.mx .mx-b-crew b { font-size: 11.5px; }
.mx .mx-b-crew small { font-size: 10px; color: var(--mu); }
.mx .mx-b-dnote { display: flex; gap: 10px; align-items: flex-start; margin-top: 12px; padding: 10px 12px; border-radius: 12px; background: #f7f8fa; border: 1px solid var(--bd2); }
.mx .mx-b-dnote .mx-face { width: 28px; height: 28px; flex: none; }
.mx .mx-b-dnote p { margin: 0; font-size: 12px; line-height: 1.45; color: var(--tx2); }
.mx .mx-b-dnote small { display: block; font-size: 10.5px; color: var(--mu); margin-top: 2px; }
.mx .mx-b-chk .done > b, .mx .mx-b-ai.done > b { color: var(--tx2) !important; text-decoration: none !important; font-weight: 550; }
.mx .mx-b-chk > div { padding-top: 5.5px; padding-bottom: 5.5px; }
.mx .mx-b-dnote { margin-top: 10px; padding: 8px 12px; align-items: center; }
.mx .mx-b-dnote p { display: flex; justify-content: space-between; gap: 10px; flex: 1; }
.mx .mx-b-dnote small { margin: 0; white-space: nowrap; }
/* 64 client reporting */
.mx .mx-b-topad { display: flex; gap: 9px; align-items: center; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--bd2); }
.mx .mx-b-topad .th { width: 58px; height: 38px; min-height: 0; border-radius: 6px; flex: none; }
.mx .mx-b-topad > div { min-width: 0; }
.mx .mx-b-topad small { display: block; font-size: 10px; color: var(--mu); white-space: nowrap; }
.mx .mx-b-topad b { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
/* 71 board pack slides */
.mx .mx-b-pages .pg2 { position: relative; width: 100%; height: 58px; background: #fff; border: 1px solid var(--bd); border-radius: 5px; padding: 6px 7px; box-shadow: var(--sh1); overflow: hidden; display: flex; flex-direction: column; gap: 2px; font-family: Inter, sans-serif; }
.mx .mx-b-pages .on .pg2 { border: 2px solid var(--ac); padding: 5px 6px; }
.mx .mx-b-pages .pg2 u { text-decoration: none; font-size: 7.5px; font-weight: 750; color: #101828; letter-spacing: -.01em; white-space: nowrap; }
.mx .mx-b-pages .pg2 small { font-size: 6.5px; color: #667085; white-space: nowrap; }
.mx .mx-b-pages .pg2.q0 { background: linear-gradient(135deg, #0f1b2d, #1d3d63); border-color: #0f1b2d; justify-content: flex-end; }
.mx .mx-b-pages .pg2.q0 .bm { position: absolute; top: 6px; left: 7px; }
.mx .mx-b-pages .pg2.q0 .bm .mx-mark { width: 12px; height: 12px; }
.mx .mx-b-pages .pg2.q0 b { font-size: 9.5px; color: #fff; font-family: "Instrument Serif", Georgia, serif; font-weight: 400; }
.mx .mx-b-pages .pg2.q0 small { color: #93c5fd; }
.mx .mx-b-pages .pg2 .k3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px; margin-top: 3px; }
.mx .mx-b-pages .pg2 .k3 span { background: #f2f6ff; border-radius: 3px; padding: 3px 3px; display: flex; flex-direction: column; }
.mx .mx-b-pages .pg2 .k3 b { font-size: 7.5px; color: #1d4ed8; }
.mx .mx-b-pages .pg2 .k3 small { font-size: 5.5px; }
.mx .mx-b-pages .pg2 .tr { display: flex; justify-content: space-between; font-size: 6px; color: #475467; border-bottom: .5px solid #eaecf0; line-height: 1.35; }
.mx .mx-b-pages .pg2 .tr.b { font-weight: 750; color: #101828; }
.mx .mx-b-pages .pg2 svg { width: 100%; height: 32px; display: block; }
.mx .mx-b-pages .pg2 .rag { display: grid; grid-template-columns: repeat(4, 1fr); gap: 3px; margin: 3px 0 1px; }
.mx .mx-b-pages .pg2 .rag i, .mx .mx-b-pages .pg2 .rk i { display: block; height: 7px; border-radius: 2px; background: #12a26f; }
.mx .mx-b-pages .pg2 .rag i.a, .mx .mx-b-pages .pg2 .rk i.a { background: #f79009; }
.mx .mx-b-pages .pg2 .rag i.r, .mx .mx-b-pages .pg2 .rk i.r { background: #f04438; }
.mx .mx-b-pages .pg2 i.hb { display: block; height: 5px; border-radius: 2px; background: linear-gradient(90deg, #93b4ff, #2e6ff2); margin-top: 2px; }
.mx .mx-b-pages .pg2 .rk { display: flex; align-items: center; gap: 3px; font-size: 6px; color: #475467; white-space: nowrap; }
.mx .mx-b-pages .pg2 .rk i { width: 5px; height: 5px; border-radius: 50%; flex: none; }
.mx .mx-b-pages .pg2 .pp { display: flex; margin: 3px 0 2px; }
.mx .mx-b-pages .pg2 .pp .mx-face { width: 16px; height: 16px; margin-right: -4px; box-shadow: 0 0 0 1.5px #fff; }
.mx .mx-b-cashc { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: 4px; }
.mx .mx-b-cashc .ya { display: flex; flex-direction: column; justify-content: space-between; padding: 8px 0 14px; }
.mx .mx-b-cashc .ya small { font-size: 9.5px; color: var(--mu2); text-align: right; }
.mx .mx-b-cashc .pl { position: relative; }
.mx .mx-b-cashc .pl svg { width: 100%; height: 190px; }
.mx .mx-b-cashc .pt { position: absolute; transform: translateX(-50%); font-size: 10px; font-weight: 700; color: #fff; background: #0f1b2d; border-radius: 4px; padding: 1px 5px; }
.mx .mx-b-cashc .pt.f { transform: none; background: #fff; color: #1d4ed8; border: 1px solid #c7d7fe; }
.mx .mx-b-cashc + .mx-b-xl { margin-left: 42px; width: auto; }
/* 75 business health */
.mx .mx-b-hs { display: flex; flex-direction: column; }
.mx .mx-b-risk { margin-top: 14px; text-align: left; background: #fef3f2; border: 1px solid #fecdca; border-radius: 12px; padding: 10px 12px; }
.mx .mx-b-risk small { display: flex; align-items: center; gap: 5px; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: #b42318; }
.mx .mx-b-risk small .mx-i { width: 11px; height: 11px; }
.mx .mx-b-risk b { display: block; font-size: 13px; margin: 3px 0 2px; color: #101828; }
.mx .mx-b-risk p { margin: 0 !important; font-size: 11.5px !important; line-height: 1.45; color: var(--tx2); text-align: left; }
.mx .mx-b-hist2 { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--bd2); text-align: left; }
.mx .mx-b-hist2 > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); }
.mx .mx-b-hist2 > div { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; height: 92px; margin-top: 6px; }
.mx .mx-b-hist2 span { display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; gap: 3px; }
.mx .mx-b-hist2 em { font-style: normal; font-size: 11.5px; font-weight: 650; text-align: center; }
.mx .mx-b-hist2 i { display: block; border-radius: 5px 5px 2px 2px; background: #fde2b7; }
.mx .mx-b-hist2 .on i { background: linear-gradient(180deg, #fbb450, #f79009); }
.mx .mx-b-hist2 .tg i { background: #fff; border: 1.5px dashed #12a26f; }
.mx .mx-b-hist2 .tg em { color: #067647; }
.mx .mx-b-hist2 span small { font-size: 10px; color: var(--mu); text-align: center; white-space: nowrap; }
.mx .mx-b-opp { margin-top: auto; display: flex; align-items: baseline; gap: 8px; padding: 10px 12px; border-radius: 10px; background: var(--grs); }
.mx .mx-b-opp span { font-size: 11.5px; color: var(--tx2); }
.mx .mx-b-opp b { font-size: 15px; color: #067647; }
.mx .mx-b-opp em { margin-left: auto; font-style: normal; font-size: 11px; color: #067647; }
/* 76 market research */
.mx .mx-b-cloud { flex: 1; display: flex; flex-wrap: wrap; align-content: center; justify-content: center; align-items: baseline; gap: 4px 14px; padding: 6px 4px; min-height: 0; }
.mx .mx-b-cloud span { font-weight: 650; letter-spacing: -.02em; line-height: 1.15; color: #475467; white-space: nowrap; }
.mx .mx-b-cloud sup { font-size: 9px; font-weight: 600; color: var(--mu2); margin-left: 2px; letter-spacing: 0; }
.mx .mx-b-cloud .c5 { font-size: 30px; color: var(--ac2); }
.mx .mx-b-cloud .c4 { font-size: 22px; color: #1d4ed8; }
.mx .mx-b-cloud .c3 { font-size: 17px; color: #0e7490; }
.mx .mx-b-cloud .c2 { font-size: 13.5px; color: #475467; }
.mx .mx-b-cloud .c1 { font-size: 11.5px; color: #98a2b3; font-weight: 550; }
.mx .mx-b-c:has(.mx-b-cloud) { display: flex; flex-direction: column; }
.mx .mx-b-cloud { gap: 6px 16px; }
.mx .mx-b-cloud .c5 { font-size: 40px; }
.mx .mx-b-cloud .c4 { font-size: 27px; }
.mx .mx-b-cloud .c3 { font-size: 20px; }
.mx .mx-b-cloud .c2 { font-size: 15px; }
.mx .mx-b-cloud .c1 { font-size: 12.5px; }
/* 79 meeting notes */
.mx .mx-b-kmo { margin-top: 10px; padding: 10px 12px; border-left: 3px solid #7c3aed; background: #f7f5ff; border-radius: 4px 10px 10px 4px; }
.mx .mx-b-kmo small { display: flex; align-items: center; gap: 5px; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; font-weight: 700; color: #6d28d9; }
.mx .mx-b-kmo small .mx-i { width: 11px; height: 11px; }
.mx .mx-b-kmo p { margin: 4px 0 6px; font-family: "Instrument Serif", Georgia, serif; font-size: 16px; line-height: 1.3; color: #1f1147; }
.mx .mx-b-kmo span { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 600; color: var(--tx2); }
.mx .mx-b-kmo .mx-face { width: 18px; height: 18px; }
.mx .mx-b-sugg { margin-top: 10px; border: 1px dashed #d0d5dd; border-radius: 10px; padding: 8px 10px; }
.mx .mx-b-sugg > small { display: flex; align-items: center; gap: 5px; font-size: 10.5px; color: var(--mu); margin-bottom: 2px; }
.mx .mx-b-sugg > small .mx-i { width: 11px; height: 11px; color: #7c3aed; }
.mx .mx-b-sugg > div { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 4px 0; }
.mx .mx-b-sugg b { font-size: 12px; font-weight: 550; color: var(--tx2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-kmo { padding: 8px 12px; margin-top: 8px; }
.mx .mx-b-kmo p { font-size: 14.5px; margin: 3px 0 0; display: flex; justify-content: space-between; align-items: flex-end; gap: 10px; }
.mx .mx-b-kmo p span { flex: none; font-family: Inter, sans-serif; }
.mx .mx-b-chap span { padding-top: 3px !important; padding-bottom: 3px !important; }
/* 80 persona */
.mx .mx-b-per { align-items: stretch; text-align: left; gap: 9px; }
.mx .mx-b-perh { display: flex; gap: 12px; align-items: center; margin: -2px -2px 2px; padding: 10px; border-radius: 12px; background: linear-gradient(135deg, #eef6f3, #e6effb); }
.mx .mx-b-perh .ph { width: 92px; height: 108px; flex: none; border-radius: 12px; overflow: hidden; box-shadow: 0 8px 20px -10px rgba(16, 24, 40, .45), 0 0 0 3px #fff; }
.mx .mx-b-prt { width: 100%; height: 100%; display: block; }
.mx .mx-b-perh > div:last-child { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.mx .mx-b-perh small { font-size: 9.5px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--ac2); }
.mx .mx-b-perh b { font-size: 18px; letter-spacing: -.02em; }
.mx .mx-b-perh span { font-size: 11.5px; color: var(--mu); }
.mx .mx-b-perh .mx-b-per-t { justify-content: flex-start; flex-wrap: wrap; margin-top: 5px; gap: 4px; }
.mx .mx-b-perh .mx-b-chip { height: 20px; font-size: 10.5px; padding: 0 6px; background: rgba(255, 255, 255, .8); }
.mx .mx-b-per .mx-b-q2 { text-align: left; margin: 2px 0; }
.mx .mx-b-trig2 > div { flex-wrap: nowrap; }
.mx .mx-b-tstf { margin-top: auto; display: flex; align-items: center; gap: 8px; padding-top: 10px; border-top: 1px solid var(--bd2); font-size: 11px; color: var(--mu); }
.mx .mx-b-tstf span { flex: 1; }
.mx .mx-b-c:has(.mx-b-tstf) { display: flex; flex-direction: column; }
.mx .mx-b-perh .ph { width: 78px; height: 94px; }
.mx .mx-b-perh .mx-b-per-t span.mx-b-chip { font-size: 10px; color: var(--tx2); }
.mx .mx-b-tstf > span:not(.mx-tag):not(.mx-appi) { flex: 1; }
.mx .mx-b-tstf > .mx-tag, .mx .mx-b-tstf > .mx-appi { flex: none; }
.mx .mx-b-objs { width: 100%; text-align: left; border-top: 1px solid var(--bd2); padding-top: 8px; }
.mx .mx-b-objs small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); }
.mx .mx-b-objs > div { padding: 5px 0; }
.mx .mx-b-objs b { display: block; font-size: 11.5px; font-weight: 600; }
.mx .mx-b-objs span { display: flex; align-items: center; gap: 4px; font-size: 10.5px; color: #067647; }
.mx .mx-b-objs .mx-i { width: 10px; height: 10px; }
.mx .mx-b-perh .ph { background: #e9d9c8; } .mx .mx-b-perh .ph svg { width: 100% !important; height: 100% !important; }
/* 87 calculators */
.mx .mx-b-cmpb { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; }
.mx .mx-b-cmpb > small { font-size: 10.5px; color: var(--mu); font-weight: 600; }
.mx .mx-b-cmpb > div { display: grid; grid-template-columns: 96px minmax(0, 1fr) 50px; gap: 10px; align-items: center; font-size: 11.5px; color: var(--tx2); }
.mx .mx-b-cmpb i { height: 8px; border-radius: 999px; background: #f2f4f7; overflow: hidden; }
.mx .mx-b-cmpb i b { display: block; height: 100%; border-radius: 999px; background: #b3bcc9; }
.mx .mx-b-cmpb .you i b { background: linear-gradient(90deg, #fda29b, #f04438); }
.mx .mx-b-cmpb .top i b { background: linear-gradient(90deg, #86e0b7, #12a26f); }
.mx .mx-b-cmpb .you span, .mx .mx-b-cmpb .you em { font-weight: 700; color: #b42318; }
.mx .mx-b-cmpb em { font-style: normal; text-align: right; font-variant-numeric: tabular-nums; }
.mx .mx-b-mcc-b .mx-b-sli.sm { margin-bottom: -2px; }
.mx .mx-b-cmpb { margin-top: 10px; gap: 4px; }
.mx .mx-b-lost { padding-top: 10px; padding-bottom: 10px; }
.mx .mx-b-mcc-b { gap: 11px !important; padding: 18px 24px 16px !important; } .mx .mx-b-cmpb + .mx-b-cap { margin-top: auto; }
/* 90 code */
.mx .mx-b-ide { display: flex; flex-direction: column; }
.mx .mx-b-ide pre { flex: 1 1 auto; min-height: 0; overflow: hidden; }
.mx .mx-b-term { flex-shrink: 0; border-top: 1px solid rgba(255, 255, 255, .08); background: #0a0f1a; }
.mx .mx-b-term .h { display: flex; gap: 14px; padding: 6px 14px; font-size: 10.5px; color: #6b7a90; border-bottom: 1px solid rgba(255, 255, 255, .06); }
.mx .mx-b-term .h .on { color: #e2e8f0; border-bottom: 1px solid #f79009; padding-bottom: 3px; margin-bottom: -7px; }
.mx .mx-b-term .b { padding: 7px 14px 8px; font: 500 11px/1.6 "IBM Plex Mono", monospace; color: #cbd5e1; }
.mx .mx-b-term .b em { font-style: normal; color: #f79009; margin-right: 4px; }
.mx .mx-b-term .ok { color: #86efac; }
.mx .mx-b-term .ok i { font-style: normal; color: #6b7a90; margin-left: 6px; }
.mx .mx-b-term .sm { color: #e2e8f0; }
.mx .mx-b-term .sm b { color: #86efac; }
.mx .mx-b-ide footer .ts { display: inline-flex; align-items: center; gap: 6px; }
.mx .mx-b-ide footer .ts .mx-dot { margin: 0; }
.mx .mx-b-ide footer .ts b { font-weight: 500; }
.mx .mx-b-lat { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--bd2); }
.mx .mx-b-lat .h { display: flex; justify-content: space-between; align-items: baseline; }
.mx .mx-b-lat .h small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-lat .h b { font-size: 12.5px; }
.mx .mx-b-lat svg { width: 100%; height: 52px; display: block; margin-top: 4px; }
.mx .mx-b-lat .x { display: flex; justify-content: space-between; font-size: 9.5px; color: var(--mu2); }
.mx .mx-b-lat svg { height: 34px; }
.mx .mx-b-ide pre { -webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 28px), transparent); mask-image: linear-gradient(180deg, #000 calc(100% - 28px), transparent); }
.mx .mx-b-c:has(.mx-b-ep), .mx .mx-b-c:has(.mx-b-dp) { flex-shrink: 0; }
.mx .mx-b-lat { margin-top: 8px; padding-top: 8px; }
.mx .mx-b-up { flex-shrink: 0; min-height: 24px; }
/* 91 integrations */
.mx .mx-b-intl .mx-b-li { padding: 5px 0; }
.mx .mx-b-intl .mx-appi.sm { width: 24px; height: 24px; }
.mx .mx-b-intf { margin-top: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding-top: 8px; }
.mx .mx-b-intf span { background: #f8f9fb; border-radius: 8px; padding: 7px 10px; font-size: 11px; color: var(--mu); }
.mx .mx-b-intf b { font-size: 14px; color: var(--tx); margin-right: 3px; }
.mx .mx-b-intf b.g { color: #067647; }
/* 96 overnight */
.mx .mx-b-tl { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.mx .mx-b-tl .cd { padding-left: 8px !important; padding-right: 6px !important; gap: 7px !important; }
.mx .mx-b-tl .cd b { font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-tl .cd small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-tl .br span { white-space: nowrap; }
/* 93 doc reading */
.mx .mx-b-paper.inv { display: flex; flex-direction: column; }
.mx .mx-b-invpay { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; padding: 10px 12px; border: 1px solid var(--bd2); border-radius: 8px; background: #fafbfc; }
.mx .mx-b-invpay small { display: block; font-size: 9.5px; letter-spacing: .06em; text-transform: uppercase; font-weight: 700; color: var(--mu); }
.mx .mx-b-invpay b { display: block; font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-invpay span { font-size: 10.5px; color: var(--mu); font-family: "IBM Plex Mono", monospace; }
.mx .mx-b-invft { display: flex; justify-content: space-between; margin-top: auto; padding-top: 10px; border-top: 1px solid var(--bd2); font-size: 10px; color: var(--mu); }
.mx .mx-b-invft em { font-style: normal; }
.mx .mx-b-src3 { display: flex; align-items: center; gap: 6px; margin: 8px -4px -4px; padding: 6px 8px; border-radius: 7px; background: #f2f4f7; font-size: 10.5px; color: var(--mu); }
.mx .mx-b-src3 b { color: var(--tx2); font-weight: 600; }
.mx .mx-b-src3 span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mx .mx-b-mk { height: 262px; margin-top: 4px; }
.mx .mx-b-invpay { display: flex; align-items: center; gap: 10px; grid-template-columns: none; padding: 7px 10px; }
.mx .mx-b-invpay small { flex: none; }
.mx .mx-b-src3 { margin-top: auto; }
.mx .mx-b-invpay span { white-space: nowrap; }
.mx .mx-b-cfoot small { display: flex; align-items: center; gap: 6px; } .mx .mx-b-cfoot small .mx-dot { margin: 0; }
/* 101 voice cloning */
.mx .mx-b-langs { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin: auto 0 8px; }
.mx .mx-b-langs small { font-size: 10.5px; color: var(--mu); margin-right: 2px; }
.mx .mx-b-langs span { font-size: 10.5px; font-weight: 600; color: var(--tx2); background: #f2f4f7; border-radius: 999px; padding: 2px 8px; }
/* 107 AI readiness */
.mx .mx-b-mtx { background-color: #fff !important; background-image: linear-gradient(90deg, transparent calc(50% - .5px), var(--bd) calc(50% - .5px), var(--bd) calc(50% + .5px), transparent calc(50% + .5px)), linear-gradient(180deg, transparent calc(50% - .5px), var(--bd) calc(50% - .5px), var(--bd) calc(50% + .5px), transparent calc(50% + .5px)), linear-gradient(90deg, color-mix(in srgb, var(--ac) 9%, #fff) 50%, #fff8ec 50%), linear-gradient(180deg, transparent 50%, #fff 50%) !important; background-blend-mode: normal; }
.mx .mx-b-mtx::before, .mx .mx-b-mtx::after { display: none !important; }
.mx .mx-b-mtx .qr { color: #b54708; }
.mx .mx-b-ready-n { margin-top: 10px; padding: 8px 10px; background: #fffaf0; border-radius: 8px; font-size: 11.5px; line-height: 1.45; color: var(--tx2); }
.mx .mx-b-ready-n b { color: #b54708; }
.mx .mx-b-qwl { margin-top: auto; border-top: 1px solid var(--bd2); padding-top: 10px; }
.mx .mx-b-qwl > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); }
.mx .mx-b-qwl > div { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto 36px; gap: 8px; align-items: center; padding: 6px 0; font-size: 12px; border-top: 1px solid var(--bd2); }
.mx .mx-b-qwl > small + div { border-top: 0; }
.mx .mx-b-qwl em { width: 20px; height: 20px; border-radius: 6px; display: grid; place-items: center; background: var(--acs); color: var(--ac2); font-style: normal; font-weight: 700; font-size: 10.5px; }
.mx .mx-b-qwl span { font-size: 11px; color: #067647; font-weight: 600; }
.mx .mx-b-qwl div small { font-size: 10.5px; color: var(--mu); text-align: right; }
.mx .mx-b-c:has(.mx-b-qwl) { display: flex; flex-direction: column; }
.mx .mx-b-mtx { background:
  linear-gradient(90deg, transparent calc(50% - .5px), var(--bd) calc(50% - .5px), var(--bd) calc(50% + .5px), transparent calc(50% + .5px)),
  linear-gradient(180deg, transparent calc(50% - .5px), var(--bd) calc(50% - .5px), var(--bd) calc(50% + .5px), transparent calc(50% + .5px)),
  linear-gradient(#eaf5fb, #eaf5fb) 0 0 / 50% 50% no-repeat,
  linear-gradient(#fff7ea, #fff7ea) 100% 0 / 50% 50% no-repeat,
  linear-gradient(#f8f9fb, #f8f9fb) 0 100% / 50% 50% no-repeat,
  linear-gradient(#fdf3f2, #fdf3f2) 100% 100% / 50% 50% no-repeat, #fff !important; }
/* 109 custom assistants */
.mx .mx-b-idn.v2 { gap: 8px; }
.mx .mx-b-idn.v2 > span { flex-direction: column; align-items: center; gap: 3px; border-radius: 12px; padding: 5px 6px 4px; border: 1.5px solid var(--bd); min-width: 58px; }
.mx .mx-b-idn.v2 > span.on { border-color: #0e9384; background: #effaf8; }
.mx .mx-b-idn.v2 > span > .mx-face { width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; }
.mx .mx-b-idn.v2 > span > .mx-agent-av { width: 30px; height: 30px; }
.mx .mx-b-idn.v2 > span > i { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-style: normal; }
.mx .mx-b-idn.v2 > span > i.mono { background: #0f1b2d; color: #5eead4; font: 600 16px/1 "Instrument Serif", Georgia, serif; }
.mx .mx-b-idn.v2 > span > i.icn { background: linear-gradient(145deg, #14b8a6, #0e7490); }
.mx .mx-b-idn.v2 > span > i.icn svg { width: 15px; height: 15px; }
.mx .mx-b-idn.v2 > span > small { font-size: 9.5px; color: var(--mu); }
.mx .mx-b-mayaf .mx-face { width: 34px; height: 34px; box-shadow: 0 0 0 2px rgba(255, 255, 255, .6); }
/* 111 AI policy */
.mx .mx-b-pend > span > .mx-face { width: 18px !important; height: 18px !important; flex: none; border-radius: 50%; }
.mx .mx-b-pend > span > .mx-face svg { width: 18px; height: 18px; }
.mx .mx-b-pend span.mx-face { padding: 0 !important; border: 0 !important; background: none !important; display: inline-block; overflow: hidden; }
.mx .mx-b-wz.rail .mx-b-wrail { gap: 12px; padding-top: 20px; padding-bottom: 16px; } .mx .mx-b-rnote p { margin-bottom: 6px; font-size: 11.5px; }
.mx .mx-b-calc .mx-b-cin { gap: 11px; padding-top: 18px; padding-bottom: 16px; } .mx .mx-b-open { font-size: 16px !important; }
.mx .mx-b-evt { align-self: center; display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; font-size: 10.5px; color: var(--mu); background: #f2f4f7; border-radius: 999px; padding: 4px 10px; }
.mx .mx-b-evt .mx-i { width: 12px; height: 12px; color: #2e6ff2; }
.mx .mx-b-evt b { color: var(--tx2); font-weight: 600; }
.mx .mx-b-ml .mx-b-mr { padding-top: 8px; padding-bottom: 8px; }
.mx .mx-b-ml .mx-b-mr { padding-top: 9px; padding-bottom: 9px; }

/* ===== Loop 2 round 1 (mx-b builder) ===== */
/* 21 speed to lead: full thread, source line on top */
.mx .mx-b-th.s2l { justify-content: flex-start; gap: 6px; padding-top: 10px; }
.mx .mx-b-th.s2l .mx-b-sysm { display: inline-flex; align-self: center; align-items: center; gap: 6px; }
.mx .mx-b-sysm .mx-appi.xs { width: 14px; height: 14px; }
/* 22 missed call: 7 day bars with values */
.mx .mx-b-mct .mx-b-recw .bars { height: 74px; padding-top: 14px; }
.mx .mx-b-recw .bars i { position: relative; }
.mx .mx-b-recw .bars i em { position: absolute; left: 50%; bottom: 100%; transform: translate(-50%, -2px); font-style: normal; font-size: 9.5px; font-weight: 600; color: #475467; white-space: nowrap; }
.mx .mx-b-recw .bars .on i em { color: #067647; }
/* 6 AI departments: handoff node */
.mx .mx-b-n.hand { border: 1px solid #c7d7fe; box-shadow: 0 1px 2px rgba(16, 24, 40, .06), inset 3px 0 0 #2e6ff2; }
.mx .mx-b-n.hand .mx-b-ni .mx-fav { width: 26px; height: 26px; }
/* 8 client onboarding: checklist in the rail, FAQ row, bigger brand files */
.mx .mx-b-need { display: flex; flex-direction: column; gap: 7px; padding: 12px; border-radius: 12px; background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .07); }
.mx .mx-b-need > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: #8fa0bd; margin-bottom: 2px; }
.mx .mx-b-need > div { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: #cbd5e1; }
.mx .mx-b-need > div > i, .mx .mx-b-need > div > .mx-i { width: 15px; height: 15px; flex: none; border-radius: 50%; }
.mx .mx-b-need > div > i { border: 1.5px solid rgba(255, 255, 255, .28); }
.mx .mx-b-need > div > .mx-i { background: #12a26f; color: #fff; padding: 2.5px; stroke-width: 3; }
.mx .mx-b-need > div.ok span { color: #8fa0bd; text-decoration: line-through; text-decoration-color: rgba(143, 160, 189, .5); }
.mx .mx-b-wz .mx-b-need + .mx-b-helpc { margin-top: auto; }
.mx .mx-b-faq > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); }
.mx .mx-b-faq > div { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.mx .mx-b-faq span { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; color: #344054; padding: 5px 10px; border-radius: 999px; border: 1px solid var(--bd); background: #fff; }
.mx .mx-b-faq span .mx-i { width: 12px; height: 12px; color: var(--mu); }
.mx .mx-b-bft > i, .mx .mx-b-bft .ph { width: 40px; height: 40px; border-radius: 8px; }
.mx .mx-b-bft > i .mx-fav { width: 28px; height: 28px; }
.mx .mx-b-bft > i.fo { font-size: 17px; }
.mx .mx-b-faq { display: flex; align-items: center; gap: 10px; }
.mx .mx-b-faq > div { margin-top: 0; flex-wrap: nowrap; }
.mx .mx-b-wz .mx-b-kag { margin-top: 4px; }
/* 23 quiz: stronger step label, plan preview */
.mx .mx-b-qq > small.ey { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: #0b5d43; }
.mx .mx-b-qq > small.ey em { font-style: normal; font-size: 11px; font-weight: 700; letter-spacing: .02em; color: #fff; background: var(--ac); border-radius: 999px; padding: 4px 10px; }
.mx .mx-b-qget2 { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 14px; margin-top: 14px; }
.mx .mx-b-qget2 .doc { position: relative; background: #fff; border: 1px solid #ece7dd; border-radius: 12px; padding: 12px 14px 10px; box-shadow: 0 14px 30px -24px rgba(19, 32, 27, .45); overflow: hidden; }
.mx .mx-b-qget2 .dh { display: flex; align-items: center; gap: 8px; padding-bottom: 8px; margin-bottom: 4px; border-bottom: 1px solid #f0ece4; }
.mx .mx-b-qget2 .dh b { flex: 1; font-size: 12.5px; }
.mx .mx-b-qget2 .dh .mx-b-ring b { font-size: 10px; }
.mx .mx-b-qget2 .r { display: flex; align-items: center; gap: 8px; padding: 5px 0; font-size: 11.5px; color: #344054; }
.mx .mx-b-qget2 .r em { font-style: normal; width: 17px; height: 17px; border-radius: 50%; display: grid; place-items: center; font-size: 10px; font-weight: 700; color: #0b5d43; background: #e3f5ec; flex: none; }
.mx .mx-b-qget2 .r span { flex: 1; min-width: 0; }
.mx .mx-b-qget2 .r b { font-size: 11.5px; color: #067647; }
.mx .mx-b-qget2 .r:nth-child(n+3) { filter: blur(2.2px); opacity: .75; }
.mx .mx-b-qget2 .lock { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; color: #13201b; background: #fff; border: 1px solid #ece7dd; border-radius: 999px; padding: 4px 10px; box-shadow: 0 6px 14px -8px rgba(19, 32, 27, .4); white-space: nowrap; }
.mx .mx-b-qget2 .lock .mx-i { width: 12px; height: 12px; }
.mx .mx-b-qget2 .lst { display: flex; flex-direction: column; gap: 7px; }
.mx .mx-b-qget2 .lst > small { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; color: var(--mu); }
.mx .mx-b-qget2 .lst > div { display: flex; gap: 9px; align-items: center; background: #fff; border: 1px solid #ece7dd; border-radius: 11px; padding: 7px 10px; }
.mx .mx-b-qget2 .lst b { display: block; font-size: 12px; }
.mx .mx-b-qget2 .lst small { font-size: 10.5px; color: var(--mu); }
.mx .mx-b-qget2 .lst .mx-b-ico { width: 28px; height: 28px; border-radius: 8px; flex: none; }
/* 26 pricing calculator: breathing room for the inclusions, note on the 10 year figure */
.mx .mx-b-calc .mx-b-cin { gap: 10px; }
.mx .mx-b-calc .mx-b-incl > div { gap: 8px; }
.mx .mx-b-calc .mx-b-incl > div > span { padding: 9px 11px; }
.mx .mx-b-ten > b .nt { font-size: 11px; font-weight: 500; color: #a7b8cc; margin-left: 6px; letter-spacing: 0; }
.mx .mx-b-fw { display: inline-flex; flex: none; }
/* 32 AI search visibility: engine marks, answer meta */
.mx .mx-b-eng { background: var(--ec); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12); }
.mx .mx-b-eng svg { width: 16px; height: 16px; }
.mx .mx-b-aimeta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 10px; padding-top: 9px; border-top: 1px dashed var(--bd); font-size: 11px; color: var(--mu); }
.mx .mx-b-aimeta span { display: inline-flex; align-items: center; gap: 5px; }
/* 38 competitor tracking: clean brand panel instead of a muddy mix */
.mx .mx-b-mad.clean { background: linear-gradient(180deg, var(--ma), color-mix(in srgb, var(--ma) 82%, #7c2d12)); }
.mx .mx-b-mad.clean .scr { background: linear-gradient(180deg, rgba(0, 0, 0, .38) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, 0) 72%, var(--ma) 100%); }
.mx .mx-b-cn2.mut { margin: 10px 0 12px; color: var(--mu); }
/* 41 website chatbot: hero photo reads at full contrast */
.mx .mx-b-site-hero.h2::after { background: linear-gradient(90deg, rgba(248, 251, 255, .97) 0%, rgba(248, 251, 255, .93) 38%, rgba(248, 251, 255, .45) 50%, rgba(248, 251, 255, 0) 62%); }
/* 43 internal assistant: app avatar is the company mark */
.mx .mx-b-botav { width: 34px; height: 34px; flex: none; border-radius: 8px; overflow: hidden; display: grid; place-items: center; box-shadow: 0 0 0 1px rgba(16, 24, 40, .08); }
.mx .mx-b-botav > * { width: 34px !important; height: 34px !important; border-radius: 8px !important; }
.mx .mx-b-botav svg { width: 100%; height: 100%; }
/* 44 inbox triage: organisation marks, similar jobs */
.mx .mx-b-orgav { width: 26px; height: 26px; flex: none; display: grid; place-items: center; border-radius: 50%; overflow: hidden; }
.mx .mx-b-orgav svg { width: 100%; height: 100%; display: block; }
.mx .mx-b-orgav .mx-fav { width: 26px !important; height: 26px !important; border-radius: 7px; }
.mx .mx-b-past { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; margin-top: 10px; font-size: 11.5px; }
.mx .mx-b-past > small { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 600; color: var(--mu); margin-right: 2px; }
.mx .mx-b-past > small .mx-i { width: 12px; height: 12px; }
.mx .mx-b-past span { display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px; border-radius: 8px; background: #f8f9fb; border: 1px solid var(--bd2); color: #344054; }
.mx .mx-b-past span b { font-weight: 650; color: var(--tx); }
.mx .mx-b-past span em { font-style: normal; color: var(--mu); font-size: 10.5px; }
/* 45 sales assistant: "N more" lives in the lane footer */
.mx .mx-b-lf .more { display: inline-flex; align-items: center; gap: 4px; color: var(--ac); font-weight: 600; }
.mx .mx-b-lf .more .mx-i { width: 12px; height: 12px; }
.mx .mx-b-lf b small { font-size: 10.5px; font-weight: 500; color: var(--mu); margin-right: 5px; }
/* 42, 48: live timer pill in a card header (no row divider) */
.mx header > .mx-b-rec { display: inline-flex; padding: 3px 9px; margin: 0 0 0 auto; border: 0; border-radius: 999px; background: #fef3f2; }
/* 49 DM bots: product tiles read as product shots */
.mx .mx-b-car-i { height: 70px; filter: brightness(1.12) saturate(1.1); }
.mx .mx-b-cn2.mut { margin: 8px 0 10px; }
.mx .mx-b-t.seq5 td { padding-top: 6px; padding-bottom: 6px; }
.mx .mx-b-calc .mx-b-cin { gap: 8px; }
.mx .mx-b-calc .mx-b-foot2 { padding-top: 10px; }
/* 23 quiz: fit the plan preview above the footer */
.mx .mx-b-qget2 { margin-top: 10px; gap: 12px; }
.mx .mx-b-qget2 .doc { padding: 10px 12px 8px; }
.mx .mx-b-qget2 .dh { padding-bottom: 6px; }
.mx .mx-b-qget2 .r { padding: 4px 0; }
.mx .mx-b-qget2 .lst { gap: 5px; }
.mx .mx-b-qget2 .lst > div { padding: 5px 10px; }
.mx .mx-b-quiz .mx-b-qq h3 { margin: 6px 0 6px; }
.mx .mx-b-quiz .mx-b-qa { margin-top: 12px; }
.mx .mx-b-quiz .mx-b-prevq { margin-top: 10px; }
.mx .mx-b-quiz .mx-b-qa { margin-bottom: 14px; }
/* 44: seven rows fit with the archive footer */
.mx .mx-b-ml .mx-b-mr { padding-top: 6px; padding-bottom: 6px; }
.mx .mx-b-past { flex-wrap: nowrap; }
.mx .mx-b-past span { white-space: nowrap; }
.mx .mx-b-lf { white-space: nowrap; gap: 8px; }
.mx .mx-b-lf b { white-space: nowrap; }
/* 58 document automation: line items from the deal */
.mx .mx-b-fld.li > div { display: flex; justify-content: space-between; gap: 8px; font-size: 11.5px; padding: 2px 0; }
.mx .mx-b-fld.li > div span { font-weight: 500; color: var(--tx2); margin: 0; }
.mx .mx-b-fld.li > div b { font-weight: 650; font-size: 11.5px; }
.mx .mx-b-fld.li > code { margin-bottom: 3px; }
/* 59 invoice chasing: last column breathes, aged note */
.mx .mx-b-fillg .mx-card.flush .mx-b-t td:last-child, .mx .mx-b-fillg .mx-card.flush .mx-b-t th:last-child { padding-right: 16px; }
.mx .mx-b-agn { display: flex; align-items: center; gap: 5px; margin: 8px 0 0; font-size: 11px; color: #067647; font-weight: 550; }
.mx .mx-b-agn .mx-i { width: 12px; height: 12px; }
/* 62 staff onboarding: good-to-know card in the rail */
.mx .mx-b-need.info > div > .mx-i { background: none; color: #6ee7b7; padding: 0; stroke-width: 1.8; border-radius: 0; }
/* 64 client reporting: title clear of the chart callout */
.mx .mx-b-rc.lw > small { display: block; margin-bottom: 10px; }
/* 71 board pack: bigger page thumbnails, KPI summary footer */
.mx .mx-b-pages .pg2 { height: 68px; padding: 7px 8px; }
.mx .mx-b-pages .pg2 u { font-size: 8.5px; }
.mx .mx-b-pages .pg2 small { font-size: 7.2px; }
.mx .mx-b-pages .pg2 .tr { font-size: 7px; }
.mx .mx-b-pages .pg2 .k3 b { font-size: 8.5px; }
.mx .mx-b-pages .pg2 .k3 small { font-size: 6.2px; }
.mx .mx-b-pages .pg2.q0 b { font-size: 11px; }
.mx .mx-b-pages .pg2 svg { height: 38px; }
.mx .mx-b-kpif { display: flex; align-items: center; gap: 12px; margin-top: auto; padding: 9px 14px; border-top: 1px solid var(--bd2); font-size: 11px; color: var(--tx2); }
.mx .mx-b-kpif span { display: inline-flex; align-items: center; gap: 5px; font-weight: 550; }
.mx .mx-b-kpif i { width: 8px; height: 8px; border-radius: 50%; background: #12a26f; }
.mx .mx-b-kpif i.a { background: #f79009; }
.mx .mx-b-kpif i.r { background: #f04438; }
.mx .mx-b-kpif em { margin-left: auto; font-style: normal; color: var(--mu); }
/* 75 health audit: one colour rule for every score */
.mx .mx-b-ring.green .fg { stroke: #12a26f; }
.mx .mx-b-ar.red { box-shadow: inset 0 3px 0 #f04438, var(--sh1); }
.mx .mx-b-ar.amber { box-shadow: inset 0 3px 0 #f79009, var(--sh1); }
.mx .mx-b-ar.green { box-shadow: inset 0 3px 0 #12a26f, var(--sh1); }
.mx .mx-b-legend { display: flex; justify-content: center; gap: 10px; font-size: 10px; color: var(--mu); margin: -2px 0 4px; }
.mx .mx-b-legend span { display: inline-flex; align-items: center; gap: 4px; }
.mx .mx-b-legend i { width: 7px; height: 7px; border-radius: 50%; background: #12a26f; }
.mx .mx-b-legend i.r { background: #f04438; }
.mx .mx-b-legend i.a { background: #f79009; }
/* 80 avatar: reads row fills the card foot */
.mx .mx-b-reads { width: 100%; margin-top: 10px; }
.mx .mx-b-reads small { display: block; font-size: 10.5px; color: var(--mu); font-weight: 600; margin-bottom: 5px; }
.mx .mx-b-reads > div { display: flex; flex-wrap: wrap; gap: 5px; }
.mx .mx-b-reads .mx-b-chip { font-size: 10.5px; }
/* 87 calculators: label what the lead value means */
.mx .mx-b-lose { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.2; }
.mx .mx-b-lose small { font-size: 10px; color: #b42318; font-weight: 600; }
.mx .mx-b-lose b { color: #b42318; }
/* 91 integrations: straight spokes, per-app counts, data packets */
.mx .mx-b-hubc > svg path { stroke-dasharray: 5 5; }
.mx .mx-b-hubc > svg circle.pk { fill: var(--ac); stroke: #fff; stroke-width: 1.5; }
.mx .mx-b-hcnt { position: absolute; transform: translate(-50%, -50%); z-index: 1; font: 600 10px/1 "IBM Plex Mono", monospace; color: #0b5d43; background: #fff; border: 1px solid color-mix(in srgb, var(--ac) 35%, #e4e7ec); border-radius: 999px; padding: 3px 7px; box-shadow: 0 2px 6px -3px rgba(16, 24, 40, .25); white-space: nowrap; }
.mx .mx-b-hn .mx-appi.lg { background: #fff; border-radius: 11px; }
/* 92 data entry: field confidence */
.mx .mx-b-ff div em.cf { margin-left: auto; margin-right: 7px; font: 500 10px/1 "IBM Plex Mono", monospace; color: #067647; background: #e3f5ec; border-radius: 4px; padding: 2px 5px; }
/* 96 overnight pulls: boxed check outcomes, scaled email chart */
.mx .mx-b-tl .chk .br { margin-top: -6px; padding: 9px 9px 6px; border: 1px solid #c9ecd9; border-top: 0; border-radius: 0 0 10px 10px; background: #fbfefc; }
.mx .mx-b-bmc { position: relative; display: grid; grid-template-columns: 30px minmax(0, 1fr); grid-template-rows: auto 1fr; margin: 6px 12px 0; column-gap: 4px; }
.mx .mx-b-bmc .ttl { grid-column: 1 / -1; font-size: 9.5px; font-weight: 600; color: var(--mu); margin-bottom: 2px; }
.mx .mx-b-bmc .ya { display: flex; flex-direction: column; justify-content: space-between; font-size: 9px; color: var(--mu2); text-align: right; padding: 2px 0 4px; }
.mx .mx-b-bmc .pl { position: relative; }
.mx .mx-b-bmc .pl .mx-b-line { margin: 0; width: 100%; }
.mx .mx-b-bmc .vl { position: absolute; right: 6px; top: 2px; font-size: 10px; font-weight: 700; color: #fff; background: var(--ac); border-radius: 5px; padding: 1px 6px; }
.mx .mx-b-bmx { padding-left: 46px; }
.mx .mx-b-tl .chk .cd { position: relative; z-index: 1; }
/* 109 custom assistants: knowledge footer */
.mx .mx-b-kft { display: flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 9px; border-top: 1px dashed var(--bd); font-size: 11px; color: var(--mu); }
.mx .mx-b-kft .mx-i { width: 12px; height: 12px; }
/* 101 voice cloning: languages on one row */
.mx .mx-b-langs { flex-wrap: nowrap; }
.mx .mx-b-langs span { white-space: nowrap; }
.mx .mx-b-lf b small { display: inline; }
.mx .mx-b-rc.lw > small { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
.mx .mx-b-rc.lw > small em { font-style: normal; font-size: 11px; color: #067647; font-weight: 600; }
.mx .mx-b-rc.lw > small em b { font-size: 13px; color: var(--tx); margin-right: 2px; }
/* 93: pay run on the pay-to line */
.mx .mx-b-invpay em { margin-left: auto; font-style: normal; font-size: 10.5px; font-weight: 600; color: #067647; background: #e7f6ee; border-radius: 999px; padding: 2px 8px; white-space: nowrap; }
.mx .mx-b-invpay { display: flex; align-items: center; gap: 8px; }
/* 17 win-back email: bigger hero with depth */
.mx .mx-b-hero2 { height: 112px; border-radius: 6px; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .04); }
/* 50 research agent: steps spread down the card, no gap above the stats */
.mx .mx-b-c:has(> .mx-b-steps) { display: flex; flex-direction: column; }
.mx .mx-b-c > .mx-b-steps { flex: 1; display: flex; flex-direction: column; margin-bottom: 4px; }
.mx .mx-b-c > .mx-b-steps > div { flex: 1 1 auto; }
.mx .mx-b-c > .mx-b-steps > div:last-child { flex: 0 0 auto; }
/* 79 meeting notes: summary fills evenly */
.mx .mx-b-c:has(> .mx-b-sumul) { display: flex; flex-direction: column; }
.mx .mx-b-c:has(> .mx-b-sumul) .mx-b-kmo { margin-bottom: auto; }
.mx .mx-b-hero2 { height: 100px; }
.mx .mx-b-src3 em { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-style: normal; font-size: 10.5px; color: var(--tx2); font-weight: 600; white-space: nowrap; }
.mx .mx-b-src3 em .mx-i { width: 11px; height: 11px; }
.mx .mx-b-calc .mx-b-cin { gap: 13px; }
.mx .mx-b-calc .mx-b-cin { gap: 11px; }
.mx .mx-b-calc .mx-b-incl > div > span { padding: 7px 10px; gap: 4px; }
.mx .mx-b-calc .mx-b-cin { padding-bottom: 14px; } .mx .mx-b-calc .mx-b-foot2 { margin-top: 2px; }