/* Platform foundation (pl- prefix): the shared list page, status chips, dashboard panels, stat tiles, feeds and the record timeline. */
.pl-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.pl-chips a { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border: 1px solid #c9d7e5; border-radius: 16px; background: #fff; font-size: 12.5px; font-weight: 600; color: #2f5f88; text-decoration: none; }
.pl-chips a b { background: #eaf2f9; color: #0f2341; border-radius: 9px; padding: 0 7px; font-size: 11.5px; }
.pl-chips a.on { background: var(--brand-primary, #0a6fd2); border-color: var(--brand-primary, #0a6fd2); color: #fff; }
.pl-chips a.on b { background: rgba(255,255,255,.22); color: #fff; }
.pl-saved { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.pl-bulk { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 10px 12px; border-bottom: 1px solid #e0e7ed; }
.pl-bulk select { max-width: 280px; }
.pl-tick { width: 28px; }
.pl-tbl td .sub, .pl-tbl td small { display: block; color: var(--muted); font-size: 11.5px; font-weight: 400; }
.pl-tbl td.nowrap, .pl-tbl th.nowrap, .pl-tbl td b.ref { white-space: nowrap; }
.pl-tbl a b, .pl-ref { white-space: nowrap; }
.pl-panel .ct-pbody { min-height: 0; }
.pl-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px; border-top: 1px solid #eef2f6; padding-top: 10px; }
.pl-stat { min-width: 0; }
.pl-stat span { display: block; font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-stat b { display: block; font-size: 16px; color: #0f2341; }
.pl-stat small { display: block; font-size: 11px; color: var(--muted); }
.pl-foot { font-size: 12px; color: var(--muted); border-top: 1px solid #eef2f6; padding-top: 8px; }
.pl-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; }
.pl-tile { display: flex; flex-direction: column; gap: 2px; border: 1px solid #dde5ed; border-radius: 8px; padding: 9px 11px; background: linear-gradient(180deg, #fbfdff, #f4f8fc); min-width: 0; text-decoration: none; color: inherit; }
a.pl-tile:hover { border-color: #9fc0e3; }
.pl-tile .l { font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-tile b { font-size: 18px; color: #0f2341; overflow-wrap: anywhere; }
.pl-tile small { font-size: 11px; color: var(--muted); }
.pl-feed { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.pl-feed li { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 2px; border-bottom: 1px solid #eef2f6; }
.pl-feed li:last-child { border-bottom: 0; }
.pl-feed .ic { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; background: var(--infoBg); color: var(--infoFg); }
.pl-feed li.ok .ic { background: var(--okBg); color: var(--okFg); } .pl-feed li.warn .ic { background: var(--warnBg); color: var(--warnFg); } .pl-feed li.bad .ic { background: var(--badBg); color: var(--badFg); }
.pl-feed .tx { min-width: 0; }
.pl-feed .tx b { display: block; font-size: 13px; color: #0f2341; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-feed .tx span { display: block; font-size: 11.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pl-feed time { font-size: 11px; color: var(--muted); white-space: nowrap; }
.pl-gauges { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 10px; justify-items: center; }
.pl-meters { display: flex; flex-direction: column; gap: 10px; }
.pl-note { margin-top: 4px; font-size: 12.5px; color: #3d5166; }
.pl-tl li small { display: block; }
.pl-actions { display: flex; flex-direction: column; gap: 8px; }
.pl-actions form { margin: 0; }
.pl-actions .ct-btn { width: 100%; justify-content: center; }
.pl-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.pl-kv { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.pl-kv div { border: 1px solid #e3eaf1; border-radius: 8px; padding: 8px 10px; background: #fbfdff; min-width: 0; }
.pl-kv span { display: block; font-size: 11.5px; color: var(--muted); }
.pl-kv b { display: block; font-size: 15px; color: #0f2341; overflow-wrap: anywhere; }
.pl-steps { display: flex; gap: 0; flex-wrap: wrap; counter-reset: st; }
.pl-steps li { list-style: none; flex: 1 1 110px; position: relative; padding: 8px 8px 8px 30px; font-size: 12px; color: var(--muted); border-top: 3px solid #dbe5ef; min-width: 0; }
.pl-steps li:before { counter-increment: st; content: counter(st); position: absolute; left: 4px; top: 7px; width: 20px; height: 20px; border-radius: 50%; background: #dbe5ef; color: #3d5166; font-size: 11px; display: grid; place-items: center; font-weight: 700; }
.pl-steps li.done { border-top-color: var(--okFg); color: #0f2341; } .pl-steps li.done:before { background: var(--okFg); color: #fff; content: "\2713"; }
.pl-steps li.now { border-top-color: var(--brand-primary, #0a6fd2); color: #0f2341; font-weight: 700; } .pl-steps li.now:before { background: var(--brand-primary, #0a6fd2); color: #fff; }
.pl-steps li.bad { border-top-color: var(--badFg); } .pl-steps li.bad:before { background: var(--badFg); color: #fff; }
.pl-tree { list-style: none; margin: 0; padding: 0 0 0 4px; }
.pl-tree ul { list-style: none; margin: 0; padding-left: 20px; border-left: 1px dashed #c7d6e4; }
.pl-tree li { padding: 5px 0 5px 10px; position: relative; }
.pl-tree li:before { content: ""; position: absolute; left: -20px; top: 15px; width: 26px; border-top: 1px dashed #c7d6e4; }
.pl-tree > li:before { display: none; }
.pl-tree .node { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; border: 1px solid #dbe5ef; border-radius: 8px; padding: 5px 10px; background: #fff; font-size: 12.5px; }
.pl-tree .node b { color: #0f2341; }
.pl-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12px; white-space: pre-wrap; word-break: break-all; background: #0f2341; color: #d7e6f7; border-radius: 8px; padding: 12px; max-height: 420px; overflow: auto; position: relative; }
.pl-sandbox { display: inline-flex; gap: 6px; align-items: center; font-size: 12px; color: var(--warnFg); background: var(--warnBg); border-radius: 6px; padding: 4px 8px; }
@media (max-width: 760px) {
    .pl-grid2 { grid-template-columns: minmax(0, 1fr); }
    .pl-feed li { grid-template-columns: 30px minmax(0, 1fr); }
    .pl-feed time { grid-column: 2; }
    .pl-steps li { flex-basis: 45%; }
}
.pl-actionbar { align-items: center; } .pl-actionbar form { margin: 0; }
