/* Cockpit — decision layer. Light palette, no external assets. */
.cockpit { --crit:#b43232; --crit-bg:#fdf1f1; --warnc:#946100; --warn-bg:#fdf7ea; --okc:#24704f; --ok-bg:#eef7f2; --ink:#1b2832; --soft:#5d6d77; }
.cp-attention { border:1px solid var(--line); border-radius:14px; padding:18px 22px; margin-bottom:20px; background:var(--ok-bg); }
.cp-attention.warning { background:var(--warn-bg); border-color:#ecd7a8; }
.cp-attention.critical { background:var(--crit-bg); border-color:#efc4c4; }
.cp-attention-head { display:flex; align-items:center; gap:10px; }
.cp-attention-head h3 { margin:0; font-size:17px; font-weight:600; color:var(--ink); }
.cp-attention-head small { color:var(--soft); font-size:12px; }
.cp-dot { width:10px; height:10px; border-radius:50%; background:var(--okc); flex:none; }
.cp-attention.warning .cp-dot { background:#d39a1c; }
.cp-attention.critical .cp-dot { background:var(--crit); box-shadow:0 0 0 4px #f6d6d6; }
.cp-attention ul { list-style:none; margin:14px 0 0; padding:0; display:grid; gap:8px; }
.cp-signal { display:grid; grid-template-columns:78px 1fr auto; gap:12px; align-items:start; padding:10px 12px; background:#fff; border:1px solid var(--line); border-radius:10px; }
.cp-signal b { font-size:14px; font-weight:600; color:var(--ink); }
.cp-signal p { margin:3px 0 0; font-size:12.5px; color:var(--soft); line-height:1.5; }
.cp-sev { font:600 10px/1 ui-monospace,monospace; letter-spacing:1px; text-transform:uppercase; padding:5px 6px; border-radius:5px; text-align:center; }
.cp-signal.critical .cp-sev { background:var(--crit-bg); color:var(--crit); border:1px solid #efc4c4; }
.cp-signal.warning .cp-sev { background:var(--warn-bg); color:var(--warnc); border:1px solid #ecd7a8; }
.cp-signal.info .cp-sev { background:#f1f4f6; color:var(--soft); border:1px solid var(--line); }
.cp-signal button { font-size:12px; padding:6px 10px; border-radius:7px; background:#fff; border:1px solid var(--line); color:#27664d; cursor:pointer; white-space:nowrap; }
.cp-kpis { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.cp-kpi { position:relative; display:flex; flex-direction:column; gap:3px; padding:16px 18px 14px; background:var(--panel); border:1px solid var(--line); border-radius:12px; min-width:0; }
.cp-kpi span { font-size:12.5px; color:var(--soft); }
.cp-kpi strong { font-size:27px; font-weight:550; letter-spacing:-.6px; color:var(--ink); font-variant-numeric:tabular-nums; }
.cp-kpi small { font-size:12px; color:var(--soft); min-height:16px; }
.cp-kpi.bad strong { color:var(--crit); }
.cp-kpi .cp-spark { position:absolute; right:14px; top:14px; }
.cp-spark path { fill:none; stroke:#5f8f7a; stroke-width:1.6; }
.cp-spark circle { fill:#205b43; }
.cp-note { font-size:11.5px; color:#8a979f; margin:10px 2px 20px; }
.cp-grid2 { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:20px; }
.cp-funnel { display:grid; gap:11px; }
.cp-step { display:grid; grid-template-columns:150px 1fr 70px 120px; align-items:center; gap:10px; font-size:13px; }
.cp-step .cp-step-bar { grid-column:2; grid-row:1; height:18px; background:#eef1f3; border-radius:5px; overflow:hidden; }
.cp-step .cp-step-bar i { display:block; height:100%; background:#8fc1aa; border-radius:5px; }
.cp-step span { grid-column:1; grid-row:1; color:var(--ink); }
.cp-step strong { grid-column:3; grid-row:1; text-align:right; font-variant-numeric:tabular-nums; font-weight:600; }
.cp-step small { grid-column:4; grid-row:1; color:var(--soft); font-size:11.5px; }
.cp-chart svg { width:100%; height:auto; display:block; }
.cp-chart text { font-size:10px; fill:#7b8a93; }
.cp-chart rect.b1 { fill:#8fc1aa; } .cp-chart rect.b2 { fill:#9aa9d6; } .cp-chart rect.b3 { fill:#e3b56b; }
.cp-legend { display:flex; flex-wrap:wrap; gap:14px; font-size:12px; color:var(--soft); margin-top:6px; }
.cp-legend i { display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:6px; vertical-align:-1px; }
.cp-legend i.b1 { background:#8fc1aa; } .cp-legend i.b2 { background:#9aa9d6; } .cp-legend i.b3 { background:#e3b56b; }
.cp-grid line { stroke:#e6eaed; } .cp-line { fill:none; stroke-width:2; }
.cp-line.c0, .cp-line-key.c0 { stroke:#1b2832; background:#1b2832; } .cp-line.c1, .cp-line-key.c1 { stroke:#5f8f7a; background:#5f8f7a; }
.cp-line.c2, .cp-line-key.c2 { stroke:#6b7fc4; background:#6b7fc4; } .cp-line.c3, .cp-line-key.c3 { stroke:#d39a1c; background:#d39a1c; }
.cp-line.c4, .cp-line-key.c4 { stroke:#b45b8a; background:#b45b8a; }
.cp-table th, .cp-table td { padding:9px 10px; border-bottom:1px solid #edf0f2; white-space:nowrap; font-size:13px; }
.cp-table thead th { font-size:11.5px; color:var(--soft); font-weight:600; text-transform:uppercase; letter-spacing:.5px; }
.cp-table td { font-variant-numeric:tabular-nums; }
.cp-dl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 20px; margin:0; }
.cp-dl dt { font-size:12px; color:var(--soft); } .cp-dl dd { margin:3px 0 0; font-size:17px; font-weight:550; color:var(--ink); font-variant-numeric:tabular-nums; }
.cp-dl dd small { font-size:11.5px; color:var(--soft); font-weight:400; }
.cp-sub { font-size:13px; font-weight:600; margin:20px 0 6px; }
.cp-pipe { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px 20px; }
.cp-pipe li { display:grid; grid-template-columns:12px 1fr; gap:2px 8px; align-items:center; font-size:13px; }
.cp-pipe li small { grid-column:2; color:var(--soft); font-size:11.5px; }
.cp-pip { width:9px; height:9px; border-radius:50%; background:var(--okc); }
.cp-pip.mid { background:#c9d1d6; } .cp-pip.bad { background:var(--crit); }
.cp-empty { color:var(--soft); font-size:13px; line-height:1.6; }
.analytics-tabs .tab-group-label { align-self:center; font-size:10.5px; letter-spacing:1.2px; text-transform:uppercase; color:#8a979f; padding:0 6px 0 16px; }
@media (max-width:1250px) { .cp-kpis { grid-template-columns:repeat(2,minmax(0,1fr)); } .cp-grid2 { grid-template-columns:1fr; } .cp-pipe { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:760px) { .cp-kpis { grid-template-columns:1fr 1fr; } .cp-kpi strong { font-size:22px; } .cp-kpi .cp-spark { display:none; } .cp-step { grid-template-columns:110px 1fr 50px; } .cp-step small { display:none; } .cp-pipe { grid-template-columns:1fr; } .cp-signal { grid-template-columns:1fr; } }
.cp-muted td { color:var(--soft); font-style:italic; }

/* v2: reliability strip + experience speed */
.cp-rels { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; margin-top:12px; }
.cp-rel { padding:11px 13px; background:var(--panel); border:1px solid var(--line); border-radius:10px; min-width:0; }
.cp-rel span { display:block; font-size:11.5px; color:var(--soft); }
.cp-rel strong { display:block; font-size:19px; font-weight:550; color:var(--ink); font-variant-numeric:tabular-nums; margin-top:2px; }
.cp-rel small { display:block; font-size:11px; color:var(--soft); line-height:1.35; }
.cp-rel.bad { border-color:#efc4c4; background:var(--crit-bg); } .cp-rel.bad strong { color:var(--crit); }
.cp-speed-table tbody th { white-space:normal; min-width:260px; max-width:520px; }
.cp-speed-table th small { display:block; font-weight:400; font-size:11px; color:var(--soft); text-transform:none; letter-spacing:0; margin-top:2px; line-height:1.4; }
.cp-speed-table td.cp-lever { white-space:normal; min-width:220px; font-size:12px; color:var(--soft); }
.cp-pill { display:inline-block; font-size:11px; font-weight:600; padding:3px 8px; border-radius:999px; border:1px solid var(--line); }
.cp-pill.good { color:var(--okc); background:var(--ok-bg); border-color:#bfdccd; }
.cp-pill.slow { color:var(--warnc); background:var(--warn-bg); border-color:#ecd7a8; }
.cp-pill.bad { color:var(--crit); background:var(--crit-bg); border-color:#efc4c4; }
.cp-pill.unknown { color:var(--soft); background:#f1f4f6; }
.cockpit > .insight:first-of-type { margin-top:18px; }
@media (max-width:1250px) { .cp-rels { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:760px) { .cp-rels { grid-template-columns:1fr 1fr; } }