body.agency {
  --navy: #3b1d5e; --navy2: #52297f; --accent: #e8664a; --accent-soft: #fdebe6; --bg: #faf7fc;
}
body.agency .mark { background: linear-gradient(135deg, #e8664a, #f5a142); }
.apptoggle { display: flex; background: rgba(255, 255, 255, .1); border-radius: 8px; padding: 3px; }
.apptoggle button { border: 0; background: none; color: #c6d2e3; padding: 4px 12px; border-radius: 6px; font-size: 12px; font-weight: 600; }
.apptoggle button.on { background: #fff; color: var(--navy); }
.btn.link { border: 0; background: none; color: var(--accent); padding: 0; text-decoration: underline; }
/* agency desk */
.ckgrid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(320px, 1fr); gap: 20px; align-items: start; max-width: 1280px; }
.hero h2 { margin: 0 0 4px; font-size: 22px; }
.hero p { margin: 0 0 16px; color: var(--ink2); }
.progress { height: 6px; background: var(--line2); border-radius: 3px; overflow: hidden; margin-bottom: 6px; }
.progress i { display: block; height: 100%; background: var(--accent); transition: width .5s; }
.track.compact li { padding: 7px 0; font-size: 12.5px; }
.answer { border-width: 2px; }
.answer.a-approved { border-color: var(--ok); background: var(--ok-soft); }
.answer.a-open { border-color: var(--warn); background: var(--warn-soft); }
.answer.a-declined { border-color: var(--bad); background: var(--bad-soft); }
.ans-k { font-size: 11.5px; text-transform: uppercase; letter-spacing: .5px; color: var(--ink2); }
.ans-t { font-size: 24px; font-weight: 700; margin: 2px 0 6px; }
.answer.a-approved .ans-t { color: var(--ok); } .answer.a-open .ans-t { color: var(--warn); } .answer.a-declined .ans-t { color: var(--bad); }
.answer p { margin: 0 0 10px; }
.msgbox { width: 100%; min-height: 60px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; font: inherit; resize: vertical; }
.thread { margin-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.msg { border-radius: 10px; padding: 8px 12px; max-width: 88%; font-size: 13px; }
.msg.agency { background: #fdebe6; align-self: flex-end; }
.msg.mga { background: #e5edfb; align-self: flex-start; }
.msg .mh { font-size: 12px; margin-bottom: 2px; }
.msg .sys { font-size: 12px; font-weight: 600; color: var(--accent); }
.mine { display: grid; grid-template-columns: 1fr; gap: 16px; max-width: 1400px; }
.mine.with { grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr); align-items: start; }
body.reinsurer {
  --navy: #14332e; --navy2: #1f4a43; --accent: #b8901a; --accent-soft: #f7f0d9; --bg: #f6f7f4;
}
body.reinsurer .mark { background: linear-gradient(135deg, #b8901a, #e0be4d); }
:root {
  --bg: #f4f6f9; --panel: #ffffff; --ink: #0f1b2d; --ink2: #44536a; --muted: #7a879a; --line: #e2e7ee; --line2: #eef1f5;
  --navy: #0d2340; --navy2: #16365f; --accent: #0f9d8a; --accent-soft: #e2f5f2;
  --ok: #1a8a4a; --ok-soft: #e3f4ea; --warn: #b26a00; --warn-soft: #fdf1dc; --bad: #c0352b; --bad-soft: #fbe5e3;
  --info: #2a62c9; --info-soft: #e5edfb; --gray-soft: #eef1f5;
  --mono: ui-monospace, "Cascadia Mono", Consolas, monospace;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { font: 13.5px/1.45 "Segoe UI", system-ui, -apple-system, sans-serif; color: var(--ink); background: var(--bg); display: flex; flex-direction: column; }
button { font: inherit; cursor: pointer; }
.hidden { display: none !important; }
.muted { color: var(--muted); }
.mono { font-family: var(--mono); font-size: 12px; }
.num { font-variant-numeric: tabular-nums; text-align: right; }

/* header */
.top { display: flex; align-items: center; gap: 24px; padding: 0 18px; height: 56px; background: var(--navy); color: #fff; flex: none; }
.brand { display: flex; align-items: center; gap: 10px; }
.mark { width: 32px; height: 32px; border-radius: 8px; background: linear-gradient(135deg, var(--accent), #2bc4ad); display: grid; place-items: center; font-weight: 800; font-size: 18px; color: #fff; }
.mark.big { width: 56px; height: 56px; font-size: 30px; border-radius: 14px; margin: 0 auto 14px; }
.b1 { font-weight: 700; letter-spacing: .2px; }
.b2 { font-size: 11.5px; opacity: .7; white-space: nowrap; }
.brand { flex: none; }
.btn.ghost { white-space: nowrap; }
.tabs { display: flex; gap: 2px; }
.tabs button { white-space: nowrap; background: none; border: 0; color: #c6d2e3; padding: 8px 14px; border-radius: 6px; }
.tabs button:hover { background: var(--navy2); color: #fff; }
.tabs button.on { background: var(--navy2); color: #fff; box-shadow: inset 0 -2px 0 var(--accent); }
.right { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.conn { white-space: nowrap; display: flex; align-items: center; gap: 8px; font-size: 12px; background: var(--navy2); padding: 5px 10px; border-radius: 20px; }
.conn .dot { width: 8px; height: 8px; border-radius: 50%; background: #e05a4f; }
.conn.on .dot { background: #3ddc97; box-shadow: 0 0 0 3px rgba(61, 220, 151, .2); }
.conn a, .conn button { color: #9fe8da; background: none; border: 0; padding: 0; text-decoration: underline; font-size: 12px; }
.btn { border: 1px solid var(--line); background: #fff; color: var(--ink); padding: 6px 12px; border-radius: 6px; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; }
.btn:hover { border-color: #c5ceda; }
.btn.primary { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
.btn.ghost { background: transparent; color: #dce5f1; border-color: #34507a; }
.btn.ghost:hover { background: var(--navy2); }
.btn.ok { background: var(--ok); border-color: var(--ok); color: #fff; }
.btn.warn { background: var(--warn); border-color: var(--warn); color: #fff; }
.btn.bad { background: var(--bad); border-color: var(--bad); color: #fff; }
.btn.sm { padding: 3px 9px; font-size: 12px; }
.btn:disabled { opacity: .5; cursor: default; }
.pill { background: rgba(255, 255, 255, .15); border-radius: 10px; padding: 0 7px; font-size: 11px; }

main { flex: 1; min-height: 0; position: relative; }
.view { height: 100%; }
#v-queue { display: grid; grid-template-columns: 380px 1fr; }

/* sign-in */
.signin { position: absolute; inset: 0; display: grid; place-items: center; background: var(--bg); z-index: 5; }
.signin .card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 36px 40px; max-width: 520px; text-align: center; box-shadow: 0 10px 40px rgba(13, 35, 64, .08); }
.signin h1 { font-size: 20px; margin: 0 0 12px; }
.signin p { color: var(--ink2); }
.signin .btn { margin-top: 10px; padding: 10px 20px; font-size: 14px; }

/* queue */
.queue { border-right: 1px solid var(--line); background: #fff; display: flex; flex-direction: column; min-height: 0; }
.qhead { padding: 12px; border-bottom: 1px solid var(--line); }
.qtop { display: flex; gap: 8px; }
.qmore { margin-top: 8px; }
.qmore > summary { font-size: 12px; color: var(--muted); cursor: pointer; user-select: none; }
.qmore > summary:hover { color: var(--ink2); }
.qmore[open] > summary { margin-bottom: 2px; }
.qtop .btn { white-space: nowrap; }
.qhead input { width: 100%; padding: 8px 10px; border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 9px; }
.chip { border: 1px solid var(--line); background: #fff; border-radius: 14px; padding: 2px 10px; font-size: 12px; color: var(--ink2); }
.chip.on { background: var(--navy); border-color: var(--navy); color: #fff; }
.chip b { font-weight: 600; margin-left: 3px; }
.qlist { overflow: auto; flex: 1; }
.qi { padding: 11px 14px; border-bottom: 1px solid var(--line2); cursor: pointer; display: grid; grid-template-columns: 1fr auto; gap: 2px 10px; }
.qi:hover { background: #f8fafc; }
.qi.sel { background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--accent); }
.qi .t { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qi .s { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qi .r { text-align: right; }
.qi .ts { grid-column: 1 / -1; font-size: 11.5px; color: var(--ink2); }
.stamp { white-space: nowrap; }
.qi .meta { grid-column: 1 / -1; display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }

/* badges */
.badge { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 10px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.b-open, .b-Refer, .b-Elevated { background: var(--warn-soft); color: var(--warn); }
.b-approved, .b-clear, .b-Eligible, .b-Low { background: var(--ok-soft); color: var(--ok); }
.b-declined, .b-Decline, .b-High { background: var(--bad-soft); color: var(--bad); }
.b-referred, .b-Moderate, .b-Medium { background: var(--info-soft); color: var(--info); }
.b-awaiting, .b-n, .b-Needs-information { background: var(--gray-soft); color: var(--ink2); }
.b-written { background: var(--navy); color: #fff; }
.tag { font-size: 11px; color: var(--ink2); background: var(--gray-soft); border-radius: 4px; padding: 0 6px; }

/* source chip: where each panel's data came from */
.src { font: 11px var(--mono); color: var(--accent); background: var(--accent-soft); border-radius: 4px; padding: 1px 6px; white-space: nowrap; cursor: help; }

/* detail */
.detail { overflow: auto; padding: 20px 24px 60px; min-width: 0; }
.empty { color: var(--muted); text-align: center; margin-top: 30vh; }
.dh { display: flex; align-items: flex-start; gap: 14px; }
.dh h2 { margin: 0; font-size: 20px; }
.dh .sub { color: var(--ink2); font-size: 12.5px; margin-top: 3px; display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.dh .st { margin-left: auto; text-align: right; display: flex; flex-direction: column; gap: 6px; align-items: flex-end; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin: 18px 0; }
.kpi { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 11px 14px; }
.kpi .l { font-size: 11.5px; color: var(--muted); text-transform: uppercase; letter-spacing: .4px; }
.kpi .v { font-size: 21px; font-weight: 700; margin-top: 2px; font-variant-numeric: tabular-nums; }
.kpi .v small { font-size: 12px; font-weight: 500; color: var(--muted); }
.panel { background: #fff; border: 1px solid var(--line); border-radius: 10px; margin-bottom: 16px; }
.ph { display: flex; align-items: center; gap: 10px; padding: 11px 16px; border-bottom: 1px solid var(--line2); }
.ph h3 { margin: 0; font-size: 14px; }
.ph .src { margin-left: auto; }
.pb { padding: 14px 16px; }

/* decision bar */
.decide { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: center; }
.decide textarea { width: 100%; min-height: 38px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 6px; font: inherit; resize: vertical; }
.decide .btns { display: flex; gap: 6px; }
.decision-now { font-size: 12.5px; color: var(--ink2); margin-bottom: 9px; }

/* table */
table { width: 100%; border-collapse: collapse; }
th { text-align: left; font-size: 11.5px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .3px; padding: 8px 10px; border-bottom: 1px solid var(--line); background: #fafbfd; position: sticky; top: 0; }
td { padding: 8px 10px; border-bottom: 1px solid var(--line2); vertical-align: top; }
tr.loc, tr.arow { cursor: pointer; }
tr.loc:hover td, tr.arow:hover td { background: #f8fafc; }
tr.loc.open td, tr.arow.open td { background: var(--accent-soft); }
tr.ex td { background: #fbfcfe; padding: 0; }
.exin { padding: 14px 16px 16px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.exin h4 { margin: 0 0 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); display: flex; gap: 8px; align-items: center; }
.kv { display: grid; grid-template-columns: auto 1fr; gap: 3px 12px; font-size: 12.5px; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; }
.issue { background: var(--warn-soft); border-radius: 6px; padding: 6px 9px; margin-bottom: 6px; font-size: 12.5px; }
.issue b { color: var(--warn); }
.exin .actions { grid-column: 1 / -1; display: flex; gap: 6px; align-items: center; border-top: 1px solid var(--line2); padding-top: 12px; flex-wrap: wrap; }
.exin .actions input { flex: 1; min-width: 200px; padding: 6px 9px; border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.bar { height: 6px; background: var(--line2); border-radius: 3px; overflow: hidden; width: 60px; display: inline-block; vertical-align: middle; margin-left: 6px; }
.bar i { display: block; height: 100%; background: var(--accent); }
.log li { margin-bottom: 5px; font-size: 12.5px; }
.log { margin: 0; padding-left: 18px; }

/* portfolio */
.pf, .ig { padding: 20px 24px 60px; overflow: auto; height: 100%; }
.grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.hbar { display: grid; grid-template-columns: 150px 1fr 110px; gap: 10px; align-items: center; margin-bottom: 7px; font-size: 12.5px; }
.hbar .track { height: 14px; background: var(--line2); border-radius: 3px; overflow: hidden; }
.hbar .track i { display: block; height: 100%; }
.rs { border: 1px solid var(--line); border-radius: 8px; padding: 12px 14px; margin-bottom: 10px; }
.rs .rv { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.rs .rv span { font: 11.5px var(--mono); background: var(--gray-soft); border-radius: 4px; padding: 1px 6px; }

/* integration */
.flow { display: grid; grid-template-columns: 1fr 120px 1.1fr 120px 1fr; align-items: center; gap: 0; margin: 6px 0 4px; }
.node { border: 1.5px solid var(--line); border-radius: 12px; padding: 14px 16px; background: #fff; min-height: 150px; }
.node h4 { margin: 0 0 6px; font-size: 14px; }
.node ul { margin: 6px 0 0; padding-left: 17px; font-size: 12.5px; color: var(--ink2); }
.node.us { border-color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
.node.mpac { border-color: var(--navy); background: var(--navy); color: #fff; }
.node.mpac ul { color: #c6d2e3; }
.arrow { text-align: center; font-size: 11.5px; color: var(--ink2); }
.arrow .ln { height: 2px; background: var(--accent); margin: 6px 8px; position: relative; }
.arrow .ln:after { content: ""; position: absolute; right: -2px; top: -4px; border: 5px solid transparent; border-left-color: var(--accent); }
.arrow .ln.both:before { content: ""; position: absolute; left: -2px; top: -4px; border: 5px solid transparent; border-right-color: var(--accent); }
pre.code { background: #0d1726; color: #d6e2f0; padding: 14px 16px; border-radius: 8px; font: 12px/1.5 var(--mono); overflow: auto; margin: 0; }
pre.code .k { color: #7fd7c8; } pre.code .s { color: #f3c98b; } pre.code .c { color: #6c7f99; }

/* drawer */
.drawer { position: fixed; right: 0; top: 56px; bottom: 0; width: 460px; background: #fff; border-left: 1px solid var(--line); box-shadow: -10px 0 30px rgba(13, 35, 64, .08); display: flex; flex-direction: column; z-index: 10; }
.dhead { display: flex; gap: 10px; align-items: baseline; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.dhead .x { margin-left: auto; border: 0; background: none; font-size: 20px; color: var(--muted); }
.calls { overflow: auto; flex: 1; }
.call { padding: 9px 16px; border-bottom: 1px solid var(--line2); font-size: 12.5px; }
.call .h { display: flex; gap: 8px; align-items: center; }
.call .tool { font: 12px var(--mono); font-weight: 600; }
.call .k { font-size: 10.5px; text-transform: uppercase; font-weight: 700; padding: 0 5px; border-radius: 3px; }
.tag.t-ag { background: #fdebe6; color: #b8452c; } .tag.t-mga { background: #e2f5f2; color: #0c7d6e; }
.fchip { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 600; padding: 0 7px; border-radius: 10px; background: var(--bad-soft); color: var(--bad); white-space: nowrap; margin-right: 3px; }
.fchip.linked { background: transparent; border: 1px dashed var(--bad); font-weight: 500; }
.flagrow { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: start; padding: 8px 0; border-bottom: 1px solid var(--line2); }
.flagrow:last-child { border-bottom: 0; }
.flagrow.closed { opacity: .55; }
.ph .fchip { margin-left: 4px; }
.req { color: var(--bad); font-weight: 700; margin-left: 2px; }
.reqnote { padding: 0 16px 12px; font-size: 12px; color: var(--ink2); }
.reqerr { color: var(--bad); font-weight: 600; }
label.invalid { color: var(--bad); }
label.invalid input, label.invalid select { border-color: var(--bad); box-shadow: 0 0 0 3px var(--bad-soft); }
.progs { background: rgba(255,255,255,.7); border: 1px solid var(--line); border-radius: 8px; padding: 8px 12px; margin: 4px 0 10px; }
.progs-h { font-size: 12.5px; margin-bottom: 6px; }
.prog { display: grid; grid-template-columns: 10px 1fr auto; gap: 8px; align-items: center; padding: 4px 0; border-top: 1px solid var(--line2); font-size: 13px; }
.prog .pdot { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); }
.prog.p-approved .pdot { background: var(--ok); } .prog.p-open .pdot { background: var(--warn); } .prog.p-declined .pdot { background: var(--bad); }
.rcbar { display: flex; gap: 20px; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; }
.rcbar .rv { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.rcact { display: flex; flex-direction: column; align-items: flex-start; text-align: left; }   /* the re-check button sits under "Last re-check" */
.chg { font-size: 12.5px; padding: 3px 0; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.chg.better b { color: var(--ok); } .chg.worse b { color: var(--bad); }
/* agency accordion */
.chev { color: var(--muted); margin-left: 6px; font-size: 12px; }
.acc { padding: 14px 16px 16px; background: #fcfbfe; border-left: 3px solid var(--accent); }
.acc-grid { display: grid; grid-template-columns: 1.1fr 1fr 1fr; gap: 18px; }
.acc h4 { margin: 0 0 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); display: flex; gap: 8px; align-items: center; }
.acc-next { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line2); }
.ans-mini { font-weight: 700; font-size: 15px; margin-bottom: 6px; }
.ans-mini.a-approved { color: var(--ok); } .ans-mini.a-open { color: var(--warn); } .ans-mini.a-declined { color: var(--bad); }
table.mini { width: 100%; font-size: 12.5px; } table.mini th, table.mini td { padding: 4px 6px; }
@media (max-width: 1100px) { .acc-grid { grid-template-columns: 1fr; } }
/* programs: why a rule fired */
.prow { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-top: 1px solid var(--line2); cursor: pointer; }
.prow:hover { background: #f8fafc; } .prow.open { background: var(--accent-soft); }
.prow .pr-r { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.pwhy { padding: 6px 16px 14px 34px; background: #fbfcfe; border-top: 1px solid var(--line2); }
.ploc + .ploc { margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--line); }
.pl-h { font-weight: 600; font-size: 12.5px; margin-bottom: 6px; display: flex; gap: 8px; align-items: center; }
.why { border-left: 3px solid var(--warn); background: #fff; border-radius: 0 6px 6px 0; padding: 7px 10px; margin: 6px 0; font-size: 13px; }
.why.w-decline { border-left-color: var(--bad); }
.why .wh { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.why .wt { color: var(--ink2); font-size: 12.5px; margin-top: 3px; }
.why .wc { font-size: 12.5px; margin-top: 4px; color: var(--ink2); }
/* consolidator */
.cgrid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: 18px; align-items: start; max-width: 1500px; }
.drop { display: block; border: 2px dashed var(--line); border-radius: 10px; padding: 22px; text-align: center; cursor: pointer; background: #fff; }
.drop.over, .drop:hover { border-color: var(--accent); background: var(--accent-soft); }
.drop input { display: none; }
.chat { display: flex; flex-direction: column; }
.clog { max-height: 62vh; overflow: auto; padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.bub { padding: 9px 13px; border-radius: 12px; max-width: 92%; font-size: 13.5px; line-height: 1.5; }
.bub p { margin: 0 0 6px; } .bub p:last-child { margin: 0; } .bub ul, .bub ol { margin: 4px 0 6px; padding-left: 20px; } .bub li { margin: 2px 0; } .bub .sub { padding-left: 34px; }
.bub.me { align-self: flex-end; background: var(--accent); color: #fff; }
.bub.ai { align-self: flex-start; background: #f3f0f8; }
.bub.err { background: var(--bad-soft); color: var(--bad); }
.typing span { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--muted); margin-right: 3px; animation: blink 1.2s infinite; }
.typing span:nth-child(2) { animation-delay: .2s; } .typing span:nth-child(3) { animation-delay: .4s; }
@keyframes blink { 50% { opacity: .2; } }
.cin { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--line2); }
.cin textarea { flex: 1; padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; font: inherit; resize: vertical; }
.ccard { border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; background: #fff; }
.ccard.ok { border-color: var(--ok); background: var(--ok-soft); }
.cc-h { margin-bottom: 8px; font-size: 13px; }
.best { border: 2px solid var(--ok); background: var(--ok-soft); border-radius: 10px; padding: 12px 16px; margin-bottom: 14px; }
h4.sec { margin: 16px 0 6px; font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); }
table.mini tr.hl td { background: var(--ok-soft); }
.pa { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; padding: 1px 0; }
@media (max-width: 1100px) { .cgrid { grid-template-columns: 1fr; } }
/* header fits five tabs: the connection pill shortens itself */
.top { gap: 14px; }
.tabs { min-width: 0; overflow-x: auto; scrollbar-width: none; }
.tabs button { padding: 8px 11px; }
.right { min-width: 0; flex-shrink: 1; }
.conn { min-width: 0; max-width: 360px; overflow: hidden; text-overflow: ellipsis; }
.appts { font-size: 12px; color: var(--ink2); display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin: -8px 0 14px; }
#qscope { margin-top: 9px; }
.why .origin { font-size: 12px; margin-top: 5px; padding-top: 5px; border-top: 1px dashed var(--line); color: var(--ink2); }
.track.lim { height: 8px; background: var(--line2); border-radius: 4px; overflow: hidden; }
.track.lim i { display: block; height: 100%; }
/* authority */
.crumbs { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; font-size: 13.5px; }
a.nav { color: var(--accent); cursor: pointer; text-decoration: none; } a.nav:hover { text-decoration: underline; }
.augrid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.navlist div { padding: 4px 0; border-bottom: 1px solid var(--line2); font-size: 13px; }
.navlist .rel { display: inline-block; min-width: 140px; color: var(--muted); font-size: 12px; }
.pfbar { display: flex; height: 16px; border-radius: 4px; overflow: hidden; background: var(--line2); }
.pfbar i { display: block; height: 100%; }
.pfleg { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12px; margin-top: 6px; }
tr.grp td { background: #f3f5f8; font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .3px; color: var(--ink2); }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; margin-left: 8px; }
.seg button { border: 0; background: #fff; padding: 3px 10px; font-size: 12px; } .seg button.on { background: var(--navy); color: #fff; }
table.grid td, table.grid th { border-right: 1px solid var(--line2); }
.cstack > div:first-child { margin-bottom: 8px; font-size: 13px; }
.focusbar { background: var(--accent-soft); border-radius: 6px; padding: 5px 9px; font-size: 12.5px; margin-top: 9px; display: flex; gap: 8px; align-items: center; }
@media (max-width: 1100px) { .augrid { grid-template-columns: 1fr; } }
/* connection map */
.mapWrap { padding: 4px 12px 0; overflow-x: auto; }
.mapWrap svg { width: 100%; min-width: 860px; height: auto; display: block; }
.mapN { cursor: grab; } .mapN.drag { cursor: grabbing; } .mapN:focus { outline: none; } .mapN:focus rect, .mapN:hover rect { filter: drop-shadow(0 1px 3px rgba(13, 35, 64, .18)); }
.mapE.on { stroke: var(--accent); stroke-width: 2.25; }
.mapLegend { display: flex; gap: 16px; flex-wrap: wrap; font-size: 11.5px; color: var(--ink2); padding: 6px 16px 12px; align-items: center; }
.mapLegend i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: 5px; vertical-align: -2px; }
.grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
@media (max-width: 1100px) { .grid3 { grid-template-columns: 1fr; } }
/* header menus (desks with more pages than tabs fit) */
.tabs .menu { position: relative; }
.tabs .mhead { white-space: nowrap; }
.tabs .mlist { display: none; position: absolute; top: calc(100% + 4px); left: 0; min-width: 190px; background: var(--navy); border: 1px solid var(--navy2); border-radius: 8px; padding: 4px; z-index: 30; box-shadow: 0 8px 24px rgba(0, 0, 0, .25); }
.tabs .menu.open .mlist { display: block; }
.tabs .mlist button { display: block; width: 100%; text-align: left; }
.tabs { overflow: visible; }
/* agreements: inbox badge, sharing notes, change / notice cards */
.ibadge { display: inline-block; min-width: 17px; padding: 0 5px; margin-left: 6px; border-radius: 9px; background: var(--bad, #c0392b); color: #fff; font-size: 11px; line-height: 17px; text-align: center; font-weight: 700; }
.share-note { margin: 6px 0; padding: 6px 10px; border-radius: 6px; background: var(--line2, #eef0f4); font-size: 12px; }
.pcard { margin-bottom: 10px; }
.pcard .chg { margin: 6px 0 8px; padding-left: 18px; font-size: 13px; }
.pcard .impact { margin: 8px 0 4px; font-size: 12.5px; }
h3.sect { margin: 18px 0 8px; font-size: 14px; }
.whoami { font-size: 11.5px; opacity: .85; }
/* hurricanes */
.hxbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.hxbar select { max-width: 280px; }
.hxbar .seg { margin-left: 0; }
.hxbar .chk { display: flex; gap: 6px; align-items: center; font-size: 12.5px; }
.hxbar .chk input { width: auto; }
.hxmap { width: 100%; height: 380px; background: #eef4fa; border-radius: 6px; z-index: 0; }
.hxmap .grid line { stroke: #cfdbe8; stroke-width: .6; } .hxmap .grid text { font-size: 9px; fill: #7d8ca0; }
.hxmap .trk { fill: none; stroke: #34495e; stroke-width: 1.6; } .hxmap .trk.fc { stroke-dasharray: 5 4; stroke: #7f8c8d; }
/* divisions: header switcher, division cards, SOV upload */
.divsel { margin-left: 4px; max-width: 220px; font-size: 12.5px; padding: 4px 6px; border-radius: 6px; border: 1px solid rgba(255,255,255,.3); background: rgba(255,255,255,.12); color: inherit; }
.divsel option { color: #111; }
.dcard { cursor: pointer; } .dcard:hover { box-shadow: 0 0 0 2px var(--line); }
.kpis.mini .kpi { padding: 8px 10px; } .kpis.mini .v { font-size: 18px; }
.drop { border: 2px dashed var(--line); border-radius: 8px; padding: 18px; text-align: center; } .drop.over { background: var(--line2); }
.mapgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px; }
.mapgrid label { display: flex; flex-direction: column; gap: 3px; font-size: 12px; } .mapgrid label.invalid select { border-color: var(--bad); }
pre.json { max-height: 50vh; overflow: auto; font-size: 11.5px; background: var(--line2); padding: 8px; border-radius: 6px; }
/* binder requests */
.bindbox { border-top: 1px solid var(--line2); padding: 10px 0 0; margin-top: 10px; } .bindbox h4 { margin: 0 0 6px; }
.call .k.read { background: var(--info-soft); color: var(--info); }
.call .k.write { background: var(--warn-soft); color: var(--warn); }
.call .k.oauth { background: var(--accent-soft); color: var(--accent); }
.call .t { margin-left: auto; color: var(--muted); font-size: 11.5px; }
.call .n { color: var(--ink2); margin-top: 2px; }
.call .e { color: var(--bad); margin-top: 2px; }
.call .a { font: 11px var(--mono); color: var(--muted); margin-top: 3px; word-break: break-all; }

/* modal + toast */
.modal { position: fixed; inset: 0; background: rgba(13, 27, 45, .45); display: grid; place-items: center; z-index: 20; }
.mbox { background: #fff; border-radius: 12px; padding: 22px 24px; width: 520px; max-width: 92vw; }
.mbox h3 { margin: 0 0 6px; }
/* a pop-up holding a list (flags, exceptions, placements): wide, and it scrolls (2026-10-14) */
.mbox:has(> .panel) { width: 940px; max-height: 86vh; overflow: auto; }
.mbox > .panel { margin: 0; box-shadow: none; }
.mbox label { display: block; font-size: 12px; color: var(--ink2); margin: 12px 0 4px; }
.mbox input, .mbox select, .mbox textarea { width: 100%; padding: 7px 9px; border: 1px solid var(--line); border-radius: 6px; font: inherit; }
.mbox .row { display: flex; gap: 8px; justify-content: flex-end; margin-top: 18px; align-items: center; }
.mbox .row .chk { margin-right: auto; display: flex; gap: 6px; align-items: center; font-size: 12.5px; color: var(--ink2); }
.mbox .row .chk input { width: auto; }
.mbox pre { background: var(--gray-soft); padding: 10px; border-radius: 6px; font: 11.5px var(--mono); max-height: 220px; overflow: auto; white-space: pre-wrap; }
.toast { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); background: var(--navy); color: #fff; padding: 10px 18px; border-radius: 8px; z-index: 30; box-shadow: 0 8px 24px rgba(0, 0, 0, .2); max-width: 70vw; }
.toast.err { background: var(--bad); }
.loading { color: var(--muted); padding: 40px; text-align: center; }

/* new submission */
.form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 14px; }
.form label { font-size: 12px; color: var(--ink2); display: flex; flex-direction: column; gap: 4px; }
.form input, .form select, .lt input, .lt select { padding: 7px 9px; border: 1px solid var(--line); border-radius: 6px; font: inherit; background: #fff; min-width: 0; }
.form .wide { grid-column: span 2; }
.lt { width: 100%; }
.lt td { padding: 5px 4px; border-bottom: 1px solid var(--line2); }
.lt th { padding: 6px 4px; }
.lt input, .lt select { width: 100%; font-size: 12.5px; padding: 6px 7px; }
.lt .rm { border: 0; background: none; color: var(--muted); font-size: 18px; }
.submitbar { display: flex; align-items: center; gap: 10px; justify-content: flex-end; }
.submitbar .chk { margin-right: auto; display: flex; gap: 6px; align-items: center; font-size: 12.5px; color: var(--ink2); }
.track { list-style: none; margin: 0; padding: 0; }
.track li { display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line2); }
.track .ic { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: var(--gray-soft); color: var(--muted); }
.track li.done .ic { background: var(--ok); color: #fff; }
.track li.now .ic { background: var(--accent-soft); color: var(--accent); animation: pulse 1.2s infinite; }
.track li.warn .ic { background: var(--warn); color: #fff; animation: none; }
.track li.warn > div { color: var(--warn); }
@keyframes pulse { 50% { box-shadow: 0 0 0 5px var(--accent-soft); } }
.track .d { font-size: 12px; color: var(--muted); }
@media (max-width: 1100px) {
  .ckgrid, .mine.with { grid-template-columns: 1fr; }
  #v-queue { grid-template-columns: 300px 1fr; }
  .exin { grid-template-columns: 1fr 1fr; }
  .grid2 { grid-template-columns: 1fr; }
  .flow { grid-template-columns: 1fr; }
  .arrow .ln { display: none; }
}

/* ======================================================================================================================
   v3: the refresh, matching MPAC Connect (public/shell.js builds the sidebar and the page header). These rules come last on purpose.
   ====================================================================================================================== */
:root, body { --bg: #f3f5f8; --panel: #fff; --panel-2: #f2f4f7; --line: #e1e5eb; --line2: #edf0f4; --ink: #1b2330; --ink2: #4b5667; --ink3: #7a8494;
  --accent: #1f5fbf; --accent-soft: #e6eefb; --radius: 12px; --shadow: 0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.04); --side-w: 232px; --top-h: 52px; }
body.agency { --accent: #7b3fb0; --accent-soft: #f2eafa; --bg: #f5f3f8; }
body.reinsurer { --accent: #1f7a5c; --accent-soft: #e2f2ea; --bg: #f3f6f4; }
body { font: 14px/1.45 Inter, "Segoe UI", system-ui, -apple-system, sans-serif; -webkit-font-smoothing: antialiased; background: var(--bg); color: var(--ink); }

/* header: slim and light; brand (home), then status and switches */
.top { height: var(--top-h); background: var(--panel); color: var(--ink); box-shadow: 0 1px 0 var(--line); gap: 16px; padding: 0 18px; position: relative; z-index: 20; }
.top .brand { cursor: pointer; } .top .b1 { color: var(--ink); font-weight: 700; } .top .b2 { color: var(--ink3); }
body:not(.agency):not(.reinsurer) .mark { background: linear-gradient(135deg, #1f5fbf, #3b8be0); }
body.agency .mark { background: linear-gradient(135deg, #7b3fb0, #b06ad6); } body.reinsurer .mark { background: linear-gradient(135deg, #1f7a5c, #3aa57f); }
.top .right { margin-left: auto; display: flex; gap: 8px; align-items: center; }
.top .btn.ghost { background: var(--panel); color: var(--ink2); border: 1px solid var(--line); }
.top .btn.ghost:hover { color: var(--ink); background: var(--panel-2); }
.btn.sm, button.sm { padding: 5px 10px; font-size: 12.5px; border-radius: 6px; }
#divsel { display: none !important; }
/* the header menus (sidebar off) on a light header */
.tabs button, .tabs .mhead { color: var(--ink2); background: none; }
.tabs button:hover { background: var(--panel-2); color: var(--ink); }
.tabs button.on, .tabs .mhead.on { background: var(--accent-soft); color: var(--accent); box-shadow: none; }
.tabs .mlist { background: var(--panel); border-color: var(--line); box-shadow: 0 8px 24px rgba(16,24,40,.12); }
.apptoggle { background: var(--panel-2); } .apptoggle button { color: var(--ink2); } .apptoggle button.on { background: var(--panel); color: var(--accent); box-shadow: var(--shadow); }
body.with-sidebar .top .tabs { display: none; }
.drawer { top: var(--top-h); }

/* the shell: sidebar + page */
.shell { flex: 1; min-height: 0; display: flex; position: relative; }
main { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.view { height: auto; flex: 1; min-height: 0; }
#v-queue { min-height: 0; }
.pf, .ig { padding: 8px 24px 60px; }

/* the sidebar */
.sidenav { display: none; }
body.with-sidebar .sidenav { display: flex; flex-direction: column; gap: 12px; width: var(--side-w); flex: none; background: var(--panel); border-right: 1px solid var(--line); overflow-y: auto; padding: 12px 10px 10px; }
.sn-desk { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; padding: 3px; background: var(--panel-2); border-radius: 9px; }
.sn-desk button { border: 0; background: none; padding: 6px 4px; border-radius: 7px; font: 600 12.5px Inter, system-ui, sans-serif; color: var(--ink2); cursor: pointer; }
.sn-desk button.on { background: var(--panel); color: var(--accent); box-shadow: var(--shadow); }
.sn-pages { display: grid; gap: 10px; }
.sgrp { display: grid; gap: 1px; }
.sg-h { display: flex; align-items: center; gap: 8px; padding: 4px 8px; font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--ink3); }
.sgrp.cur .sg-h { color: var(--accent); }
.sg-a { display: flex; align-items: center; width: 100%; text-align: left; border: 0; background: none; font: 13.5px Inter, system-ui, sans-serif; padding: 6px 10px 6px 32px; color: var(--ink); border-radius: 7px; cursor: pointer; }
.sg-a:hover { background: var(--panel-2); }
.sg-a.on { background: var(--accent-soft); color: var(--accent); font-weight: 600; }
.sg-n { margin-left: auto; font-size: 11px; font-weight: 700; } .sg-n.has { background: #c0392b; color: #fff; border-radius: 9px; padding: 0 6px; line-height: 17px; }
.sg-ico { display: none; border: 0; background: none; cursor: pointer; }
.sn-sec { border-top: 1px solid var(--line); padding-top: 10px; }
.sn-h { font-size: 11px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--ink3); padding: 0 8px 4px; }
.sn-list { display: grid; gap: 1px; }
.sn-list a { display: block; padding: 4px 8px; font-size: 12.5px; color: var(--ink2); text-decoration: none; border-radius: 6px; line-height: 1.3; border-left: 2px solid transparent; }
.sn-list a:hover { background: var(--panel-2); color: var(--ink); }
.sn-list a.on { color: var(--accent); border-left-color: var(--accent); font-weight: 600; }
.sn-list .muted { font-size: 12px; padding: 0 8px; }
.sn-foot { margin-top: auto; display: flex; justify-content: flex-end; padding-top: 6px; }
.sn-min { border: 1px solid var(--line); background: var(--panel); border-radius: 6px; padding: 2px 9px; font-size: 13px; color: var(--ink2); cursor: pointer; }
body.side-min.with-sidebar .sidenav { width: 52px; padding: 12px 6px 10px; overflow-x: hidden; }
body.side-min .sg-h, body.side-min .sg-a, body.side-min .sn-sec, body.side-min .sn-desk button:not(.on) { display: none; }
body.side-min .sn-desk { grid-template-columns: 1fr; }
body.side-min .sg-ico { display: grid; place-items: center; height: 36px; width: 100%; border-radius: 8px; color: var(--ink2); }
body.side-min .sg-ico:hover { background: var(--panel-2); color: var(--ink); }
body.side-min .sg-ico.on { background: var(--accent-soft); color: var(--accent); }
body.side-min .sn-foot { justify-content: center; } body.side-min .sn-min { transform: rotate(180deg); }

/* the page header */
.page-h { display: flex; gap: 16px; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; padding: 16px 24px 12px; flex: none; }
.page-h.hidden { display: none; }
.page-h .ph-t { min-width: 0; flex: 1 1 520px; }
.page-h .ph-crumb { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); }
.page-h h1 { font-size: 22px; line-height: 1.2; margin: 4px 0; letter-spacing: -.015em; font-weight: 700; }
.page-h p { margin: 0; color: var(--ink2); font-size: 13.5px; max-width: 860px; }
.page-h .ph-act { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.page-h .ph-act:empty { display: none; }
/* a page's tabs, under its name (the desk menu map, 2026-10-14) */
.page-h .ph-t .dsk-sub.vt-bar { display: flex; width: max-content; max-width: 100%; margin: 10px 0 0; }
.divseg { display: inline-flex; gap: 2px; padding: 3px; background: var(--panel); border: 1px solid var(--line); border-radius: 9px; margin: 0; }
.divseg button { border: 0; background: none; padding: 5px 12px; border-radius: 6px; font: 600 12.5px Inter, system-ui, sans-serif; color: var(--ink2); cursor: pointer; }
.divseg button.on { background: var(--accent-soft); color: var(--accent); }
/* each page's own hero title and lead now live in the page header */
.view .hero > h2, .view .hero > p:first-of-type { display: none; }
.view .hero { margin-top: 0; }

/* cards, tables, chips */
.panel { border-radius: var(--radius); border-color: var(--line); box-shadow: var(--shadow); }
.kpi { border-radius: var(--radius); }
th { background: var(--panel-2); font-size: 11.5px; text-transform: uppercase; letter-spacing: .03em; color: var(--ink3); }
.badge, .chip { border-radius: 999px; }
@media (max-width: 999px) { body.with-sidebar:not(.side-min) .sidenav { position: absolute; top: 0; bottom: 0; left: 0; z-index: 15; box-shadow: 0 8px 28px rgba(0,0,0,.18); } }
@media (max-width: 640px) { .page-h { padding: 12px 12px 8px; } .page-h h1 { font-size: 19px; } .pf, .ig { padding: 8px 12px 40px; } .top .b2 { display: none; } }

/* the MPAC 2 status pill on the light header */
.top .conn { background: var(--panel-2); color: var(--ink2); border: 1px solid var(--line); border-radius: 999px; padding: 4px 10px; }
.top .conn.on .dot { background: #1f9d6b; box-shadow: 0 0 0 3px rgba(31,157,107,.15); }
.top .conn a, .top .conn button { color: var(--accent); }
body.with-sidebar #new-sub { display: none; }   /* the page header has + New submission */

/* a card title with muted text beside it: the text takes the room left, and wraps under the title when there is little */
.ph { flex-wrap: wrap; row-gap: 4px; }
.ph > .muted { flex: 1 1 240px; min-width: 0; }

/* the MGA platform seat switch (Bind requests) */
.seatbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 4px 0 12px; }

/* data specifications: required / optional elements, the minimum to be considered, programs not considered */
.spec { font-size: 12px; display: grid; gap: 3px; margin-top: 6px; } .spec.compact { margin-top: 4px; }
.spec .tag.req { background: var(--accent-soft); color: var(--accent); } .spec .tag.opt { background: var(--panel-2); color: var(--ink2); }
.minspec { margin-top: 10px; } .minspec tr.el-miss td { background: #fdf1ef; }
.notcons { margin-top: 8px; padding: 8px 10px; border-radius: 8px; background: var(--panel-2); border: 1px dashed var(--line); font-size: 12.5px; }
.notcons > b { display: block; margin-bottom: 4px; color: var(--ink2); }

/* the MGA platform's seat switch (sidebar) */
.sn-seat .sn-h { padding: 0 2px 4px; }
.sn-seats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2px; padding: 3px; background: var(--panel-2); border-radius: 9px; }
.sn-seats button { border: 0; background: none; padding: 5px 2px; border-radius: 7px; font: 600 12px Inter, system-ui, sans-serif; color: var(--ink2); cursor: pointer; }
.sn-seats button.on { background: var(--panel); color: var(--accent); box-shadow: var(--shadow); }
body.side-min .sn-seat { display: none; }

/* the scope picker (Submissions, Portfolio): independent of the Authority focus */
.scope { position: relative; display: inline-block; margin: 4px 0; }
.scope-pop { position: absolute; z-index: 40; top: calc(100% + 4px); left: 0; width: min(440px, 86vw); background: var(--panel); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 10px 30px rgba(16,24,40,.14); padding: 8px; }
.scope-pop input[type=search] { width: 100%; margin-bottom: 6px; }
.scope-list { max-height: 360px; overflow: auto; }
.sc-k { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink3); padding: 8px 4px 2px; }
.sc-i { display: flex; align-items: center; gap: 8px; padding: 4px; border-radius: 6px; font-size: 13px; cursor: pointer; } .sc-i:hover { background: var(--panel-2); }
.sc-i.sub { padding-left: 22px; } .sc-i span { flex: 1; min-width: 0; } .sc-i small { display: block; color: var(--ink3); font-size: 11px; }
.sc-i input { width: auto; } .sc-i .btn.link { font-size: 11.5px; visibility: hidden; } .sc-i:hover .btn.link { visibility: visible; }
.pf-scope { margin-bottom: 8px; }

/* Programs & rules: set above your level = protected, in red */
.progcard h4 { margin: 0 0 6px; }
tr.prot td { background: #fdf0ee; } tr.prot td:first-child { box-shadow: inset 3px 0 0 #c0392b; } tr.prot b { color: #a12a1c; }
tr.mine td:first-child { box-shadow: inset 3px 0 0 var(--ok, #1f9d6b); }
.lock { display: inline-block; font-size: 11.5px; font-weight: 600; color: #a12a1c; background: #fdecea; border: 1px solid #f3c4bd; border-radius: 999px; padding: 1px 8px; white-space: nowrap; }

/* Programs & rules: one accordion per program */
.pg-sum { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 12px 16px; cursor: pointer; }
.pg-sum:hover { background: var(--panel-2); }
.pg-sum .pg-meta { margin-left: auto; font-size: 12px; color: var(--ink2); display: flex; gap: 4px; align-items: center; flex-wrap: wrap; }
.progcard.closed { margin-bottom: 8px; }
.pg-tools { display: flex; gap: 6px; justify-content: flex-end; margin-bottom: 8px; }

/* Ultimate Re: roll-up or one cedent */
.cedpick { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 10px; }
.cedpick input[type=search] { min-width: 260px; }

/* New submission: SOV upload or a single risk */
.newmode { display: inline-flex; gap: 4px; margin: 0 0 10px; }

/* DSS (simulated) */
.simbadge { display: inline-block; font-size: 10.5px; font-weight: 800; letter-spacing: .06em; color: #8a5a00; background: #fff4d6; border: 1px solid #f0d58a; border-radius: 4px; padding: 1px 6px; vertical-align: middle; }

/* notifications (header bell) */
.ntbell { position: relative; }
.ntpop { position: absolute; right: 0; top: calc(100% + 6px); width: min(380px, 90vw); max-height: 60vh; overflow: auto; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 10px 30px rgba(16,24,40,.14); z-index: 50; padding: 6px; }
.nt-h { font-weight: 700; font-size: 13px; padding: 6px 8px; }
.nt-i { padding: 8px; border-radius: 6px; font-size: 12.5px; border-top: 1px solid var(--line2); } .nt-i.new { background: var(--accent-soft); }

/* the MGA platform has as many seats as MPAC's registry lists */
.sn-seats { grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); }

/* P1 · Bordereaux & versions: review items */
.rv-item { border-left: 3px solid var(--line); padding: 6px 10px; margin: 6px 0; } .rv-item.open { border-left-color: var(--warn, #c98a00); background: var(--panel-2); }
.rv-act { display: flex; gap: 6px; align-items: center; margin-top: 6px; flex-wrap: wrap; } .rv-act input { flex: 1 1 220px; }
#treaty tr.own-layer td:first-child { box-shadow: inset 3px 0 0 var(--ok); }

/* P4 · the sharing level beside each program's answer */
.sharetag { font-size: 11px; color: var(--muted); margin: 0 6px 0 auto; white-space: nowrap; }
.prog:has(.sharetag) { grid-template-columns: 10px 1fr auto auto; } .prog .sharetag { margin: 0; }
/* P5 · Ask MPAC */
.askpop { position: absolute; right: 0; top: calc(100% + 6px); width: min(420px, 92vw); background: var(--panel); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 10px 30px rgba(16,24,40,.14); z-index: 51; padding: 6px; display: flex; flex-direction: column; }
.ask-log { max-height: 50vh; overflow: auto; padding: 4px; display: flex; flex-direction: column; gap: 6px; }
.ask-m { font-size: 13px; line-height: 1.45; padding: 7px 10px; border-radius: 8px; } .ask-m p { margin: 0 0 6px; } .ask-m p:last-child { margin: 0; } .ask-m ul { margin: 4px 0; padding-left: 18px; }
.ask-m.user { align-self: flex-end; background: var(--accent-soft, #e8f0fe); max-width: 85%; } .ask-m.assistant { background: var(--panel-2); }
.ask-f { display: flex; gap: 6px; padding: 6px 4px 2px; border-top: 1px solid var(--line2); margin-top: 4px; } .ask-f input { flex: 1; }
/* Ask the applicant: underwriting questions */
.qa-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--line2); font-size: 13px; }
.qa-in { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; } .qa-in input, .qa-in select { max-width: 180px; }
@media (max-width: 700px) { .qa-row { grid-template-columns: 1fr; } }

/* Signed in as (demo personas) */
.perpop { width: min(340px, 92vw); } .per-i { display: block; width: 100%; text-align: left; background: none; border: 0; border-top: 1px solid var(--line2); padding: 7px 8px; cursor: pointer; font: inherit; color: inherit; }
.per-i:hover:not([disabled]) { background: var(--panel-2); } .per-i.on { background: var(--accent-soft, #e8f0fe); } .per-i[disabled] { opacity: .5; cursor: not-allowed; }
/* overview: limits set above the seat, protected */
.lim-above .iv-lim { border-left: 3px solid var(--bad); padding-left: 8px; }
.iv-lim { display: flex; justify-content: space-between; gap: 12px; align-items: center; padding: 6px 0; border-top: 1px solid var(--line2); font-size: 12.5px; flex-wrap: wrap; }

/* top bar: one status chip (MPAC connection · calls · refresh), the signed-in person beside the desk name */
.statuschip { display: inline-flex; align-items: center; gap: 2px; border: 1px solid var(--line); border-radius: 999px; padding: 1px 4px 1px 2px; }
.statuschip .conn { border: 0; background: none; max-width: 210px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.statuschip .btn { padding: 3px 7px; }
.persona-l { margin-left: 4px; } .persona-l > .btn { border: 1px solid var(--line); }
.persona-l .ntpop { left: 0; right: auto; }

/* desk switcher: working desks, then the read-only oversight apps */
.sn-dh { font: 600 10.5px Inter, system-ui, sans-serif; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); margin: 6px 4px 3px; }
.sn-desk.two { grid-template-columns: repeat(2, 1fr); }
body.side-min .sn-dh { display: none; }

.acting { margin-top: 6px; font-size: 12.5px; color: var(--ink2); }
.acting .btn.link { padding: 0 4px; }

/* desk switcher in the top bar: Desks | Oversight (read only) */
.deskbar { display: flex; align-items: center; gap: 6px; margin-left: 12px; }
.deskbar .db-l { font: 600 10.5px Inter, system-ui, sans-serif; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
.deskbar .db-l + .apptoggle { margin-right: 6px; }
.deskbar .apptoggle.ovr button.on { color: var(--ink); }
.deskbar .apptoggle.ovr { border: 1px dashed var(--line); }

/* shared & layered: towers drawn bottom up, a market's share as a segment, the open share hatched */
.sl-tower { display: flex; flex-direction: column; gap: 4px; margin: 8px 0 12px; }
.sl-layer { display: grid; grid-template-columns: 170px 1fr; gap: 10px; align-items: center; font-size: 12px; }
.sl-bar { display: flex; height: 30px; border: 1px solid var(--line); border-radius: 6px; overflow: hidden; }
.sl-seg { color: #fff; font-size: 11px; display: flex; align-items: center; justify-content: center; white-space: nowrap; overflow: hidden; padding: 0 4px; border-right: 1px solid rgba(255,255,255,.6); }
.sl-seg.bad { outline: 2px solid var(--bad); outline-offset: -2px; }
.sl-seg.open { color: var(--ink2); background: repeating-linear-gradient(45deg, var(--panel-2), var(--panel-2) 6px, var(--panel) 6px, var(--panel) 12px); }
.sl-app { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 8px; }
.sl-app > div { display: flex; flex-direction: column; gap: 2px; padding: 6px 8px; border: 1px solid var(--line2); border-radius: 8px; font-size: 12.5px; }
.sl-app > div.prot { border-left: 3px solid var(--bad); }
@media (max-width: 700px) { .sl-layer { grid-template-columns: 1fr; } }
.receipt { display: inline-block; font: 500 10.5px var(--mono, ui-monospace, monospace); color: var(--muted); border: 1px solid var(--line2); border-radius: 4px; padding: 0 4px; margin-left: 4px; cursor: help; }

tr.overdue td:first-child { box-shadow: inset 3px 0 0 var(--bad); }
.ptbadge { display: inline-flex; gap: 4px; align-items: center; } .seg.ptf { margin-left: 8px; }
/* placement at intake: the toggle, and the layers it opens */
.plc { border: 1px solid var(--line2); border-radius: 8px; padding: 8px 10px; margin: 8px 0; }
.plc-tog { display: flex; align-items: center; gap: 8px; }
.plc-body { margin-top: 8px; } .plc-layer { border-top: 1px dashed var(--line2); padding-top: 6px; margin-top: 6px; }
.plc-mk { display: flex; gap: 6px; align-items: center; margin: 4px 0; flex-wrap: wrap; } .plc-mk select { max-width: 320px; }

/* Risk details on intake: open by default, with Values, Construction…, Protection inside */
details.riskd { border-top: 1px solid var(--line2); margin-top: 8px; padding-top: 6px; } details.riskd > summary { font-weight: 600; cursor: pointer; padding: 4px 0; }
details.riskd h4 { margin: 8px 0 4px; font-size: 12px; color: var(--ink2); }
table.lt tr.lg th { font-size: 10.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); border-bottom: 1px solid var(--line2); }

/* top bar fits the window (formatting pass, 2026-10-11): items shrink, captions fold away below 1500px, the status chip compacts */
.top > * { min-width: 0; }
.top .brand { flex-shrink: 0; }
.top .right { flex-shrink: 1; min-width: 0; margin-left: auto; }
#persona > .btn { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block; }
@media (max-width: 1500px) {
  .top { gap: 8px; padding: 0 12px; }
  .deskbar { gap: 4px; margin-left: 4px; } .deskbar .db-l { display: none; }
  .deskbar .apptoggle button { padding: 4px 8px; }
  .statuschip .conn { max-width: 150px; }
  #calls-toggle { font-size: 0; } #calls-toggle .pill { font-size: 11px; }
  #sideToggle { font-size: 0; padding: 4px 8px; } #sideToggle span { font-size: 15px; }
}
@media (max-width: 1150px) {
  .brand .b2 { display: none; } .statuschip .conn { max-width: 96px; } #persona > .btn { max-width: 110px; }
  .deskbar .apptoggle button { padding: 4px 6px; font-size: 11.5px; }
}
@media (max-width: 1150px) { .top .brand { flex-shrink: 1; min-width: 0; } .top .brand .b1 { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .top { gap: 6px; } }
@media (max-width: 1150px) { .top .brand .b1 { max-width: 130px; } #askmpac > .btn { padding: 3px 6px; } .deskbar .apptoggle button { padding: 3px 5px; } }
table.rf select[data-rfowner] { max-width: 160px; }
@media (max-width: 1400px) { .augrid { grid-template-columns: minmax(0, 1fr); } } .augrid table.mini td { overflow-wrap: anywhere; }
.locwrap { overflow-x: auto; } table.loctbl { font-size: 12.5px; } table.loctbl > * > tr > th, table.loctbl > tbody > tr:not(.ex) > td { padding: 6px 6px; }
table.loctbl td .badge { white-space: normal; } table.loctbl .exin .src { white-space: normal; } table.loctbl dl.kv dd { overflow-wrap: anywhere; }
.locwrap { container-type: inline-size; }
@container (max-width: 640px) { table.loctbl > thead > tr > th:nth-child(7), table.loctbl > tbody > tr:not(.ex) > td:nth-child(7) { display: none; } }
.kpis:has(> :nth-child(5):last-child) { grid-template-columns: repeat(5, minmax(0, 1fr)); } .kpis:has(> :nth-child(5):last-child) .kpi .v { overflow-wrap: anywhere; }
.form label:has(> input[type=checkbox]), .form label:has(> input[type=radio]) { flex-direction: row; align-items: center; gap: 6px; } .form label > input[type=checkbox], .form label > input[type=radio] { width: auto; }
body.hide-records .rec { display: none !important; } body.hide-records #calls-toggle { display: none; }
.ph-rec { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink2); white-space: nowrap; cursor: pointer; } .ph-rec input { width: auto; margin: 0; }
.ig-pick { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 0 0 12px; }
table.rf input[data-rfdue] { max-width: 140px; margin-top: 4px; display: block; font-size: 12px; }
/* one visual vocabulary (public/signals.js): lock = set above you · green / amber / red · meters · line, organisation and renewal signals */
.sig-i { vertical-align: -2px; flex: none; }
.sig-lock { color: var(--bad); display: inline-flex; vertical-align: -1px; }
.sig-meter { font-size: 11.5px; min-width: 120px; }
.sig-meter .sig-mt { display: flex; justify-content: space-between; gap: 8px; color: var(--ink2); margin-bottom: 3px; }
.sig-bar { position: relative; height: 6px; border-radius: 3px; background: var(--line); }
.sig-bar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 3px; background: var(--ok); }
.sig-meter.near .sig-bar i { background: var(--warn); } .sig-meter.over .sig-bar i { background: var(--bad); }
.sig-bar b { position: absolute; top: -2px; bottom: -2px; width: 2px; background: var(--ink2); opacity: .55; }
.sig-bar b.tgt { background: var(--ink); opacity: .9; }
.sig-line, .sig-org { display: inline-flex; align-items: center; gap: 4px; color: var(--ink2); }
.sig-org { margin-right: 4px; }
.sig-renew { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; padding: 1px 6px; border-radius: 6px; background: var(--line); color: var(--ink2); white-space: nowrap; }
.sig-renew.near { background: var(--warn-soft); color: var(--warn); } .sig-renew.over, .sig-renew.past { background: var(--bad-soft); color: var(--bad); }
.sig-chip { display: inline-block; font-size: 11px; padding: 1px 7px; border-radius: 6px; background: var(--line); color: var(--ink2); margin: 1px 0; }
.sig-chip.bad { background: var(--bad-soft); color: var(--bad); } .sig-chip.good { background: var(--ok-soft); color: var(--ok); } .sig-chip.warn { background: var(--warn-soft); color: var(--warn); }
.sig-arrow { color: var(--muted); margin: 0 3px; display: inline-flex; vertical-align: -2px; }
.sig-num { display: inline-flex; align-items: center; justify-content: center; width: 18px; height: 18px; border-radius: 50%; background: var(--ok-soft); color: var(--ok); font-size: 11px; font-weight: 600; margin-right: 6px; }

/* Brokerage › Markets as compact cards */
.mkc-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; font-size: 12px; color: var(--ink2); margin: 0 0 12px; }
.mkc-grp { font-size: 13px; color: var(--ink2); margin: 6px 0 8px; display: flex; align-items: center; gap: 6px; }
.mkc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; margin-bottom: 18px; }
.mkc { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.mkc.prot { border-left: 3px solid var(--bad); }
.mkc-h { display: flex; flex-direction: column; gap: 2px; } .mkc-h b { font-size: 14px; } .mkc-h .muted { font-size: 11.5px; }
.mkc-chips { display: flex; flex-wrap: wrap; gap: 4px; }
.mkc-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px 10px; }
.mkc-s span { display: block; font-size: 11px; color: var(--muted); } .mkc-s b { font-size: 14px; font-weight: 600; }
.mkc-s.prot b { color: var(--bad); }
.mkc-tw { position: relative; height: 8px; border-radius: 4px; background: var(--line); }
.mkc-tw i { position: absolute; top: 0; bottom: 0; border-radius: 4px; background: #3b6fd8; }
.mkc-grp { font-weight: 500; }
.mkc-s b { display: flex; align-items: center; gap: 3px; white-space: nowrap; }

.cx-stack { display: flex; height: 10px; border-radius: 5px; overflow: hidden; background: var(--line); }
.cx-stack i { display: block; height: 100%; } .cx-stack .cx-approved { background: var(--ok); } .cx-stack .cx-open { background: var(--warn); } .cx-stack .cx-declined { background: var(--bad); } .cx-stack .cx-awaiting { background: var(--muted); }

.au-down > div { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.au-w { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font-size: 11.5px; } .au-w .sig-meter { min-width: 90px; width: 90px; }
@media (max-width: 1100px) { .top .brand .b1 { max-width: 105px; } .deskbar .apptoggle button { padding: 3px 4px; } }
.ask-f { align-items: flex-end; } .ask-f textarea { flex: 1; resize: vertical; min-height: 60px; font: inherit; font-size: 13px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 6px; }
.rv-act { align-items: flex-end; } .rv-act textarea, textarea.rv-note { flex: 0 1 420px; max-width: 420px; min-height: 54px; resize: vertical; font: inherit; font-size: 13px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 6px; } .rv-btns { display: flex; gap: 6px; flex-wrap: wrap; }
.bu-card { border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; }
.bu-mi { display: flex; gap: 22px; margin: 8px 0 4px; } .bu-mi span { display: block; font-size: 11px; } .bu-mi b { font-size: 15px; }

/* Brokerage › Accounts: the tower (right) needs the room; stack below 1500px */
.grid2.bk { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
@media (max-width: 1500px) { .grid2.bk { grid-template-columns: minmax(0, 1fr); } }
/* "Reading MPAC…" on any page whose data hasn't arrived yet */
.view > .pf:empty::before { content: '⏳ Reading MPAC…'; display: block; padding: 18px; color: var(--muted, #888); font-size: 13px; border: 1px dashed var(--line); border-radius: 10px; }
/* long page hints: one line, the whole text on click */
#pageh .ph-t > p { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; max-width: 100%; }
#pageh .ph-t > p.open { white-space: normal; cursor: default; }

/* Bordereaux › Upload: what the upload is for, chosen first */
.bu-purpose { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.bu-purpose button { text-align: left; border: 1.5px solid var(--line); background: var(--panel); border-radius: 10px; padding: 10px 12px; cursor: pointer; display: flex; flex-direction: column; gap: 3px; font: inherit; }
.bu-purpose button span { font-size: 11.5px; color: var(--muted); }
.bu-purpose button.on { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
@media (max-width: 700px) { .bu-purpose { grid-template-columns: 1fr; } }

/* Bordereaux: tighter — one-line panel hints, compact purpose choice and upload cards */
#monthend .ph { flex-wrap: nowrap; }
#monthend .ph > .muted { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 1 1 auto; }
#monthend .ph > h3 { white-space: nowrap; flex: 0 0 auto; }
.bu-purpose { gap: 8px; }
.bu-purpose button { padding: 6px 10px; gap: 1px; }
.bu-purpose button span { font-size: 11px; }
#monthend .submitbar { margin-top: 8px; }
#monthend .bu-card { padding: 8px 12px; }

/* Home › Inbox: the same shape as MPAC Connect's inbox */
.ibx-hello .pb { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.ibx-k .kpi .v small { font-size: 12px; font-weight: 500; }
.ibx { display: flex; flex-direction: column; gap: 0; padding-top: 4px; padding-bottom: 4px; }
.ibx-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--line2, var(--line)); }
.ibx-row:last-child { border-bottom: 0; }
.ibx-row.other { opacity: .72; }
.ibx-t { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ibx-d { font-size: 12px; margin-top: 2px; }
.ibx-act { display: flex; gap: 8px; align-items: center; justify-content: flex-end; flex-wrap: wrap; }
@media (max-width: 700px) { .ibx-row { grid-template-columns: 1fr; } .ibx-act { justify-content: flex-start; } }

/* period chips (period.js, MPAC Connect's): the desks call the second ink --ink2 */
.pd span { color: var(--ink2); }

/* Party colours for people (the same as MPAC Connect's: Users, the Viewing as bar, Sign-ins): body[data-seat] sets --seat */
:root { --seat-carrier: #1f5fbf; --seat-mga: #6b4fa8; --seat-retail: #c2410c; --seat-re: #137a4a; --seat-broker: #9a5b00; --seat-auditor: #475569; --seat-investor: #be185d; --seat-admin: #0e7490; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --seat-carrier: #6aa0f0; --seat-mga: #b9a0ef; --seat-retail: #fb923c; --seat-re: #5fd39a; --seat-broker: #f0b75a; --seat-auditor: #a3b1c6; --seat-investor: #f472b6; --seat-admin: #56c6dd; } }
:root[data-theme="dark"] { --seat-carrier: #6aa0f0; --seat-mga: #b9a0ef; --seat-retail: #fb923c; --seat-re: #5fd39a; --seat-broker: #f0b75a; --seat-auditor: #a3b1c6; --seat-investor: #f472b6; --seat-admin: #56c6dd; }
body[data-seat] { --seat: var(--accent); }
body[data-seat="carrier"] { --seat: var(--seat-carrier); } body[data-seat="mga"] { --seat: var(--seat-mga); } body[data-seat="retail"] { --seat: var(--seat-retail); }
body[data-seat="re"] { --seat: var(--seat-re); } body[data-seat="broker"] { --seat: var(--seat-broker); } body[data-seat="auditor"] { --seat: var(--seat-auditor); }
body[data-seat="investor"] { --seat: var(--seat-investor); }
#pageh .acting { border-left: 4px solid var(--seat, var(--accent)); background: color-mix(in srgb, var(--seat, var(--accent)) 7%, var(--panel)); padding: 4px 10px; border-radius: 6px; }
#persona > .btn { color: var(--seat, var(--accent)); border-color: color-mix(in srgb, var(--seat, var(--accent)) 35%, transparent); background: color-mix(in srgb, var(--seat, var(--accent)) 10%, transparent); }
.perpop .per-i.on { box-shadow: inset 3px 0 0 var(--seat, var(--accent)); background: color-mix(in srgb, var(--seat, var(--accent)) 8%, transparent); }
.sn-seats button.on { color: var(--seat, var(--accent)); box-shadow: inset 0 -2px 0 var(--seat, var(--accent)); }
.ibx-hello .pb { border-left: 4px solid var(--seat, var(--accent)); }

/* Refresh, as MPAC Connect's top bar: a plain labelled button of its own */
.top .rf-btn { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; font-family: inherit; font-size: 12.5px; font-weight: 500; line-height: 1.2; color: var(--ink); background: var(--panel); border: 1px solid var(--line); border-radius: 6px; cursor: pointer; white-space: nowrap; }
.top .rf-btn:hover { background: var(--panel-2); }
.top .rf-btn:disabled { color: var(--ink2); cursor: default; }

/* Inbox, tighter: a one-line greeting with the counts, cards two-up from 1200px, compact rows, line icons in tinted squares */
/* the Inbox's top line: only "Show N for others here", on the right (no counts strip since the 2026-10-14 UX review) */
.ibx-top { display: flex; justify-content: flex-end; align-items: center; margin: 0 0 8px; font-size: 13px; }
.ibx-who { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.ibx-sum { display: flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.ibx-cnt { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--ink2); padding: 2px 8px 2px 6px; border-radius: 999px; background: var(--panel-2); }
.ibx-cnt b { color: var(--ink); }
.ibx-more { white-space: nowrap; }
/* a page's icons with a count, each opening what the Inbox holds (2026-10-14) */
.icon-bar { display: flex; justify-content: flex-end; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0 0 12px; }
/* Inbox › Agreements: the answered history, folded (2026-10-14) */
details.pty-fold { margin: 14px 0 0; }
details.pty-fold > summary { cursor: pointer; font-weight: 600; font-size: 13.5px; color: var(--ink2); padding: 6px 0; }
/* The Inbox as one list (the user, 2026-10-15: "so much white space across the rows for each sub header"): type chips across the
   top (each type's count; a click shows only that type), then one dense list, Decisions, Review and Alerts as thin headings in it,
   each row its type, what, detail, how long it has waited and the action */
.ibx-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 0 0 10px; }
.ibx-chip { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); background: var(--panel); color: var(--ink2); border-radius: 999px; padding: 3px 10px 3px 4px; font: inherit; font-size: 12.5px; cursor: pointer; }
.ibx-chip:first-child { padding-left: 10px; }
.ibx-chip b { color: var(--ink); font-weight: 700; }
.ibx-chip .ibx-ic { width: 20px; height: 20px; border-radius: 999px; }
.ibx-chip .ibx-ic svg { width: 12px; height: 12px; }
.ibx-chip:hover { background: var(--panel-2); }
.ibx-chip.on { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.ibx-chip.on b { color: var(--accent); }
.ibx-chips .ibx-more { margin-left: auto; }
.panel.ibx-list { padding: 0; overflow: hidden; }
.ibx-gh2 { padding: 7px 14px; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink2); background: var(--panel-2); border-top: 1px solid var(--line2, var(--line)); }
.ibx-gh2:first-child { border-top: 0; }
.ibx-gh2 .muted { font-weight: 400; letter-spacing: 0; text-transform: none; margin-left: 6px; }
.ibx-line { display: grid; grid-template-columns: 140px minmax(120px, 1fr) minmax(0, 2fr) 56px auto; gap: 12px; align-items: center; padding: 7px 14px; border-top: 1px solid var(--line2, var(--line)); font-size: 13px; }
.ibx-line:hover { background: var(--panel-2); }
.ibx-line.other { opacity: .75; }
.ibx-type { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.ibx-type .ibx-ic { width: 22px; height: 22px; }
/* (what and the detail wrap to two lines rather than cut off: a narrow window cut them to a few words) */
.ibx-what, .ibx-det { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; min-width: 0; overflow-wrap: anywhere; }
.ibx-what { font-weight: 600; }
.ibx-det { font-size: 12px; }
.ibx-line .ibx-age { text-align: right; }
.ibx-line .ibx-act { flex-wrap: nowrap; white-space: nowrap; }
.ibx-age { font-size: 11px; color: var(--ink3, var(--ink2)); white-space: nowrap; }
.ibx-ic { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 7px; flex: 0 0 auto; color: var(--tone); background: color-mix(in srgb, var(--tone) 12%, transparent); }
.ibx-cnt svg { color: var(--tone); }
.t-acc { --tone: var(--accent); } .t-warn { --tone: var(--warn, #b45309); } .t-ok { --tone: var(--ok, #15803d); } .t-bad { --tone: var(--bad, #b42318); } .t-mut { --tone: var(--ink2); }
@media (max-width: 900px) { .ibx-line { grid-template-columns: minmax(0, 1fr) auto; row-gap: 4px; } .ibx-type { grid-column: 1 / -1; } .ibx-what { grid-column: 1; } .ibx-line .ibx-age { grid-column: 2; grid-row: 2; } .ibx-det { grid-column: 1 / -1; white-space: normal; } .ibx-line .ibx-act { grid-column: 1 / -1; justify-content: flex-start; } }

/* line icons in the Signed in as lines (instead of emoji) */
.li-ic { display: inline-block; vertical-align: -2px; margin-right: 4px; color: var(--seat, var(--accent)); }

/* a field title with something beside it (the Period chip): one row, so the field lines up with its neighbours */
.form .lbl-row { display: flex; align-items: center; gap: 6px; min-height: 18px; }
.form .lbl-row .pd { font-size: 10.5px; line-height: 16px; }

/* Seat: a compact list, one organization per row (initials, name), the current one in the desk's party colour */
.sn-seats, .sn-seats[role] { display: flex; flex-direction: column; gap: 1px; padding: 0; background: none; border-radius: 0; grid-template-columns: none; }
.sn-seats button { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; padding: 4px 8px 4px 6px; border-radius: 6px; font: 500 12.5px/1.25 Inter, system-ui, sans-serif; color: var(--ink2); box-shadow: none; }
.sn-seats button:hover { background: var(--panel-2); color: var(--ink); }
.sn-seats button.on { background: color-mix(in srgb, var(--seat, var(--accent)) 10%, transparent); color: var(--ink); font-weight: 600; box-shadow: inset 3px 0 0 var(--seat, var(--accent)); }
.st-ini { flex: 0 0 auto; width: 22px; height: 22px; display: grid; place-items: center; border-radius: 6px; font-size: 10px; font-weight: 700; letter-spacing: .02em; color: var(--ink2); background: var(--panel-2); border: 1px solid var(--line); }
.sn-seats button.on .st-ini { color: #fff; background: var(--seat, var(--accent)); border-color: transparent; }
.st-n { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sn-seat { margin-bottom: 6px; }

/* the seat in the top left: the organization's name is the switcher, its list drops below it */
.top .brand { position: relative; gap: 10px; }
.top .brand .mark { cursor: pointer; }
.b-seat { display: inline-flex; align-items: center; gap: 6px; border: 1px solid transparent; background: none; padding: 3px 8px 3px 6px; margin-left: -6px; border-radius: 8px; font: inherit; color: inherit; text-align: left; cursor: pointer; min-width: 0; }
.b-seat .b-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.b-seat .b1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.b-seat .b-caret { display: none; color: var(--ink2); flex: 0 0 auto; transition: transform .15s; }
.b-seat.switch .b-caret { display: block; }
.b-seat.switch:hover, .b-seat[aria-expanded="true"] { background: var(--panel-2); border-color: var(--line); }
.b-seat[aria-expanded="true"] .b-caret { transform: rotate(180deg); }
.seatpop { position: absolute; top: calc(100% + 6px); left: 36px; z-index: 60; min-width: 250px; max-width: 320px; padding: 6px; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 10px 28px rgba(15, 23, 42, .14); }
.seatpop[hidden] { display: none; }
.seatpop .sp-h { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--ink3, var(--ink2)); padding: 4px 8px 6px; }
.seatpop button { display: flex; align-items: center; gap: 9px; width: 100%; text-align: left; border: 0; background: none; padding: 6px 8px; border-radius: 7px; font: 500 13px/1.25 Inter, system-ui, sans-serif; color: var(--ink); cursor: pointer; }
.seatpop button:hover { background: var(--panel-2); }
.seatpop button.on { background: color-mix(in srgb, var(--seat, var(--accent)) 10%, transparent); font-weight: 600; }
.seatpop button svg { margin-left: auto; color: var(--seat, var(--accent)); flex: 0 0 auto; }
.seatpop .st-ini { width: 24px; height: 24px; }
.seatpop button.on .st-ini { color: #fff; background: var(--seat, var(--accent)); border-color: transparent; }

/* the model run panel's version choice: title and dropdown on one row */
.dss-mv { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font-size: 12px; color: var(--ink2); white-space: nowrap; }
.dss-mv select { padding: 4px 8px; border: 1px solid var(--line); border-radius: 6px; font: inherit; background: var(--panel); max-width: 260px; }

/* file pickers: a soft button with the chosen file's name beside it, instead of the browser's boxy default */
input[type=file] { font: inherit; font-size: 12.5px; color: var(--ink2); padding: 0; border: 0; background: none; max-width: 100%; cursor: pointer; }
input[type=file]::file-selector-button { margin-right: 10px; padding: 6px 12px 6px 30px; border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line)); border-radius: 8px; cursor: pointer; font: 600 12.5px/1.2 Inter, system-ui, sans-serif; color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, var(--panel)) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23667085' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V4M7.5 8.5L12 4l4.5 4.5'/%3E%3Cpath d='M4 15v3a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-3'/%3E%3C/svg%3E") no-repeat 10px center / 14px; transition: background-color .15s, border-color .15s; }
input[type=file]:hover::file-selector-button { background-color: color-mix(in srgb, var(--accent) 14%, var(--panel)); border-color: var(--accent); }
input[type=file]:focus-visible { outline: none; } input[type=file]:focus-visible::file-selector-button { box-shadow: 0 0 0 3px var(--accent-soft); }
.form input[type=file] { padding: 2px 0; border: 0; }

/* drop areas, as MPAC Connect's (.drop / .gl-drop): a soft dashed card, an upload tile at the top, the button as an accent pill */
.drop, .pf .drop { position: relative; display: block; text-align: center; cursor: pointer; padding: 70px 18px 20px; border: 1.5px dashed color-mix(in srgb, var(--accent) 40%, var(--line)); border-radius: 14px;
  background: linear-gradient(color-mix(in srgb, var(--accent) 6%, var(--panel)), var(--panel)); transition: border-color .15s, background-color .15s, box-shadow .15s; }
.drop::before { content: ''; position: absolute; top: 18px; left: 50%; transform: translateX(-50%); width: 42px; height: 42px; border-radius: 12px; background: color-mix(in srgb, var(--accent) 14%, transparent); }
.drop::after { content: ''; position: absolute; top: 29px; left: 50%; transform: translateX(-50%); width: 20px; height: 20px; background: var(--accent);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V4M7.5 8.5L12 4l4.5 4.5'/%3E%3Cpath d='M4 15v3a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-3'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 15V4M7.5 8.5L12 4l4.5 4.5'/%3E%3Cpath d='M4 15v3a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-3'/%3E%3C/svg%3E") center / contain no-repeat; }
.drop:hover, .drop.over { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, var(--panel)); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 12%, transparent); }
/* the "Choose file" button inside an area: an accent pill */
.drop label.btn, #c-drop > b { display: inline-block; border-radius: 999px; padding: 7px 18px; font-weight: 600; background: var(--accent); border: 0; color: #fff; margin: 0 6px 0 0; }
.drop label.btn:hover { filter: brightness(1.06); }
/* the chosen file's name: an accent-soft pill, hidden while empty */
#c-fname:empty { display: none; }
#c-fname { display: inline-block; margin-top: 8px; padding: 3px 10px; border-radius: 999px; background: var(--accent-soft); color: var(--accent); font-size: 12px; }

/* modern form controls across the desks: rounded, a slim custom arrow on dropdowns, a soft focus ring */
.pf select, .pf input[type=text], .pf input[type=date], .pf input[type=number], .pf input[type=search], .pf input:not([type]), .pf textarea, .top select {
  height: 34px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 8px; background-color: var(--panel); color: var(--ink); font: inherit; font-size: 13px;
  transition: border-color .15s, box-shadow .15s; box-shadow: 0 1px 0 rgba(15, 23, 42, .03); }
.pf textarea { height: auto; min-height: 34px; }
.pf select, .top select { -webkit-appearance: none; appearance: none; padding-right: 30px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237a879a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 9px center; background-size: 14px; }
.pf select:hover, .pf input:hover, .pf textarea:hover, .top select:hover { border-color: color-mix(in srgb, var(--accent) 35%, var(--line)); }
.pf select:focus, .pf input:focus, .pf textarea:focus, .top select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.pf input[type=checkbox], .pf input[type=radio], .pf input[type=file] { height: auto; box-shadow: none; }
/* a filter toolbar: a tinted strip, the search first and widest, the count as a stat, the action at the far end */
.flt-bar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 10px 12px; margin: 12px 14px; background: var(--panel-2); border: 1px solid var(--line2, var(--line)); border-radius: 12px; }
.pb.flt-bar { margin: 12px 14px; }
.flt-bar select { min-width: 150px; }
.flt-bar .flt-q { flex: 1 1 240px; max-width: 360px; padding-left: 32px;
  background: var(--panel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237a879a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") no-repeat 10px center / 15px; }
.flt-stat { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--ink2); padding: 0 6px; }
.flt-stat b { color: var(--ink); font-size: 14px; }
.flt-sep { width: 1px; height: 14px; background: var(--line); margin: 0 4px; }
.flt-bar .btn.primary { margin-left: auto; height: 34px; border-radius: 8px; padding: 0 16px; }
.flt-bar select { width: auto; flex: 0 1 190px; min-width: 140px; }
.pf .flt-bar .flt-q { padding-left: 32px; }

/* approve all / decline all: a bar above a long list, the count first, then one reason for all, then the two actions */
.bulk-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px 10px; margin: 0 0 10px; border-radius: 10px; background: var(--panel-2); border: 1px solid var(--line2, var(--line)); }
.bulk-bar .bulk-n { font-size: 12.5px; color: var(--ink2); margin-right: 4px; } .bulk-bar .bulk-n b { color: var(--ink); font-size: 14px; }
.bulk-bar textarea.rv-note, .bulk-bar input { flex: 1 1 220px; max-width: 420px; min-height: 34px; height: 34px; resize: vertical; }
.bulk-bar input[type=checkbox], .rv-item input.rv-pick, .fam-h input[type=checkbox] { flex: none; width: auto; height: auto; min-height: 0; margin: 0 4px 0 0; vertical-align: -2px; cursor: pointer; }
.bulk-bar .rv-all { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 600; cursor: pointer; white-space: nowrap; }
.fam-h .fam-bulk { display: inline-flex; align-items: center; gap: 2px; margin-left: 10px; font-size: 12px; font-weight: 500; text-transform: none; letter-spacing: 0; cursor: pointer; }
.bulk-bar .btn.ok { background: var(--ok, #15803d); border-color: var(--ok, #15803d); color: #fff; }
.bulk-bar .btn.bad { background: var(--panel); border-color: color-mix(in srgb, var(--bad, #b42318) 45%, var(--line)); color: var(--bad, #b42318); }
.fam-h { display: flex; align-items: baseline; gap: 10px; } .fam-bulk { margin-left: auto; font-size: 12px; font-weight: 500; }

/* a version's model runs side by side (one line per model) */
.dss-runs { display: flex; flex-direction: column; gap: 3px; margin-top: 4px; }
.dss-run { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 11.5px; color: var(--ink2); padding: 3px 8px; border-radius: 6px; background: var(--panel-2); }
.dss-run .dss-m { min-width: 170px; font-weight: 600; } .dss-run b { color: var(--ink); }
.dss-run .dss-id { margin-left: auto; font-size: 11px; color: var(--ink3, var(--ink2)); font-family: var(--mono, ui-monospace, monospace); }

/* narrower windows (≤1100px): the desk switcher takes its own row under the brand, the person and the status, so nothing overlaps */
@media (max-width: 1100px) {
  :root { --top-h: 82px; }
  .top { flex-wrap: wrap; height: auto; min-height: 52px; padding: 6px 12px; row-gap: 6px; }
  .top .deskbar { order: 5; flex: 1 0 100%; display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
  .top .deskbar::-webkit-scrollbar { display: none; }
  .top .right { margin-left: auto; }
  .top .brand .b1 { max-width: 180px; }
}

/* the shared filter bar (MPAC Connect's filter-bar.js) names the second and third inks --ink-2 / --ink-3; the desks call them --ink2 / --ink3 */
:root { --ink-2: var(--ink2); --ink-3: var(--ink3, var(--ink2)); }

/* #5 · the live bordereau card */
.bp-card .ph { flex-wrap: wrap; }
.bp-live { font-size: 12px; font-weight: 700; color: var(--seat, var(--accent)); background: color-mix(in srgb, var(--seat, var(--accent)) 12%, transparent); border-radius: 999px; padding: 2px 10px; }
.bp-card h4 { margin: 14px 0 6px; font-size: 12.5px; }
.bp-lim { display: flex; gap: 10px; align-items: center; font-size: 12px; margin: 3px 0; } .bp-lim > span:first-child { flex: 0 0 260px; }
.bp-acts { margin-top: 14px; gap: 8px; }
.bp-past { display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; }
.bp-more { margin-top: 14px; } .bp-more > summary { cursor: pointer; font-size: 12.5px; color: var(--ink2); }
.bp-more .bp-vers { margin: 8px 0 0; box-shadow: none; }

/* a limit shown without its amounts (the seat is below the setter and the total counts business outside its part) */
.amt-hid { padding: 4px 0; } .amt-hid > span:first-child { flex: 0 0 260px; }

/* the live ledger squeezes the page (html.mcl-squeeze, ≥1000px): what is pinned to the right edge moves left with it */
html.mcl-squeeze .drawer { right: var(--mcl-w); }
html.mcl-squeeze #rp-pill { right: calc(var(--mcl-w) + 12px); }

/* the Overview: tighter, read top to bottom (totals, divisions, limits, then the rest) */
#mgmt .kpis { margin: 10px 0 14px; }
#mgmt .panel { margin-bottom: 14px; }
#mgmt .appts { margin-bottom: 0; }
table.ov-div th, table.ov-lim th { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); font-weight: 600; padding: 8px 12px; border-bottom: 1px solid var(--line); text-align: left; }
table.ov-div th.num { text-align: right; }
table.ov-div td, table.ov-lim td { padding: 9px 12px; border-top: 1px solid var(--line2); vertical-align: top; }
table.ov-div td b { font-size: 13.5px; }
table.ov-div .ov-row { cursor: pointer; } table.ov-div .ov-row:hover td { background: color-mix(in srgb, var(--accent) 5%, transparent); }
table.ov-div .ov-idle td { color: var(--muted); }
table.ov-lim td:first-child { width: 34%; }
table.ov-lim .track.lim { margin: 3px 0 4px; }
table.ov-lim .ov-grp td { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; color: var(--ink2); background: var(--line2); padding: 6px 12px; }
table.ov-lim .ov-grp.up td { color: var(--bad); }
.ov-stats { display: flex; flex-wrap: wrap; gap: 6px 26px; font-size: 13px; color: var(--ink2); }
.ov-stats b { font-size: 17px; color: var(--ink); margin-right: 3px; font-variant-numeric: tabular-nums; }
.ov-stats .bad b { color: var(--bad); }

/* Bordereaux: a row per portfolio, then tabs inside */
.bp-tot { margin: 4px 0 12px; }
table.bp-list tr.on td { background: color-mix(in srgb, var(--accent) 6%, transparent); }
table.bp-list td.chev { color: var(--muted); font-size: 14px; }
table.bp-list tr.bp-ex > td { padding: 0 12px 14px; background: color-mix(in srgb, var(--accent) 3%, transparent); border-top: 0; }
.bp-list .bp-card { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 0 14px 12px; }
/* a program card's tabs: the lighter selector box (2026-10-14, one tab style everywhere) */
.bp-tabs { display: inline-flex; gap: 2px; align-items: center; padding: 3px; margin: 12px 0 12px; border: 1px solid var(--line); border-radius: 9px; flex-wrap: wrap; }
.bp-tab { border: 0; background: none; padding: 5px 11px; border-radius: 6px; font: inherit; font-size: 12.5px; color: var(--ink2); cursor: pointer; white-space: nowrap; }
.bp-tab:hover { color: var(--ink); background: color-mix(in srgb, var(--accent) 6%, transparent); } .bp-tab.on { color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); font-weight: 600; }
.bp-body { min-height: 40px; } .bp-body .kpis.mini { margin: 0 0 10px; }
.bp-body .bp-vers { margin: 0; box-shadow: none; }
.bp-sumline { display: flex; flex-wrap: wrap; gap: 6px 28px; font-size: 12.5px; color: var(--ink2); align-items: center; }
.bp-list .bp-acts { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line2); }

/* the desks' accent since the reorganization replaced the old demo (2026-10-13): the teal they were shown in */
:root, html body, html body.agency, html body.reinsurer, html body.carrier { --accent: #0f766e !important; --accent-soft: #e0f2ef !important; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]), :root:not([data-theme="light"]) body, :root:not([data-theme="light"]) body.agency, :root:not([data-theme="light"]) body.reinsurer, :root:not([data-theme="light"]) body.carrier { --accent: #3cc5b0 !important; --accent-soft: #12302c !important; } }
:root[data-theme="dark"], :root[data-theme="dark"] body { --accent: #3cc5b0 !important; --accent-soft: #12302c !important; }
html body .mark, html body.agency .mark, html body.reinsurer .mark, html body.carrier .mark { background: linear-gradient(135deg, #0f766e, #3cc5b0) !important; }

/* every dropdown on the desks, wherever it sits, has the same box as the inputs (2026-10-14: one outside a .pf panel showed the browser's square default); the more specific rules above still win */
select:where(:not([multiple])) { min-height: 34px; padding: 6px 30px 6px 10px; border: 1px solid var(--line); border-radius: 8px; background-color: var(--panel); color: var(--ink); font: inherit; font-size: 13px; -webkit-appearance: none; appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237a879a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 9px center; background-size: 14px; }

/* section titles stand out (2026-10-14, the user: Account decision, Binding & program, Underwriting questions "just get lost on the page"):
   a tinted header band, an accent bar and a slightly larger title, on every desk panel and the sections inside one */
.panel > .ph:not(summary), .acc-next > .ph { background: color-mix(in srgb, var(--accent) 7%, var(--panel)); }
.acc-next > .ph { padding: 8px 10px !important; border-radius: 8px; margin: 0 0 8px; }
.panel > .ph:not(summary) h3, .acc-next > .ph h3 { font-size: 15px; display: flex; align-items: center; gap: 8px; }
.panel > .ph:not(summary) h3::before, .acc-next > .ph h3::before { content: ""; flex: 0 0 3px; height: 15px; border-radius: 2px; background: var(--accent); }

/* a question only the underwriter answers: an attention mark, its meaning on hover (2026-10-14, the user: "UW only means nothing to people") */
.q-attn { display: inline-grid; place-items: center; width: 17px; height: 17px; border-radius: 50%; background: var(--warn-soft, #fdf3d8); color: var(--warn, #b7791f); border: 1px solid color-mix(in srgb, var(--warn, #b7791f) 45%, transparent); font: 700 11px/1 system-ui, sans-serif; vertical-align: 1px; margin-left: 4px; cursor: help; }

/* Book › In Force › the cat model across programs (2026-10-14) */
.cat-strip .ph { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cat-strip .ph select { max-width: 260px; }
.cat-strip .ph [data-catrun] { margin-left: auto; }
.cat-running { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.cat-spin { width: 14px; height: 14px; border: 2px solid var(--line); border-top-color: var(--accent); border-radius: 50%; display: inline-block; vertical-align: -2px; animation: catspin .8s linear infinite; }
@keyframes catspin { to { transform: rotate(360deg); } }
.cat-div { font-size: 12.5px; margin-top: 6px; }
details.cat-more { margin-top: 8px; } details.cat-more > summary { cursor: pointer; font-size: 12.5px; font-weight: 600; color: var(--ink2); }
details.cat-more h4 { margin: 10px 0 4px; font-size: 12.5px; }
th.cat-pick, td.cat-pick { width: 34px; text-align: center; }
/* a program's book, row by row (bookrows.js): the head line, the version picker and the search */
.bk-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-bottom: 8px; font-size: 12.5px; }
/* a location opens in place (the book's accordion) */
.bk-tbl tr.bk-row { cursor: pointer; } .bk-tbl tr.bk-row:hover td { background: var(--line2); } .bk-tbl tr.bk-row.open td { background: var(--line2); border-bottom-color: transparent; }
.bk-tbl td.chev { width: 18px; color: var(--muted); text-align: right; }
.bk-tbl tr.bk-ex > td { background: var(--line2); padding: 4px 12px 12px; }
.bk-detail { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px 20px; font-size: 12.5px; }
.bk-detail h4 { margin: 0 0 6px; font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.bk-head .bk-q { margin-left: auto; min-width: 220px; max-width: 100%; padding: 5px 9px; border: 1px solid var(--line); border-radius: 7px; font: inherit; font-size: 12.5px; background: var(--panel); color: var(--ink); }
.bk-head .bk-ver { padding: 4px 8px; border: 1px solid var(--line); border-radius: 7px; font: inherit; font-size: 12px; background: var(--panel); color: var(--ink); }
table.bk-tbl td { vertical-align: top; }

/* a violation (any rule: UW, capacity, concentration): one pill, opened to show the issue (bookrows.js) */
details.vio { display: inline-block; margin: 0 4px 3px 0; vertical-align: top; max-width: 100%; }
details.vio > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
details.vio > summary::-webkit-details-marker { display: none; }
details.vio > summary::after { content: '▸'; font-size: 9px; opacity: .7; }
details.vio[open] > summary::after { content: '▾'; }
details.vio.decline > summary { background: var(--bad-soft, #fde8e8); color: var(--bad, #b42318); }
details.vio.refer > summary { background: var(--warn-soft, #fff4e0); color: var(--warn-ink, #8a5300); }
details.vio.needs > summary { background: var(--panel-2); color: var(--ink2); }
details.vio .vio-d { font-size: 11.5px; color: var(--ink2); margin: 3px 0 2px; white-space: normal; max-width: 340px; }
.vio-ok { font-size: 11.5px; color: var(--ok, #067647); font-weight: 600; }
/* the notional book on one line: built · violations · model · promote */
.bk-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; padding: 8px 12px; margin: 0 0 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel-2); font-size: 12.5px; }
.bk-wrap .bk-it { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.bk-wrap .bk-it + .bk-it::before { content: ''; width: 1px; height: 14px; background: var(--line); margin-right: 10px; }
/* a what-if evaluating someone's book (SmartSure × Bayline): its title on a line of its own */
.bk-wrap.eval { border-color: var(--accent, #0f766e); }
.bk-wrap.eval .bk-eval { flex: 1 0 100%; font-size: 13.5px; }
.bk-seg { display: inline-flex; border: 1px solid var(--line); border-radius: 7px; overflow: hidden; }
.bk-seg button { border: 0; background: var(--panel); color: var(--ink2); font: inherit; font-size: 12px; padding: 4px 10px; cursor: pointer; }
.bk-seg button.on { background: var(--accent, #0f766e); color: #fff; }

/* whose move it is, on each queue row (app.js nextOf) */
.qi .qnext { grid-column: 1 / -1; font-size: 11.5px; font-weight: 600; margin: 3px 0 1px; }
.qnext.q-uw { color: #3557a0; } .qnext.q-agency { color: #92600a; } .qnext.q-mpac { color: var(--muted); } .qnext.q-done { color: #126b3e; }
/* Where it stands (app.js standsHtml), the same on both sides: four steps, what's next, what happened */
.stands { margin: 12px 0; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel, #fff); }
.st-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; counter-reset: st; }
.st-steps li { position: relative; padding: 6px 8px 6px 30px; border-radius: 8px; background: var(--line2, #f1f3f6); font-size: 12px; min-width: 0; }
.st-steps li::before { counter-increment: st; content: counter(st); position: absolute; left: 8px; top: 7px; width: 16px; height: 16px; border-radius: 50%; display: grid; place-items: center;
  font-size: 10px; font-weight: 700; background: #fff; color: var(--muted); border: 1px solid var(--line); }
.st-steps li b { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--ink2); }
.st-steps li span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.st-steps li.done { background: #e7f6ee; } .st-steps li.done::before { content: '✓'; background: #126b3e; color: #fff; border-color: #126b3e; }
.st-steps li.now { background: #eef2fb; box-shadow: inset 0 0 0 1.5px #3557a0; } .st-steps li.now::before { background: #3557a0; color: #fff; border-color: #3557a0; }
.st-steps li.warn { background: #fdf6e3; box-shadow: inset 0 0 0 1.5px #b7791f; } .st-steps li.warn::before { content: '!'; background: #b7791f; color: #fff; border-color: #b7791f; }
.st-now { margin-top: 10px; font-size: 13px; }
.st-ev { margin-top: 8px; font-size: 12px; } .st-ev summary { cursor: pointer; color: var(--ink2); }
.st-ev ul { margin: 6px 0 0; padding-left: 16px; } .st-ev li { margin: 3px 0; } .st-ev li .muted { display: inline-block; min-width: 128px; }
@media (max-width: 900px) { .st-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* Add what's needed (agency.js needsBox): the details and questions the carrier needs, sent back as a new version of the submission */
.nb-box { margin: 8px 0 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel, #fff); }
.nb-box h4 { margin: 0; font-size: 13px; }
.nb-box .form { margin-top: 4px; }
.nb-wait { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--ink2); }
.spin { width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--line); border-top-color: var(--accent, #0f766e); animation: spin .8s linear infinite; flex: none; }
@keyframes spin { to { transform: rotate(360deg); } }
/* Retail Agreements: each access agreement, what it shares, and its programs beneath it (parties.js accessTree) */
.at-tree { padding: 4px 0; }
.at-agr { padding: 10px 14px; border-top: 1px solid var(--line2, var(--line)); }
.at-agr:first-child { border-top: 0; }
.at-h { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.at-share { font-size: 12px; white-space: nowrap; color: var(--ink2); }
.at-progs { list-style: none; margin: 8px 0 0 6px; padding: 0 0 0 14px; border-left: 2px solid var(--line); }
.at-progs li { display: grid; grid-template-columns: minmax(180px, 260px) minmax(0, 1fr); gap: 12px; align-items: start; padding: 6px 0; position: relative; }
.at-progs li::before { content: ''; position: absolute; left: -14px; top: 15px; width: 10px; border-top: 2px solid var(--line); }
.at-p b { font-weight: 600; font-size: 12.5px; }
/* Shared & layered at intake: the layers beside a drawing of the tower (layers.js towerViz), redrawn as the figures are typed */
.plc-tower { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line2, var(--line)); }
.plc-tower h4 { margin: 0; }
.plc-tower-grid { display: grid; grid-template-columns: minmax(0, 1fr) 190px; gap: 16px; align-items: start; }
@media (max-width: 900px) { .plc-tower-grid { grid-template-columns: minmax(0, 1fr); } }
.plc-viz { min-width: 0; }
.tv { display: flex; gap: 4px; height: 220px; }
.tv-axis { position: relative; width: 40px; flex: none; font-size: 10px; color: var(--muted); }
.tv-axis span { position: absolute; right: 2px; transform: translateY(50%); white-space: nowrap; }
.tv-col { position: relative; flex: 1; border-left: 1px solid var(--line); border-bottom: 1px solid var(--line);
  background: repeating-linear-gradient(0deg, transparent 0 21px, rgba(127, 127, 127, .08) 21px 22px); }
.tv-l { position: absolute; left: 6px; right: 6px; min-height: 16px; border-radius: 4px; color: #fff; font-size: 10.5px; font-weight: 600;
  display: flex; align-items: center; justify-content: center; text-align: center; overflow: hidden; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .35); }
.tv-l span { padding: 0 4px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.tv-primary { background: #0f766e; } .tv-buffer { background: #b7791f; } .tv-excess { background: #4c51bf; }
.tv-bad { background: repeating-linear-gradient(45deg, #c53030 0 6px, #e05252 6px 12px); }
.tv-tiv { position: absolute; left: 0; right: 0; border-top: 2px dashed var(--bad, #c53030); pointer-events: none; }
.tv-axis-tiv { position: absolute; right: 2px; transform: translateY(50%); font-size: 10px; color: var(--bad, #c53030); background: var(--panel, #fff); white-space: nowrap; z-index: 1; }
.tv { padding-left: 10px; }
.tv-axis { width: 52px; }
.tv-note { font-size: 11.5px; color: var(--bad, #c53030); margin-top: 6px; }
.tv-empty { font-size: 12px; padding: 34px 10px; text-align: center; border: 1px dashed var(--line); border-radius: 6px; }
/* New submission on every desk (one address, SOV upload, MGA/Carrier entry): the form on the left, the check on the right (MPAC's
   progress and answer, the minimum data the programs need), so nobody scrolls past the form to see it (2026-10-15) */
.entry-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 400px); gap: 16px; align-items: start; }
.entry-split > .entry-form, .entry-split > .entry-check { min-width: 0; }
.entry-split > .entry-form > .panel:first-child, .entry-check > :first-child > .panel:first-child, .entry-check > .panel:first-child { margin-top: 0; }
.entry-check { display: flex; flex-direction: column; gap: 12px; }
.entry-check .panel { margin: 0; }
.entry-check .acc-grid { grid-template-columns: 1fr; }
@media (max-width: 1100px) { .entry-split { grid-template-columns: minmax(0, 1fr); } }
/* Retail (and Brokerage) New submission: the choices row (One address · Schedule of values · Placement) and MPAC's check stay
   in place; the form scrolls beneath them (the user, 2026-10-15). #ck is itself the page's scroll area */
#ck { display: flex; flex-direction: column; overflow: hidden; padding-bottom: 12px; }
#ck > .ck-opts { flex: none; padding-bottom: 8px; margin-bottom: 8px !important; border-bottom: 1px solid var(--line2, var(--line)); }
#ck > .entry-split, #ck > #ck-sov { flex: 1; min-height: 0; }
#ck > #ck-sov { display: flex; flex-direction: column; } #ck > #ck-sov > .entry-split { flex: 1; min-height: 0; }
#ck .entry-split { align-items: stretch; }
#ck .entry-split > .entry-form, #ck .entry-split > .entry-check { overflow-y: auto; min-height: 0; overscroll-behavior: contain; padding: 0 4px 12px 0; }
@media (max-width: 1100px) { #ck { display: block; overflow: auto; padding-bottom: 60px; } #ck .entry-split > .entry-form, #ck .entry-split > .entry-check { overflow: visible; } }
#v-queue.newing { grid-template-columns: minmax(0, 1fr); }
#v-queue.newing > aside.queue { display: none; }
/* Retail New business: the intake and placement choices on one line, the minimum data folded to one line */
.ck-opts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 22px; margin-bottom: 8px; }
.ck-opts > * { margin: 0 !important; }
details.minspec > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
details.minspec > summary::-webkit-details-marker { display: none; }
details.minspec > summary::after { content: '▸'; margin-left: auto; color: var(--muted); font-size: 12px; }
details.minspec[open] > summary::after { content: '▾'; }
details.minspec > summary h3 { margin: 0; }
/* What the programs need (dataspec.js minimumHtml): required · helps MPAC answer · asked after you check, one line per element */
.ms2 > summary { flex-wrap: nowrap; }
.ms-chip { font-size: 11px; font-weight: 600; padding: 2px 8px; border-radius: 10px; white-space: nowrap; }
.ms-chip.bad { background: #fdecea; color: #b42318; } .ms-chip.warn { background: #fdf6e3; color: #92600a; } .ms-chip.good { background: #e7f6ee; color: #126b3e; }
.ms-body { padding: 4px 14px 12px; }
.ms-sec { margin-top: 10px; }
.ms-h { font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ink2); }
.ms-h span { display: block; font-size: 11px; font-weight: 400; letter-spacing: 0; text-transform: none; color: var(--muted); margin-top: 1px; }
.ms-list { list-style: none; margin: 6px 0 0; padding: 0; }
.ms-list li { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 8px; align-items: start; padding: 6px 0; border-top: 1px solid var(--line2, var(--line)); font-size: 12.5px; }
.ms-list li:first-child { border-top: 0; }
.ms-ic { width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 700; }
.ms-l b { font-weight: 600; } .ms-l small { display: block; color: var(--muted); font-size: 11px; margin-top: 1px; }
.ms-st { font-size: 11px; white-space: nowrap; padding-top: 1px; }
.ms-ok .ms-ic { background: #e7f6ee; color: #126b3e; } .ms-ok .ms-st { color: #126b3e; }
.ms-miss .ms-ic { background: #fdecea; color: #b42318; } .ms-miss .ms-st { color: #b42318; font-weight: 600; }
.ms-part .ms-ic { background: #fdf6e3; color: #92600a; } .ms-part .ms-st { color: #92600a; }
.ms-ask .ms-ic { background: #eef2fb; color: #3557a0; } .ms-ask .ms-st { color: #3557a0; }
.ms-na .ms-ic { background: var(--line2, #eef1f5); color: var(--muted); } .ms-na .ms-st { color: var(--muted); } .ms-na .ms-l b { font-weight: 500; color: var(--ink2); }
.ms-done { margin-top: 6px; font-size: 11.5px; color: #126b3e; }
.ms-lost { margin-top: 6px; font-size: 11.5px; color: #b42318; background: #fdf3f2; border-radius: 6px; padding: 6px 8px; }

/* Overview > the aggregate today (aggsum.js): four tiles, each opening its tab */
.agg-sum .agg-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; padding: 12px; }
@media (max-width: 900px) { .agg-sum .agg-row { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.agg-tile { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; text-align: left; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); color: var(--ink); font: inherit; cursor: pointer; min-width: 0; }
.agg-tile:hover { border-color: var(--accent); }
.agg-tile .agg-l { font-size: 11.5px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); display: inline-flex; align-items: center; gap: 6px; }
.agg-tile .agg-v { font-size: 22px; font-weight: 700; line-height: 1.1; }
.agg-tile .agg-u { font-size: 12px; color: var(--ink2); margin-top: -2px; }
.agg-tile .agg-s { font-size: 11.5px; color: var(--muted); }
.agg-tile .agg-lims { display: flex; flex-direction: column; gap: 4px; width: 100%; }
.agg-tile .agg-lim { display: grid; grid-template-columns: minmax(0, 1fr) 70px auto; gap: 6px; align-items: center; font-size: 12px; }
.agg-tile .agg-ln { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agg-tile .agg-bad { color: var(--bad); } .agg-tile .agg-warn { color: var(--warn, #b7791f); }
.agg-tile .agg-bar { display: block; height: 6px; border-radius: 3px; background: var(--line2, var(--line)); overflow: hidden; }
.agg-tile .agg-bar i { display: block; height: 100%; background: var(--accent); }
.agg-tile .agg-bar.warn i { background: var(--warn, #b7791f); } .agg-tile .agg-bar.bad i { background: var(--bad); }
/* a pick-one list in a dialog (Which division?): one choice per row, its programs beneath */
.pick-list { display: flex; flex-direction: column; gap: 6px; margin: 10px 0 4px; }
.pick-list .btn { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; text-align: left; white-space: normal; padding: 8px 12px; }
.pick-list .btn span { font-size: 11.5px; font-weight: 400; }
/* Book › Notional: the upload, first on the page */
.bk-up .pb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.bk-up .pb > .muted { font-size: 12.5px; flex: 1 1 360px; }
.bk-up .bk-up-btns { display: inline-flex; gap: 8px; flex-wrap: wrap; }

/* The green highlight (2026-10-15): one colour per state on every desk, as a bar on the row's left edge (and a light tint when it
   passed everything). pass = approved, or MPAC says it fits with nothing open; you = waiting on you; wait = on someone else or MPAC;
   fail = declined or outside the rules. Rows (tr) carry it on their first cell. */
.st-pass { --stc: var(--ok); } .st-you { --stc: var(--warn); } .st-wait { --stc: var(--line, #c9ced6); } .st-fail { --stc: var(--bad); }
.qi.st-pass, .qi.st-you, .qi.st-wait, .qi.st-fail, .bu-card.st-pass { box-shadow: inset 4px 0 0 var(--stc); }
.qi.sel.st-pass, .qi.sel.st-you, .qi.sel.st-wait, .qi.sel.st-fail { box-shadow: inset 4px 0 0 var(--stc), inset 7px 0 0 var(--accent); }
.qi.st-pass, .bu-card.st-pass { background: var(--ok-soft); }
.qi.sel.st-pass { background: var(--accent-soft); }
tr.st-pass > td:first-child, tr.st-you > td:first-child, tr.st-wait > td:first-child, tr.st-fail > td:first-child { box-shadow: inset 4px 0 0 var(--stc); }
tr.st-pass > td { background: var(--ok-soft); }
tr.st-pass.open > td, tr.st-pass.sel > td { background: var(--accent-soft); }
/* the New submission form's locations: Loc 1, Loc 2, + Add location */
.loc-tabs { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 14px 0 10px; padding-top: 12px; border-top: 1px solid var(--line2, var(--line)); }
.loc-tab { border: 1px solid var(--line); background: var(--panel, #fff); color: var(--ink, inherit); border-radius: 8px; padding: 5px 10px; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; display: inline-flex; gap: 6px; align-items: baseline; }
.loc-tab span { font-weight: 400; color: var(--muted); font-size: 11.5px; }
.loc-tab.on { border-color: var(--accent); background: var(--accent-soft); color: var(--accent); }
.locans table { margin-top: 4px; }

/* the type tags (SUB / SOV / BOOK / EVAL / POL) style themselves: mpac-shared/type-tags.js */
/* a schedule's or a book's lines: one line until opened */
details.locans > summary { cursor: pointer; list-style: none; } details.locans > summary::-webkit-details-marker { display: none; }
details.locans > summary::before { content: '▸ '; color: var(--muted); } details.locans[open] > summary::before { content: '▾ '; }
/* the Overview pages' map (ovmap.js, 2026-10-15): at the bottom, folded until opened; the dots in the status colours */
details.panel.ov-map > summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
details.panel.ov-map > summary::-webkit-details-marker { display: none; }
details.panel.ov-map > summary h3::before { content: '▸ '; color: var(--muted); font-weight: 400; } details.panel.ov-map[open] > summary h3::before { content: '▾ '; }
details.panel.ov-map > summary h3 { margin: 0; }
.ovm-box { height: 440px; border-top: 1px solid var(--line2, var(--line)); }
.ovm-box .pb { padding: 14px; }
.ovm-legend { margin-left: auto; display: inline-flex; flex-wrap: wrap; gap: 12px; font-size: 11.5px; color: var(--ink2); }
.ovm-lg i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 5px; }
.leaflet-popup-content { font-size: 12.5px; line-height: 1.45; }
/* the row picked or opened (2026-10-15, the user: the green "clicked" read as the green "approved"): a neutral outline and a light
   grey, never the desk's accent, so it can't be mistaken for a status. The status bar on the left stays as it is. */
.qi.sel { background: var(--panel-2, #f1f3f6); box-shadow: inset 0 0 0 2px var(--ink2, #475569); }
.qi.sel.st-pass, .qi.sel.st-you, .qi.sel.st-wait, .qi.sel.st-fail { box-shadow: inset 4px 0 0 var(--stc), inset 0 0 0 2px var(--ink2, #475569); }
.qi.sel.st-pass { background: var(--panel-2, #f1f3f6); }
tr.loc.open td, tr.arow.open td { background: var(--panel-2, #f1f3f6); }
tr.loc.open > td:first-child, tr.arow.open > td:first-child { box-shadow: inset 3px 0 0 var(--ink2, #475569); }
tr.loc.open.st-pass > td:first-child, tr.loc.open.st-you > td:first-child, tr.loc.open.st-wait > td:first-child, tr.loc.open.st-fail > td:first-child,
tr.arow.open.st-pass > td:first-child, tr.arow.open.st-you > td:first-child, tr.arow.open.st-wait > td:first-child, tr.arow.open.st-fail > td:first-child { box-shadow: inset 4px 0 0 var(--stc); }
tr.st-pass.open > td, tr.st-pass.sel > td { background: var(--panel-2, #f1f3f6); }
tr.loc.open td, tr.arow.open td { border-top: 1px solid var(--ink2, #475569); }
/* the reasons a submission is held, together, above its one decision (2026-10-15) */
.holds { margin: 4px 0 10px; } ul.hold-list { margin: 0; padding-left: 18px; font-size: 12.5px; } ul.hold-list li { margin: 2px 0; }
/* the Retail Submissions table fits a 1366px screen (UI/UX review 2026-10-15): its answer and next-step badges wrap rather than push
   the table wider than the page, and the panel header's filter wraps onto a second line */
.mine table td .badge, .mine table td .tag { white-space: normal; text-align: left; }
.mine table td:nth-child(5), .mine table td:nth-child(6) { min-width: 120px; max-width: 220px; }
.mine .panel { overflow-x: auto; }
/* a tab this seat can't use yet: greyed with the reason on hover, never hidden */
.vt-bar button.off { opacity: .45; font-style: italic; } .vt-bar button.off.on { opacity: .7; }
details.rf-locs summary { cursor: pointer; } details.rf-locs > div { margin: 2px 0 0 14px; }
/* "Closest to full": each limit's whole name above its bar (UI/UX review 2026-10-15: one line cut the names to "MSW Healthca…") */
.agg-tile .agg-lim { grid-template-columns: minmax(0, 1fr) auto; row-gap: 1px; }
.agg-tile .agg-ln { grid-column: 1 / -1; white-space: normal; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height: 1.3; }