/* InsightOS extensions over the SME chassis — layout modes, LeftNav, ContextDrawer, Inbox rows, Tasks board, DMS panes, demo panel. Values use SME tokens only. */
/* ---- shell geometry ---- */
.app{grid-template-columns:minmax(0,1fr)}
.topbar{min-width:0}.topbar .cmd-trigger{flex:0 1 min(440px,42vw);min-width:0;width:auto}
.body{grid-template-columns:var(--nav-w) minmax(0,1fr)}
body[data-shell="l2"] .body{grid-template-columns:var(--rail-w) var(--side-w) minmax(0,1fr)}
body[data-nav="collapsed"][data-shell="l1"] .body{grid-template-columns:var(--rail-w) minmax(0,1fr)}
.content{flex-direction:row;min-width:0}.panel{min-width:0}
.ctxdrawer{width:var(--ctx-w);flex-shrink:0;border-inline-start:1px solid var(--border-subtle);background:var(--bg-app);overflow-y:auto;display:flex;flex-direction:column}
.ctx-head{display:flex;align-items:flex-start;gap:10px;padding:14px 16px;border-bottom:1px solid var(--border-subtle)}
.ctx-head .t{font-size:13.5px;font-weight:600;color:var(--text-strong);flex:1;min-width:0}
.ctx-head .s{font-size:11.5px;color:var(--text-tertiary);margin-top:2px}
.ctx-body{padding:14px 16px;display:flex;flex-direction:column;gap:16px}
/* ---- top bar ---- */
.wordmark{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 8px;border-radius:var(--radius-md)}
.wordmark .mk{width:24px;height:24px;border-radius:var(--radius-sm);background:var(--royal);color:#fff;display:grid;place-items:center;font-family:var(--font-mono);font-size:9.5px;font-weight:500;letter-spacing:.02em}
.wordmark .wm{font-weight:600;color:var(--text-strong);font-size:13.5px;letter-spacing:-.01em}
.ent-switch{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 9px;border-radius:var(--radius-md);border:1px solid var(--border-subtle);font-size:12px;color:var(--text-body);white-space:nowrap;flex-shrink:0}
.ent-switch:hover{background:var(--bg-hover);color:var(--text-strong)}
.ent-switch .k{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-tertiary);font-weight:600}
.ent-switch .v{font-weight:500;color:var(--text-strong)}
.ent-switch.reporting .v{color:var(--text-muted);font-style:italic}
/* ---- left nav (expanded 204 / rail 48) ---- */
.lnav{background:var(--bg-app);border-inline-end:1px solid var(--border-subtle);display:flex;flex-direction:column;min-height:0}
.lnav-scroll{flex:1;overflow-y:auto;padding:8px 8px 6px}
.lnav-foot{border-top:1px solid var(--border-subtle);padding:8px;display:flex;flex-direction:column;gap:2px}
.ln-grp{padding:12px 8px 3px;font-size:9.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-tertiary);display:flex;align-items:center;gap:6px;width:100%;text-align:start}
.ln-grp svg{width:10px;height:10px;transition:transform var(--d-fast)}
.ln-grp.closed svg{transform:rotate(-90deg)}
.ln-grp:first-child{padding-top:4px}
.ln-item{display:flex;align-items:center;gap:9px;width:100%;padding:0 8px;height:30px;border-radius:var(--radius-sm);font-size:12.5px;color:var(--text-muted);text-align:start;transition:all var(--d-fast);position:relative;white-space:nowrap}
.ln-item:hover{background:var(--bg-hover);color:var(--text-strong)}
.ln-item.is-active{background:var(--accent-100);color:var(--accent-text-on);font-weight:500}
.ln-item.is-active::before{content:'';position:absolute;inset-inline-start:-8px;top:7px;bottom:7px;width:3px;border-radius:0 3px 3px 0;background:var(--accent-500)}
.ln-item svg{color:var(--text-tertiary);flex-shrink:0}
.ln-item.is-active svg{color:var(--accent-text-on)}
.ln-item .ct{margin-inline-start:auto;font-family:var(--font-mono);font-size:10px;color:var(--text-tertiary);background:var(--bg-elevated);padding:0 5px;border-radius:99px}
.ln-item .lbl{overflow:hidden;text-overflow:ellipsis}
.ln-group-items.closed{display:none}
.lnav.rail .ln-grp,.lnav.rail .ln-item .lbl,.lnav.rail .ln-item .ct{display:none}
.lnav.rail .lnav-scroll,.lnav.rail .lnav-foot{padding:8px 6px;align-items:center}
.lnav.rail .ln-item{width:36px;height:36px;padding:0;justify-content:center;margin:2px auto}
.lnav.rail .ln-item.is-active::before{inset-inline-start:-6px}
.lnav.rail .ln-group-items.closed{display:block}
.lnav.rail .ln-group-items{border-top:1px solid var(--border-subtle);margin-top:4px;padding-top:4px}
.lnav.rail .ln-group-items:first-of-type{border-top:none;margin-top:0;padding-top:0}
.nav-toggle{display:flex;align-items:center;gap:9px;width:100%;height:30px;padding:0 8px;border-radius:var(--radius-sm);font-size:12px;color:var(--text-tertiary)}
.nav-toggle:hover{background:var(--bg-hover);color:var(--text-strong)}
/* ---- L2 side (SME .side reused) additions ---- */
.side-record{padding:4px 8px 10px}
.side-record .rn{font-family:var(--font-mono);font-size:11px;color:var(--text-tertiary)}
.side-record .rt{font-size:14px;font-weight:600;color:var(--text-strong);line-height:1.3}
.side-record .rs{font-size:11.5px;color:var(--text-tertiary);margin-top:2px}
.side-nav .ct{margin-inline-start:auto;font-family:var(--font-mono);font-size:10px;color:var(--text-tertiary)}
/* ---- page header add-ons ---- */
.crumbs{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--text-tertiary);margin-bottom:10px;flex-wrap:wrap}
.crumbs a{color:var(--text-muted)}.crumbs a:hover{color:var(--accent-text-on)}
.crumbs svg{width:11px;height:11px}
.phead .pmeta{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;font-size:12px;color:var(--text-muted)}
.phead .pmeta .k{color:var(--text-tertiary)}
.phead .pmeta .mono{color:var(--text-strong)}
/* badge with icon (status families always text + icon) */
.badge{display:inline-flex;align-items:center;gap:5px;height:20px;padding:0 8px;border-radius:var(--radius-pill);font-size:var(--fs-chip);font-weight:500;white-space:nowrap}
.badge svg{width:11px;height:11px;stroke-width:2.2}
.badge.neutral{background:var(--neutral-bg);color:var(--neutral-fg)}
.badge.info{background:var(--color-info-100);color:var(--color-info-500)}
.badge.warn{background:var(--color-warning-100);color:var(--color-warning-500)}
.badge.ok{background:var(--color-success-100);color:var(--color-success-500)}
.badge.danger{background:var(--color-danger-100);color:var(--color-danger-500)}
.badge.accent{background:var(--accent-100);color:var(--accent-text-on)}
.badge.outline{background:transparent;border:1px solid var(--border-subtle);color:var(--text-muted)}
/* attention strip */
.attn{border:1px solid var(--border-subtle);border-radius:var(--radius-lg);overflow:hidden;margin-bottom:18px;background:var(--bg-surface)}
.attn-head{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--color-warning-100);border-bottom:1px solid var(--border-subtle)}
.attn-head svg{width:15px;height:15px;color:var(--color-warning-500)}
.attn-head .t{font-size:12.5px;font-weight:600;color:var(--text-strong)}
.attn-head .s{font-size:11.5px;color:var(--text-muted);margin-inline-start:auto}
.attn-row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1.5fr) 90px 110px auto;gap:12px;align-items:center;padding:9px 14px;border-top:1px solid var(--border-subtle);font-size:12.5px}
.attn-row:first-of-type{border-top:none}
.attn-row .h{color:var(--text-strong);font-weight:500;display:flex;align-items:center;gap:8px;min-width:0}
.attn-row .h .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attn-row .b{color:var(--text-muted);font-size:11.5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.attn-row .age{font-family:var(--font-mono);font-size:11px;color:var(--text-tertiary)}
.attn-row .own{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--text-muted)}
/* KPI drill */
.kpi{cursor:pointer;transition:background var(--d-fast);text-align:start}
.kpi:hover{background:var(--bg-hover)}
.kpi .sub{font-size:10.5px;color:var(--text-tertiary);margin-top:3px;font-family:var(--font-mono)}
.kpi .k .badge{margin-inline-start:6px;vertical-align:middle;height:16px;font-size:9.5px}
/* two-column dashboard grid */
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px;align-items:start}
.card{border:1px solid var(--border-subtle);border-radius:var(--radius-lg);background:var(--bg-surface);overflow:hidden}
.card-head{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--border-subtle)}
.card-head .t{font-size:12.5px;font-weight:600;color:var(--text-strong);flex:1}
.card-head .s{font-size:11px;color:var(--text-tertiary)}
.card-body{padding:12px 14px}
.card .dt-wrap{border:none;border-radius:0;overflow-x:auto}
.card .dt tbody td{white-space:normal}
.kpis{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.kpi .v{overflow-wrap:anywhere}
/* composition bar */
.compbar{display:flex;height:14px;border-radius:4px;overflow:hidden;background:var(--bg-elevated);margin:6px 0 10px}
.compbar span{display:block;height:100%}
.compbar .saas{background:var(--accent-500)}.compbar .ret{background:var(--color-info-500);opacity:.55}
.legend{display:flex;flex-wrap:wrap;gap:12px;font-size:11.5px;color:var(--text-muted)}
.legend i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-inline-end:5px;vertical-align:-1px}
.dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;font-size:12px;margin:0}
.dl dt{color:var(--text-tertiary)}.dl dd{margin:0;color:var(--text-strong)}
.dl dd.mono{font-family:var(--font-mono);font-size:11.5px}
.srcnote{font-size:11px;color:var(--text-tertiary);line-height:1.5;margin-top:8px}
/* ---- inbox ---- */
.inbox-grp{font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-tertiary);padding:14px 4px 6px}
.inbox-grp:first-child{padding-top:0}
.ib-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:0 12px;min-height:var(--row-h);border-bottom:1px solid var(--border-subtle);cursor:pointer;transition:background var(--d-fast);position:relative}
.ib-row:hover{background:var(--bg-hover)}
.ib-row.unread{background:color-mix(in oklab,var(--accent-500) 4%,transparent)}
.ib-row.unread::before{content:'';position:absolute;inset-inline-start:3px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--accent-500)}
.ib-row .ico{width:28px;height:28px;border-radius:var(--radius-sm);background:var(--bg-elevated);color:var(--text-muted);display:grid;place-items:center}
.ib-row .ico svg{width:14px;height:14px}
.ib-row .mainx{min-width:0;display:flex;flex-direction:column;gap:1px;padding:6px 0}
.ib-row .t{font-size:12.5px;color:var(--text-strong);display:flex;align-items:center;gap:8px;min-width:0}
.ib-row.unread .t{font-weight:600}
.ib-row .t .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ib-row .t .rn{font-family:var(--font-mono);font-size:10.5px;color:var(--text-tertiary);flex-shrink:0}
.ib-row .sub{font-size:11.5px;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ib-row .qa{display:flex;gap:4px;opacity:0;transition:opacity var(--d-fast)}
.ib-row:hover .qa,.ib-row:focus-within .qa{opacity:1}
.ib-row .tm{font-family:var(--font-mono);font-size:11px;color:var(--text-tertiary);white-space:nowrap}
.ib-list{border:1px solid var(--border-subtle);border-radius:var(--radius-lg);overflow:hidden;background:var(--bg-surface)}
.ib-list .ib-row:last-child{border-bottom:none}
/* ---- service desk three-pane ---- */
.sd{display:grid;grid-template-columns:200px minmax(280px,360px) minmax(0,1fr);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);overflow:hidden;height:calc(100vh - var(--topbar-h) - 160px);min-height:480px;background:var(--bg-surface)}
.sd-q{border-inline-end:1px solid var(--border-subtle);background:var(--bg-app);overflow-y:auto;padding:8px}
.sd-q .qh{font-size:9.5px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--text-tertiary);padding:10px 8px 4px}
.sd-q .qi{display:flex;align-items:center;gap:8px;width:100%;height:28px;padding:0 8px;border-radius:var(--radius-sm);font-size:12px;color:var(--text-muted);text-align:start}
.sd-q .qi:hover{background:var(--bg-hover);color:var(--text-strong)}
.sd-q .qi.is-active{background:var(--accent-100);color:var(--accent-text-on);font-weight:500}
.sd-q .qi .ct{margin-inline-start:auto;font-family:var(--font-mono);font-size:10px}
.sd-l{border-inline-end:1px solid var(--border-subtle);overflow-y:auto;display:flex;flex-direction:column}
.sd-l-head{display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:1px solid var(--border-subtle);flex-wrap:wrap}
.tk-row{display:flex;gap:10px;padding:10px 12px;border-bottom:1px solid var(--border-subtle);cursor:pointer;text-align:start;width:100%;transition:background var(--d-fast)}
.tk-row:hover{background:var(--bg-hover)}
.tk-row.is-active{background:var(--bg-row-sel);box-shadow:inset 2px 0 0 var(--accent-500)}
.tk-row .tx{flex:1;min-width:0}
.tk-row .l1{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--text-strong);font-weight:500}
.tk-row .l1 .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tk-row .l1 .tm{font-family:var(--font-mono);font-size:10.5px;color:var(--text-tertiary);font-weight:400}
.tk-row .l2{font-size:12px;color:var(--text-body);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:1px}
.tk-row .l3{display:flex;align-items:center;gap:6px;margin-top:5px;flex-wrap:wrap;font-size:11px;color:var(--text-tertiary)}
.sd-c{display:flex;flex-direction:column;min-width:0}
.sd-c-head{display:flex;align-items:flex-start;gap:12px;padding:12px 16px;border-bottom:1px solid var(--border-subtle)}
.sd-c-head .t{font-size:14px;font-weight:600;color:var(--text-strong)}
.sd-c-head .m{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:11.5px;color:var(--text-muted);margin-top:4px;align-items:center}
.sd-thread{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px}
.msgc{border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--bg-surface);overflow:hidden}
.msgc.out{border-color:var(--accent-100);background:color-mix(in oklab,var(--accent-100) 45%,var(--bg-surface))}
.msgc.note{border-color:color-mix(in oklab,var(--color-warning-500) 45%,transparent);background:var(--color-warning-100)}
.msgc-h{display:flex;align-items:center;gap:8px;padding:8px 12px;font-size:11.5px;color:var(--text-muted);border-bottom:1px solid var(--border-subtle)}
.msgc-h .who{font-weight:600;color:var(--text-strong)}
.msgc-h .tm{margin-inline-start:auto;font-family:var(--font-mono);font-size:10.5px}
.msgc-h .lockl{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--color-warning-500)}
.msgc-h .lockl svg{width:11px;height:11px}
.msgc-b{padding:10px 12px;font-size:12.5px;color:var(--text-body);line-height:1.6;white-space:pre-wrap}
.composer2{border-top:1px solid var(--border-subtle);padding:10px 16px 12px;background:var(--bg-app)}
.composer2 .cmode{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.composer2 .cfrom{font-size:11.5px;color:var(--text-muted)}
.composer2 .cfrom .mono{color:var(--text-strong)}
.composer2.note .composer{border-color:color-mix(in oklab,var(--color-warning-500) 50%,transparent);background:var(--color-warning-100)}
.composer2 .notewarn{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--color-warning-500);font-weight:500;margin-bottom:6px}
.composer2 .notewarn svg{width:13px;height:13px}
.sla{display:grid;grid-template-columns:1fr;gap:8px}
.sla-row{display:flex;justify-content:space-between;gap:10px;font-size:12px}
.sla-row .k{color:var(--text-tertiary)}.sla-row .v{color:var(--text-strong);text-align:end}
/* ---- tasks ---- */
.tl-grp{margin-bottom:18px}
.tl-grp-h{display:flex;align-items:center;gap:10px;padding:0 4px 8px}
.tl-grp-h .t{font-size:13px;font-weight:600;color:var(--text-strong)}
.tl-grp-h .p{font-size:11px;color:var(--text-tertiary);font-family:var(--font-mono)}
.tl-grp-h .pb{width:80px;height:5px;border-radius:3px;background:var(--bg-elevated);overflow:hidden}
.tl-grp-h .pb span{display:block;height:100%;background:var(--color-success-500)}
.tl-grp-h .sp{flex:1}
.tstate{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--border-strong);display:inline-grid;place-items:center;flex-shrink:0;background:var(--bg-surface)}
.tstate.done{background:var(--color-success-500);border-color:var(--color-success-500)}
.tstate.done svg{width:10px;height:10px;color:var(--text-on-accent);stroke-width:3}
.tstate.prog{border-color:var(--accent-500);background:conic-gradient(var(--accent-500) 50%,transparent 0)}
.tstate.blocked{border-color:var(--color-danger-500);background:var(--color-danger-100)}
.prio{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:500}
.prio i{width:8px;height:8px;border-radius:2px}
.prio.high i{background:var(--color-danger-500)}.prio.med i{background:var(--color-warning-500)}.prio.low i{background:var(--text-tertiary)}
.due{font-family:var(--font-mono);font-size:11.5px;color:var(--text-muted)}
.due.over{color:var(--color-danger-500);font-weight:500}
.due.soon{color:var(--color-warning-500)}
.board{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:12px;align-items:start;overflow-x:auto}
.bcol{background:var(--bg-app);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);min-height:200px}
.bcol-h{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--border-subtle);font-size:12px;font-weight:600;color:var(--text-strong)}
.bcol-h .ct{font-family:var(--font-mono);font-size:10.5px;color:var(--text-tertiary);font-weight:400;background:var(--bg-elevated);padding:0 6px;border-radius:99px}
.bcol-b{padding:8px;display:flex;flex-direction:column;gap:8px}
.bcard{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:10px 11px;cursor:pointer;transition:all var(--d-fast);text-align:start;width:100%}
.bcard:hover{border-color:var(--border-default);box-shadow:var(--shadow-sm)}
.bcard.dragging{opacity:.5}
.bcol.over{outline:2px dashed var(--accent-500);outline-offset:-2px}
.bcard .bt{font-size:12.5px;color:var(--text-strong);font-weight:500;line-height:1.4}
.bcard .bm{display:flex;align-items:center;gap:8px;margin-top:8px;flex-wrap:wrap}
.bcard .rn{font-family:var(--font-mono);font-size:10.5px;color:var(--text-tertiary)}
.bcard .bm .av{margin-inline-start:auto}
.dep{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);font-size:12px;background:var(--bg-app)}
.dep .rn{font-family:var(--font-mono);font-size:10.5px;color:var(--text-tertiary)}
.dep .nm{flex:1;color:var(--text-strong)}
.comment{display:flex;gap:10px}
.comment .cx{flex:1;min-width:0}
.comment .ch{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--text-tertiary)}
.comment .ch .who{font-weight:600;color:var(--text-strong)}
.comment .cb2{font-size:12.5px;color:var(--text-body);line-height:1.55;margin-top:3px}
.comment .cb2 .mention{color:var(--accent-text-on);font-weight:500}
.aud{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;padding:1px 6px;border-radius:var(--radius-sm)}
.aud.int{background:var(--color-warning-100);color:var(--color-warning-500)}
.aud.cli{background:var(--color-info-100);color:var(--color-info-500)}
/* ---- DMS ---- */
.dms{display:grid;grid-template-columns:236px minmax(0,1fr);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);overflow:hidden;min-height:520px;background:var(--bg-surface)}
.dms-tree{border-inline-end:1px solid var(--border-subtle);background:var(--bg-app);overflow-y:auto;padding:8px}
.dms-tree .th{font-size:9.5px;font-weight:600;text-transform:uppercase;letter-spacing:.07em;color:var(--text-tertiary);padding:8px 8px 6px}
.tnode-row{padding-inline-start:calc(10px + var(--depth,0) * 18px)}
.tnode-row.is-active{background:var(--bg-row-sel);box-shadow:inset 2px 0 0 var(--accent-500)}
.tnode-flag{display:inline-flex;align-items:center;gap:3px;font-size:9.5px;font-weight:600;color:var(--text-tertiary)}
.tnode-flag svg{width:10px;height:10px}
.tnode-flag.hold{color:var(--color-warning-500)}
.dms-main{display:flex;flex-direction:column;min-width:0}
.dms-tb{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--border-subtle);flex-wrap:wrap}
.dms-main .dt-wrap{border:none;border-radius:0;flex:1}
.ficon{width:26px;height:26px;border-radius:var(--radius-sm);display:grid;place-items:center;background:var(--bg-elevated);color:var(--text-muted);flex-shrink:0}
.ficon svg{width:14px;height:14px}
.ficon.pdf{color:var(--color-danger-500);background:var(--color-danger-100)}
.ficon.docx{color:var(--color-info-500);background:var(--color-info-100)}
.ficon.gen{color:var(--accent-text-on);background:var(--accent-100)}
.pv-page{background:#fff;color:#14151A;border:1px solid var(--border-default);border-radius:2px;padding:26px 24px;font-family:var(--font-ui);font-size:10.5px;line-height:1.5;box-shadow:var(--shadow-md);min-height:360px;position:relative}
.pv-page .ph1{font-size:15px;font-weight:600;color:#0066CC;letter-spacing:.02em}
.pv-page .stamp{position:absolute;top:14px;inset-inline-end:14px;border:2px solid #991B1B;color:#991B1B;font-weight:700;font-size:9px;letter-spacing:.08em;padding:3px 7px;transform:rotate(-4deg);text-transform:uppercase}
.pv-page table{width:100%;border-collapse:collapse;margin-top:12px;font-size:9.5px}
.pv-page th{text-align:start;border-bottom:1px solid #64748B;padding:4px 0;font-weight:600}
.pv-page td{padding:4px 0;border-bottom:1px solid #E3E2DD}
.pv-page .num{text-align:end;font-family:var(--font-mono)}
.pv-wrap{background:var(--bg-sunken);padding:18px;border-radius:var(--radius-md);display:flex;flex-direction:column;gap:12px;align-items:stretch}
.pv-tools{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.pv-tools .pg{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);margin:0 6px}
.share-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--border-subtle);font-size:12.5px}
.share-row:first-of-type{border-top:none}
.share-row .who{flex:1;min-width:0}
.share-row .who .n{color:var(--text-strong);font-weight:500}
.share-row .who .v{font-size:11px;color:var(--text-tertiary)}
.ver{display:flex;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--border-subtle);font-size:12px}
.ver:first-child{border-top:none}
.ver .vn{font-family:var(--font-mono);font-size:11px;color:var(--text-strong);min-width:28px}
.ver .vx{flex:1;color:var(--text-muted)}
/* ---- timeline ---- */
.tline{display:flex;flex-direction:column;gap:0}
.tl-i{display:grid;grid-template-columns:18px 1fr;gap:10px;position:relative;padding-bottom:14px}
.tl-i::before{content:'';position:absolute;inset-inline-start:8px;top:18px;bottom:0;width:1px;background:var(--border-subtle)}
.tl-i:last-child::before{display:none}
.tl-i .dot{width:18px;height:18px;border-radius:50%;background:var(--bg-elevated);display:grid;place-items:center;color:var(--text-tertiary)}
.tl-i .dot svg{width:10px;height:10px}
.tl-i .dot.ok{background:var(--color-success-100);color:var(--color-success-500)}
.tl-i .dot.warn{background:var(--color-warning-100);color:var(--color-warning-500)}
.tl-i .dot.danger{background:var(--color-danger-100);color:var(--color-danger-500)}
.tl-i .tx .h{font-size:12.5px;color:var(--text-body);line-height:1.45}
.tl-i .tx .h strong{color:var(--text-strong);font-weight:500}
.tl-i .tx .m{font-size:11px;color:var(--text-tertiary);margin-top:2px;font-family:var(--font-mono)}
/* ---- masked value / show-once ---- */
.masked-val .val{font-family:var(--font-mono)}
.masked-val.denied .dots{color:var(--text-disabled)}
/* ---- pipeline board (opps) ---- */
.pipe{display:grid;grid-template-columns:repeat(5,minmax(180px,1fr));gap:10px;overflow-x:auto}
.pipe .bcol-h .sum{margin-inline-start:auto;font-family:var(--font-mono);font-size:10.5px;color:var(--text-muted);font-weight:400}
/* ---- policy / rule preview ---- */
.simrow{display:grid;grid-template-columns:1fr 1fr auto;gap:10px;align-items:center;padding:9px 12px;border-top:1px solid var(--border-subtle);font-size:12px}
.simrow:first-child{border-top:none}
.simrow .k{color:var(--text-muted)}.simrow .v{font-family:var(--font-mono);color:var(--text-strong);font-size:11.5px}
/* ---- component sheet ---- */
.sheet-row td .badge{vertical-align:middle}
.sheet-key{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--text-muted);margin-bottom:12px}
/* ---- demo panel ---- */
.demo{position:fixed;bottom:18px;inset-inline-end:18px;width:300px;background:var(--bg-elevated);border:1px solid var(--border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);z-index:80;display:none;flex-direction:column;max-height:84vh}
.demo.show{display:flex}
.demo-head{display:flex;align-items:center;gap:8px;padding:11px 14px;border-bottom:1px solid var(--border-subtle)}
.demo-head .t{font-size:12.5px;font-weight:600;color:var(--text-strong);flex:1}
.demo-head .tag{font-family:var(--font-mono)}
.demo-body{overflow-y:auto;padding:12px 14px;display:flex;flex-direction:column;gap:14px}
.demo-fab{position:fixed;bottom:18px;inset-inline-end:18px;height:30px;padding:0 10px;border-radius:var(--radius-pill);background:var(--bg-elevated);border:1px solid var(--border-default);color:var(--text-muted);font-size:10.5px;font-weight:700;letter-spacing:.06em;display:inline-flex;align-items:center;gap:6px;z-index:79;box-shadow:var(--shadow-md)}
.demo-fab:hover{color:var(--text-strong)}
.demo.show ~ .demo-fab{display:none}
.tw-seg button{flex:1;min-width:0}
.tw-seg.wrap{flex-wrap:wrap}
.tw-seg.wrap button{flex:1 1 30%}
.demo .select{min-height:30px;padding:4px 9px;font-size:12px;display:flex;align-items:center;justify-content:space-between;background:var(--bg-app);border:1px solid var(--border-default);border-radius:var(--radius-md);color:var(--text-strong);cursor:pointer;width:100%}
.demo select{width:100%;min-height:30px;padding:4px 8px;font:inherit;font-size:12px;background:var(--bg-app);border:1px solid var(--border-default);border-radius:var(--radius-md);color:var(--text-strong)}
/* ---- planned screen ---- */
.planned{border:1px dashed var(--border-strong);border-radius:var(--radius-lg);padding:28px;max-width:640px}
.planned .t{font-size:14px;font-weight:600;color:var(--text-strong)}
.planned .b{font-size:12.5px;color:var(--text-muted);margin-top:6px;line-height:1.55}
.planned .b strong{color:var(--text-strong)}
/* ---- denied ---- */
.denied{text-align:center;padding:56px 24px;max-width:520px;margin:0 auto}
.denied .ic{width:48px;height:48px;border-radius:12px;background:var(--bg-elevated);color:var(--text-tertiary);display:grid;place-items:center;margin:0 auto 14px}
.denied .t{font-size:15px;font-weight:600;color:var(--text-strong)}
.denied .b{font-size:12.5px;color:var(--text-muted);margin-top:6px;line-height:1.55}
/* ---- responsive ---- */
@media (max-width:1100px){.sd{grid-template-columns:170px minmax(240px,300px) minmax(0,1fr)}.ctxdrawer{width:320px}}
@media (max-width:900px){.body,body[data-shell="l2"] .body{grid-template-columns:var(--rail-w) 1fr}.lnav .ln-grp,.lnav .ln-item .lbl,.lnav .ln-item .ct{display:none}.lnav .ln-item{width:36px;height:36px;padding:0;justify-content:center;margin:2px auto}.lnav .lnav-scroll,.lnav .lnav-foot{padding:8px 6px}.side{display:none}.sd{grid-template-columns:minmax(220px,280px) minmax(0,1fr)}.sd-q{display:none}.ctxdrawer{display:none}.dms{grid-template-columns:1fr}.dms-tree{display:none}.board{grid-template-columns:repeat(4,240px)}.field-row,.field-row.three{grid-template-columns:1fr}.attn-row{grid-template-columns:minmax(0,1fr) auto;gap:6px 12px}.attn-row .b,.attn-row .own{display:none}}
@media (max-width:640px){.scroll-pad{padding:16px 16px 40px}.sd{grid-template-columns:1fr;height:auto}.sd-l{display:none}.kpis{grid-template-columns:1fr 1fr}.topbar .cmd-trigger{width:36px;padding:0;justify-content:center}.topbar .cmd-trigger .ph,.topbar .cmd-trigger .kbd{display:none}.ent-switch .k{display:none}}
@media (prefers-reduced-motion:reduce){.rdrawer,.ctxdrawer,.modal,.menu{transition:none}}
@media (forced-colors:active){.badge,.pill,.btn{border:1px solid ButtonText}}

/* timesheet */
.ts-cell{width:64px;height:28px;border:1px solid transparent;border-radius:var(--radius-sm,6px);background:transparent;text-align:end;font-size:12.5px;color:var(--text-strong);padding:0 6px}.ts-cell:hover{border-color:var(--border-subtle);background:var(--bg-surface)}.ts-cell:focus{outline:none;border-color:var(--focus,var(--color-info-500));background:var(--bg-surface)}.dt td.ts-we{background:var(--bg-elevated)}.dt td.is-error .ts-cell{border-color:var(--color-danger-500)}

/* ===== finish pass: symmetry, rhythm, motion ===== */
/* page header: title + actions on one row, description full width */
.phead{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:16px;row-gap:0}
.phead .pht{display:contents}
.phead .ptitle{grid-column:1;min-height:32px}
.phead .pacts{grid-column:2;grid-row:1;align-self:center;flex-wrap:wrap;justify-content:flex-end}
.phead .psub,.phead .pmeta{grid-column:1/-1}
.phead .psub{max-width:88ch;margin-top:8px;text-wrap:pretty}
.phead .pmeta>span{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
/* KPI strip: always a symmetric grid */
.kpis{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.kpis:has(>:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
.kpis:has(>:nth-child(4):last-child){grid-template-columns:repeat(4,minmax(0,1fr))}
.kpis:has(>:nth-child(5):last-child),.kpis:has(>:nth-child(6):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1180px){.kpis:has(>:nth-child(4):last-child),.kpis:has(>:nth-child(6):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}.kpis:has(>:nth-child(5):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}
.kpi{min-width:0;padding:14px 16px}.kpi .v{font-size:20px}.kpi .k{margin-top:7px}.kpi .sub{margin-top:4px;font-family:var(--font-sans);font-size:11px}
.kpi:focus-visible{outline:2px solid var(--accent-500);outline-offset:-2px}
/* toolbar: one 28px control height, search flexes, chips stay together */
.toolbar{gap:8px;margin-bottom:14px}
.toolbar .search{flex:1 1 180px;max-width:280px;min-width:150px;width:auto}
.toolbar .spacer{flex:1 1 0;min-width:0}
.toolbar .segctl{padding:2px}.toolbar .segctl button{height:22px;padding:0 10px}
.toolbar>*{flex-shrink:0}.toolbar .search,.toolbar .spacer{flex-shrink:1}.toolbar .segctl{display:inline-flex}
.segments{gap:6px}
/* tables: wide registers scroll instead of wrapping */
.dt-wrap.scroll-x .dt tbody td{white-space:nowrap}
.dt-wrap.scroll-x .dt tbody td:first-child{min-width:200px}
.dt-wrap.scroll-x .dt tbody td:first-child .badge.outline{margin-inline-start:6px;vertical-align:middle}
.dt thead th{white-space:nowrap}
.dt tbody tr.clickable:focus-visible{outline:2px solid var(--accent-500);outline-offset:-2px}
.row-actions{display:inline-flex;gap:2px;opacity:0;transition:opacity var(--d-fast)}
tr:hover .row-actions,tr:focus-within .row-actions{opacity:1}
.row-actions button{width:26px;height:26px;border-radius:var(--radius-sm);display:grid;place-items:center;color:var(--text-tertiary)}
.row-actions button:hover{background:var(--bg-active);color:var(--text-strong)}
.row-actions svg{width:14px;height:14px}
/* left nav: compact utility row frees the rail for modules */
.lnav-foot{flex-direction:row;align-items:center;justify-content:space-between;gap:2px;padding:8px 10px}
.lnav-foot .ln-item,.lnav-foot .nav-toggle{width:32px;height:32px;padding:0;justify-content:center;flex:0 0 auto}
.lnav-foot .lbl,.lnav-foot .ct{display:none}
.lnav-foot .ln-item.is-active::before{display:none}
.lnav.rail .lnav-foot{flex-direction:column;justify-content:flex-start;padding:8px 6px}
.lnav-scroll{padding-bottom:12px;scrollbar-width:thin}
.ln-grp{padding-top:14px}
/* service desk: two-pane below 1180px, queues become pills */
@media (max-width:1280px){.sd{grid-template-columns:176px minmax(250px,320px) minmax(0,1fr)}}
@media (max-width:1180px){.sd{grid-template-columns:minmax(250px,320px) minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}.sd-q{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:4px;padding:8px 10px;border-inline-end:none;border-bottom:1px solid var(--border-subtle);overflow:visible}.sd-q .qh{font-size:9.5px;padding:0 6px 0 2px}.sd-q .qh:not(:first-child){margin-inline-start:8px;padding-inline-start:10px;border-inline-start:1px solid var(--border-subtle)}.sd-q .qi{width:auto;height:26px;padding:0 10px;border-radius:99px;border:1px solid var(--border-subtle);gap:6px}.sd-q .qi .ct{margin-inline-start:2px}}
.sd-c-head .t{overflow-wrap:normal;word-break:normal;line-height:1.35}
.sd-c-head>.btn,.sd-c-head .pacts{flex-shrink:0}
/* save bar never covers the DEMO fab */
body:has(.savebar) .demo-fab{bottom:66px}
/* drawer + page motion */
@keyframes ins-fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.scroll-pad{animation:ins-fade .18s ease-out}
.kpi,.btn,.chip,.segment,.ln-item,.tab{transition:background var(--d-fast),color var(--d-fast),border-color var(--d-fast),box-shadow var(--d-fast)}
.btn:active,.chip:active,.segment:active{transform:translateY(0.5px)}
.card{transition:box-shadow var(--d-fast)}
@media (prefers-reduced-motion:reduce){.scroll-pad{animation:none}*{transition-duration:0s!important}}
/* pipeline board columns share width, scroll as one strip */
.pipe{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,1fr);gap:12px;overflow-x:auto;padding-bottom:8px;scrollbar-width:thin}
/* uniform empty + note spacing */
.srcnote{margin-top:10px}

/* home attention rows: stack title over basis below 1280px so nothing truncates twice */
@media (max-width:1280px){.attn-row{grid-template-columns:minmax(0,1fr) 44px auto auto;row-gap:2px}.attn-row .h{grid-column:1;grid-row:1}.attn-row .b{grid-column:1;grid-row:2;white-space:normal}.attn-row .age{grid-row:1/3}.attn-row .own{grid-row:1/3}.attn-row .own span:not(.av){display:none}.attn-row>.btn{grid-row:1/3}}
/* timesheet grid */
.dt th.ts-d{min-width:72px}.dt th.ts-d small{display:block;font-weight:400;letter-spacing:0;text-transform:none;color:var(--text-tertiary)}

/* segmented radio: icon + label always on one line */
.segctl button{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.segctl button svg{width:13px;height:13px;flex-shrink:0}
/* page actions never wrap into the description */
.phead .pacts{flex-wrap:nowrap}
/* board card meta items stay intact */
.bcard .bm>*{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.bcard .bm .due svg{width:12px;height:12px}
/* mono identifiers never break mid-token */
.dt tbody td .mono,.dt tbody td.mono{white-space:nowrap}
/* DMS tree labels get the room they need */
.tree .lbl{min-width:0;overflow:hidden;text-overflow:ellipsis}
body:has(#rdrawer.show) .demo-fab,body:has(#modal.show) .demo-fab,body:has(.modal.show) .demo-fab{display:none}

/* DMS: tighter indent, wider tree on narrow panes, flags don't steal label room */
.dms{grid-template-columns:clamp(220px,26%,260px) minmax(0,1fr)}
.dms-tree{padding:8px 6px}
.tnode-row{padding-inline-start:calc(6px + var(--depth,0) * 14px);padding-inline-end:6px;gap:6px}
.dms-tree .tnode-ico{width:20px;height:20px}
.dms-tree .tnode-flag{margin-inline-start:auto;flex-shrink:0}
.dms-tree .tnode-name{font-weight:500}
.dms-main .dt tbody td .mono{white-space:nowrap}
.dms-tb .search{flex:1 1 160px;max-width:260px}
.dms-tb .segments{flex-wrap:nowrap}
@media (max-width:1100px){.dms{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr)}.dms-tree{border-inline-end:none;border-bottom:1px solid var(--border-subtle);max-height:220px}}
/* pipeline: Won column collapses to a rail */
.pipe .bcol.won-collapsed{grid-auto-columns:auto;width:44px;min-width:44px}
.pipe .bcol.won-collapsed .bcol-h{writing-mode:vertical-rl;transform:rotate(180deg);height:100%;border-bottom:none;border-inline-start:1px solid var(--border-subtle);padding:12px 8px;justify-content:flex-end}
.pipe .bcol.won-collapsed .bcol-b{display:none}
.pipe .bcol-h .tog{margin-inline-start:6px;width:20px;height:20px;border-radius:4px;display:grid;place-items:center;color:var(--text-tertiary)}
.pipe .bcol-h .tog:hover{background:var(--bg-hover);color:var(--text-strong)}
.pipe .bcol-h .tog svg{width:12px;height:12px}
.pipe .bcol.won-collapsed .bcol-h .tog{transform:rotate(90deg)}
.pipe{grid-auto-columns:minmax(210px,1fr)}
.pipe .bcol.won-collapsed{grid-column:auto;justify-self:stretch}

/* the panel never scrolls sideways; wide strips scroll inside themselves */
.scroll{overflow-x:hidden}.scroll-pad{min-width:0;max-width:100%}.scroll-pad.wide{max-width:100%}
.pipe{grid-template-columns:none;align-items:start;width:100%;max-width:100%}
.pipe .bcol.won-collapsed .bcol-h{height:auto;min-height:180px}
.dms{min-height:0}
@media (max-width:1100px){.dms-tree{max-height:200px;scrollbar-width:thin}}

/* KPI cards: top-aligned columns, one-line value, label always at the same y */
.kpi{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:16px 16px 14px;text-align:start}
.kpi .v{display:flex;align-items:center;min-height:24px;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.kpi .v br{display:none}
.kpi .v .badge{font-family:var(--font-sans);letter-spacing:0;font-weight:500}
.kpi .k{margin-top:8px;line-height:1.3}
.kpi .sub{margin-top:3px;line-height:1.3;color:var(--text-tertiary)}

/* pipeline selector */
.pipesel{display:inline-flex;align-items:center;gap:8px;height:28px;padding:0 8px 0 10px;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--bg-surface);font-size:12.5px;font-weight:500;color:var(--text-strong);white-space:nowrap;transition:border-color var(--d-fast),background var(--d-fast)}
.pipesel:hover{border-color:var(--border-strong);background:var(--bg-hover)}
.pipesel>svg{width:14px;height:14px;color:var(--text-tertiary)}
.pipesel .kd{font-size:10px;font-weight:400;color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.04em;padding-inline-start:8px;border-inline-start:1px solid var(--border-subtle)}

/* ===== pipeline ===== */
.pipe{grid-auto-columns:minmax(220px,1fr)}
.pipe .bcol{transition:box-shadow var(--d-fast),background var(--d-fast)}
.pipe .bcol.is-over{box-shadow:inset 0 0 0 2px var(--accent-500);background:var(--accent-50,var(--bg-elevated))}
.pipe .bcol-h{gap:6px}.pipe .bcol-h .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.pipe .bcol-h .pb{font-family:var(--font-mono);font-size:10.5px;color:var(--text-tertiary);font-weight:400}
.pipe .bcol-h .sum{margin-inline-start:auto;font-weight:500;color:var(--text-muted);font-family:var(--font-mono);font-size:11px;white-space:nowrap}
.pipe .bcol-h .info{color:var(--text-tertiary);display:inline-grid;place-items:center;cursor:help}.pipe .bcol-h .info svg{width:13px;height:13px}
.pipe .bcol.is-won .bcol-h .nm{color:var(--color-success-500)}.pipe .bcol.is-lost .bcol-h .nm{color:var(--color-danger-500)}
.pipe .bcol.won-collapsed .bcol-h .tog{transform:rotate(90deg)}
.bcol-empty{font-size:11px;color:var(--text-tertiary);padding:10px 8px;line-height:1.45;text-wrap:pretty}.bcol-empty strong{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px;color:var(--text-tertiary)}
.bcard.opp{position:relative;padding:10px 12px;text-align:start;width:100%;cursor:pointer}
.bcard.opp .bt{font-weight:500;color:var(--text-strong);padding-inline-end:22px;text-wrap:pretty}
.bcard.opp .bs{font-size:11.5px;color:var(--text-muted);margin-top:2px}
.bcard.opp .bm{display:flex;align-items:center;gap:6px;margin-top:8px;flex-wrap:wrap}
.bcard.opp .bm .amt{font-size:11.5px;color:var(--text-strong)}
.bcard.opp .bm .due{display:inline-flex;align-items:center;gap:4px;font-size:11px;color:var(--text-tertiary);font-family:var(--font-mono)}.bcard.opp .bm .due.soon{color:var(--color-warning-500)}.bcard.opp .bm .due svg{width:12px;height:12px}
.bcard.opp .bm .spacer{flex:1}
.bcard.opp .more{position:absolute;top:6px;inset-inline-end:6px;width:24px;height:24px;border-radius:var(--radius-sm);display:grid;place-items:center;color:var(--text-tertiary);opacity:0;transition:opacity var(--d-fast),background var(--d-fast)}
.bcard.opp:hover .more,.bcard.opp:focus-within .more,.bcard.opp:focus .more{opacity:1}.bcard.opp .more:hover{background:var(--bg-active);color:var(--text-strong)}.bcard.opp .more svg{width:14px;height:14px}
.bcard.opp[draggable="true"]{cursor:grab}.bcard.opp.is-dragging{opacity:.45;cursor:grabbing}
.bcard.opp.slipped{border-color:color-mix(in oklab,var(--color-danger-500) 40%,var(--border-subtle))}
.bcard.opp:focus-visible{outline:2px solid var(--accent-500);outline-offset:1px}
.th-sort{display:inline-flex;align-items:center;gap:3px;font:inherit;color:inherit;text-transform:inherit;letter-spacing:inherit;border-radius:4px;padding:0 2px;margin:0 -2px}.th-sort:hover,.th-sort.is-on{color:var(--text-strong)}.th-sort svg{width:11px;height:11px}
.cellclamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:260px;white-space:normal}
.stepper{display:flex;gap:4px;margin-top:4px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
.step{flex:1 1 0;min-width:84px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:8px 10px;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--bg-surface);text-align:start;transition:border-color var(--d-fast),background var(--d-fast)}
.step .n{width:18px;height:18px;border-radius:99px;display:grid;place-items:center;font-size:10.5px;font-family:var(--font-mono);background:var(--bg-elevated);color:var(--text-tertiary)}.step .n svg{width:11px;height:11px}
.step .l{font-size:11px;font-weight:500;color:var(--text-muted);line-height:1.25;text-wrap:pretty}.step .p{font-size:10px;font-family:var(--font-mono);color:var(--text-tertiary)}
.step.is-done{border-color:transparent;background:var(--bg-elevated)}.step.is-done .n{background:var(--color-success-100);color:var(--color-success-500)}
.step.is-cur{border-color:var(--accent-500);box-shadow:inset 0 0 0 1px var(--accent-500)}.step.is-cur .n{background:var(--accent-500);color:#fff}.step.is-cur .l{color:var(--text-strong)}
.step.is-won .n{background:var(--color-success-100);color:var(--color-success-500)}
.step:not(:disabled):hover{border-color:var(--border-strong);background:var(--bg-hover)}.step:disabled{cursor:default}
.exitnote{display:flex;gap:8px;align-items:flex-start;font-size:12px;color:var(--text-muted);line-height:1.45;padding:10px 12px;border:1px dashed var(--border-subtle);border-radius:var(--radius-md)}.exitnote svg{flex-shrink:0;width:14px;height:14px;margin-top:2px;color:var(--text-tertiary)}
.checkrow{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;line-height:1.45;padding:10px 12px;border:1px solid var(--border-subtle);border-radius:var(--radius-md);cursor:pointer}.checkrow input{margin-top:3px;accent-color:var(--accent-500)}
.rdrawer-foot .spacer{flex:1}

.pipe .bcol:not(.won-collapsed) .bcol-h{flex-wrap:wrap;row-gap:4px;padding-bottom:8px}
.pipe .bcol-h .nm{flex:1 1 auto}
.pipe .bcol-h .meta{flex-basis:100%;display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:14px}
.pipe .bcol-h .sum{margin-inline-start:0}
.step{min-width:0;padding:8px 8px}.step .l{font-size:10.5px}
.step .l{overflow-wrap:anywhere;hyphens:auto}.step{min-width:72px}