/* Pipeline page v3 (pipeline.js): List, Board and Workspace views around one ticket panel.
   Reads the shared tokens in styles.css, so the black theme works without extra rules. */
.pl{--pl-pri:#567f1f;--pl-pri-ink:#fff;--pl-glow:0 5px 14px -6px rgba(64,96,20,.7);padding-bottom:50px}
:root[data-theme="dark"] .pl{--pl-pri:#8cc43a;--pl-pri-ink:#10200a;--pl-glow:none}
.pl{text-align:left}
.pl button,.pl select,.pl input{font-family:inherit}
.pl b.bad,.pl span.bad,.pl strong.bad{color:var(--red)}.pl b.warn,.pl span.warn,.pl strong.warn{color:var(--amber-strong)}
.pl b.ok,.pl b.go,.pl span.ok,.pl span.go,.pl strong.ok{color:var(--green)}.pl b.quiet,.pl span.quiet,.pl strong.quiet{color:var(--ink-soft)}

/* header */
.pl-head{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:14px}
.pl-title{flex:1;min-width:220px}
.pl-title h1{margin:0;font-size:24px;font-family:var(--head);font-weight:700;letter-spacing:-.01em}
.pl-title p{margin:3px 0 0;font-size:13px;color:var(--ink-soft)}
.pl-views{text-align:right}.pl-views small{display:block;margin-top:4px;font-size:11px;color:var(--ink-soft)}
.pl-search{flex:0 1 300px;min-width:200px;height:42px;padding:0 14px;border:1px solid var(--border);border-radius:10px;background:var(--surface);font-size:13px;color:var(--ink)}
.pl-search:focus,.pl-dlg input:focus,.pl-dlg select:focus,.pl-dlg textarea:focus,.pl-sort select:focus{outline:2px solid var(--green-line);border-color:var(--green)}
.pl-sg{display:inline-flex;gap:2px;background:var(--surface-sunken);border:1px solid var(--border);border-radius:12px;padding:4px;flex-wrap:wrap}
.pl-sg button{border:0;background:transparent;color:var(--ink);padding:6px 13px;border-radius:9px;cursor:pointer;font-size:12.5px;font-weight:600}
.pl-sg button i{font-style:normal;font-weight:500;opacity:.75;margin-left:2px}
.pl-sg button.on{background:var(--pl-pri);color:var(--pl-pri-ink)}
.pl-sg button:focus-visible,.pl-b:focus-visible,.pl-tile:focus-visible,.pl-cell:focus-visible{outline:2px solid var(--green);outline-offset:2px}
.pl-views .pl-sg button{padding:7px 16px}

/* stat tiles + crew room */
.pl-strip{display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.pl-tile{flex:1 1 150px;text-align:left;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--gray-line);border-radius:var(--radius);padding:13px 16px;box-shadow:var(--shadow);font:inherit;color:var(--ink);display:flex;flex-direction:column;gap:3px}
button.pl-tile{cursor:pointer}button.pl-tile:hover{border-color:var(--green-line)}
.pl-tile b{font-size:26px;line-height:1.1;font-family:var(--head)}.pl-tile span{font-size:12.5px;color:var(--ink-soft);font-weight:500}
.pl-tile.bad{border-left-color:var(--amber)}.pl-tile.bad b{color:var(--red)}.pl-tile.go{border-left-color:var(--accent)}
.pl-tile.on{outline:2px solid var(--pl-pri);outline-offset:-1px}
.pl-cap{flex:2 1 340px;max-width:420px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px 16px;box-shadow:var(--shadow)}
.pl-cap-h{display:flex;justify-content:space-between;gap:8px;font-size:12px;margin-bottom:8px;flex-wrap:wrap}.pl-cap-h span{color:var(--ink-soft)}
.pl-cap-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 16px}
.pl-cap-g>div>div{display:flex;justify-content:space-between;font-size:11.5px;font-weight:600}
.pl-bar-t{display:block;height:6px;border-radius:99px;background:var(--surface-sunken);overflow:hidden;margin-top:4px}
.pl-bar-t i{display:block;height:100%;border-radius:99px}
.pl-bar-t i.ok,.pl-bar-t i.go{background:var(--accent)}.pl-bar-t i.warn{background:var(--amber)}.pl-bar-t i.bad{background:var(--red)}.pl-bar-t i.quiet{background:var(--gray)}

/* layout: a main area and the ticket panel */
.pl-body{display:flex;gap:18px;align-items:flex-start}
.pl-main{flex:1;min-width:0}
.pl-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden}
.pl-tools{display:flex;align-items:center;gap:12px;margin-bottom:10px;flex-wrap:wrap}.pl-sp{flex:1}
.pl-sort{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--ink-soft)}
.pl-sort select{border:1px solid var(--border);background:var(--surface);color:var(--ink);border-radius:9px;padding:6px 10px;font-size:12.5px;font-weight:600}
.pl-empty,.pl-dim{padding:26px 18px;text-align:center;color:var(--ink-soft);background:var(--surface);border:1px dashed var(--border);border-radius:var(--radius)}
.pl-dim{padding:14px;font-size:12.5px}
.pl-card .pl-dim,.pl-lane .pl-dim{border:0;background:transparent}
.pl-ft{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--ink-soft);margin-top:10px;padding:0 4px}
kbd{font:inherit;font-size:11px;border:1px solid var(--border-strong);border-radius:5px;padding:0 5px}
.pl-keys{font-size:12px;color:var(--ink-soft)}

/* buttons, pills, checkboxes */
.pl-b{border:1px solid var(--border-strong);background:var(--surface);color:var(--ink);padding:7px 12px;border-radius:9px;cursor:pointer;font-size:12.5px;font-weight:600;white-space:nowrap}
.pl-b:hover:not(:disabled){background:var(--green-tint);border-color:var(--green-line)}
.pl-b.pri{background:var(--pl-pri);border-color:var(--pl-pri);color:var(--pl-pri-ink);border-radius:10px;box-shadow:var(--pl-glow)}
.pl-b.pri:hover:not(:disabled){background:var(--pl-pri);filter:brightness(1.08)}
.pl-b:disabled{opacity:.5;cursor:default}
.pl-more{width:32px;padding:0;height:32px;letter-spacing:1px;color:var(--ink-soft)}
.pl-pill{font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:7px;white-space:nowrap;border:1px solid transparent}
.pl-pill.ok{background:var(--green-tint);color:var(--green);border-color:var(--green-line)}
.pl-pill.warn{background:var(--amber-tint);color:var(--amber-strong);border-color:var(--amber-line)}
.pl-pill.bad{background:var(--red-tint);color:var(--red);border-color:var(--red-line)}
.pl-pill.quiet{background:var(--gray-tint);color:var(--ink-soft);border-color:var(--gray-line)}
.pl-ck{width:16px;height:16px;accent-color:var(--pl-pri);cursor:pointer;margin:0}.pl-ck-gap{display:block;width:16px}
.pl-dt{display:inline-block;width:9px;height:9px;border-radius:99px;flex:none;background:var(--gray)}
.pl-dt.bad{background:var(--red)}.pl-dt.warn{background:var(--amber)}.pl-dt.ok,.pl-dt.go{background:var(--accent)}

/* list view */
.pl-rw{display:grid;grid-template-columns:24px minmax(0,1fr) 92px 118px 138px 118px;gap:12px;align-items:center;padding:0 16px;min-height:58px;border-bottom:1px solid var(--border);cursor:pointer}
.pl-rw:last-child{border-bottom:0}
.pl-rw:hover{background:var(--surface-sunken)}
.pl-rw.late{box-shadow:inset 3px 0 var(--red)}.pl-rw.snz{opacity:.7}
.pl-rw.on{background:var(--green-tint);box-shadow:inset 3px 0 var(--pl-pri)}
.pl-th{min-height:0;padding:10px 16px;background:var(--surface-sunken);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);cursor:default}
.pl-th:hover{background:var(--surface-sunken)}
.pl-who{min-width:0;display:flex;flex-direction:column}
.pl-who b{font-family:var(--head);font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-who span{font-size:12px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.pl-c-work,.pl-c-next{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:12px;color:var(--ink-soft)}
.pl-c-work b{color:var(--ink);font-size:13px}
.pl-c-next b{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-c-next span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pl-c-due b{font-size:12.5px;display:block}.pl-c-due .pl-bar-t{width:96px;height:5px;margin-top:6px}
.pl-c-act{display:flex;gap:6px;justify-content:flex-end;align-items:center}
.pl-c-act .pl-b.pri{padding:8px 12px}

/* board view */
.pl-lanes{display:flex;gap:10px;align-items:flex-start;overflow-x:auto;padding-bottom:6px}
.pl-lane{flex:1 1 0;min-width:250px;background:var(--surface-sunken);border-radius:var(--radius-lg);padding:11px;display:flex;flex-direction:column;gap:9px}
.pl-lane header{display:flex;align-items:center;gap:8px;padding:2px 3px;font-family:var(--head)}
.pl-lane header b{font-size:13.5px}.pl-lane header em{font-style:normal;background:var(--surface);border-radius:99px;padding:1px 8px;font-weight:700;font-size:11.5px}
.pl-lane header span{flex:1;text-align:right;color:var(--ink-soft);font-size:11.5px}
.pl-lane-h{margin:-4px 3px 0;font-size:11.5px;color:var(--ink-soft)}
.pl-lane-all{align-self:flex-start;margin-left:3px}
.pl-bc{background:var(--surface);border:1px solid var(--border);border-top:3px solid var(--accent);border-radius:13px;padding:12px 13px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px;cursor:pointer}
.pl-bc.warn{border-top-color:var(--amber)}.pl-bc.bad{border-top-color:var(--red)}.pl-bc.quiet{border-top-color:var(--gray)}
.pl-bc.on{border-color:var(--pl-pri);box-shadow:0 0 0 2px var(--green-line)}
.pl-bc-top{display:flex;gap:8px;align-items:flex-start}.pl-bc-top .pl-who{flex:1}.pl-bc-top .pl-ck,.pl-bc-top .pl-ck-gap{margin-top:3px}
.pl-bc-top .pl-ck-gap{display:none}
.pl-bc-meta{font-size:12px;color:var(--ink-soft)}.pl-bc-meta b{color:var(--ink)}
.pl-bc-act{display:flex;gap:8px;align-items:center;justify-content:space-between}

/* workspace queue */
.pl-queue{width:360px;flex:none;position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto}
.pl-queue-h{display:flex;flex-direction:column;gap:10px;padding:12px 14px;border-bottom:1px solid var(--border)}
.pl-queue-h .pl-sg button{padding:5px 9px;font-size:11.5px}
.pl-qi{display:flex;gap:11px;align-items:center;padding:0 16px;height:56px;border-bottom:1px solid var(--border);cursor:pointer}
.pl-qi:hover{background:var(--surface-sunken)}.pl-qi.on{background:var(--green-tint);box-shadow:inset 3px 0 var(--pl-pri)}
.pl-qi .pl-who{flex:1}.pl-qi strong{font-size:11.5px;white-space:nowrap}
.pl-queue-k{padding:10px 16px}

/* ticket panel */
.pl-tp{width:440px;flex:none;position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto;display:flex;flex-direction:column}
.pl-v-focus .pl-tp{flex:1;width:auto;min-width:0}
.pl-ph{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;padding:16px 20px 6px}
.pl-ph em{font-style:normal;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--green)}
.pl-ph h2{margin:4px 0 0;font-size:18px;font-family:var(--head)}
.pl-ph p{margin:2px 0 0;font-size:13px;color:var(--ink-soft)}.pl-ph .pl-facts{font-size:12px}
.pl-pl{display:flex;flex-direction:column;gap:2px;padding:6px 20px 12px;font-size:12px;color:var(--ink-soft);border-bottom:1px solid var(--border)}
.pl-pl span{font-weight:600}
.pl-steps{display:flex;align-items:center;padding:14px 20px 2px}
.pl-step{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:600;white-space:nowrap;color:var(--ink-soft)}
.pl-step i{width:22px;height:22px;border-radius:99px;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:11px;font-weight:700;border:2px solid var(--border-strong);background:var(--surface)}
.pl-step.done{color:var(--ink)}.pl-step.done i{background:var(--pl-pri);border-color:var(--pl-pri);color:var(--pl-pri-ink)}
.pl-step.now{color:var(--ink)}.pl-step.now i{border-color:var(--pl-pri);color:var(--green)}
.pl-steps s{flex:1;height:2px;margin:0 8px;background:var(--border-strong);text-decoration:none}.pl-steps s.done{background:var(--pl-pri)}
.pl-ps{padding:12px 20px 0}
.pl-ps-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;font-size:12px;color:var(--ink-soft)}.pl-ps-h b{font-size:13.5px;color:var(--ink)}
.pl-grid{display:grid;grid-template-columns:minmax(70px,96px) repeat(5,minmax(0,1fr));gap:6px;align-items:stretch}
.pl-gnav{display:flex;gap:4px;align-items:center}.pl-gnav .pl-b{padding:2px 9px;font-size:16px;line-height:1.2}
.pl-gh{text-align:center;font-size:11.5px}.pl-gh span{color:var(--ink-soft)}
.pl-gp{display:flex;align-items:center;font-size:12px;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-cell{height:44px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;border:1px solid var(--border);padding:0}
.pl-v-focus .pl-cell{height:58px}
.pl-cell.go{background:var(--green-tint);color:var(--green);border-color:var(--green-line);cursor:pointer}
.pl-cell.go:hover{border-color:var(--green)}
.pl-cell.go.sel{background:var(--pl-pri);color:var(--pl-pri-ink);border-color:var(--pl-pri);box-shadow:var(--pl-glow)}
.pl-cell.no{background:var(--surface-sunken);color:var(--ink-soft);font-weight:500;font-size:11.5px}
.pl-legend{margin:10px 0 0;font-size:11.5px;color:var(--ink-soft)}
.pl-sw{display:inline-block;width:10px;height:10px;border-radius:3px;margin:0 6px 0 0;vertical-align:-1px;border:1px solid var(--border-strong)}
.pl-sw.go{background:var(--green-tint);border-color:var(--green-line)}.pl-sw.no{background:var(--surface-sunken);margin-left:14px}
.pl-confirm{display:flex;align-items:center;gap:10px;margin:14px 20px 0;padding:11px 14px;border:1px dashed var(--border-strong);border-radius:12px;font-size:12.5px;color:var(--ink-soft)}
.pl-confirm.on{background:var(--green-tint);border:1px solid var(--green-line);color:var(--ink)}
.pl-confirm div{flex:1}.pl-confirm div span{display:block;font-size:12px;color:var(--ink-soft);margin-top:2px}
.pl-hist{list-style:none;margin:14px 20px 0;padding:0 0 0 14px;border-left:2px solid var(--border);display:flex;flex-direction:column;gap:8px;font-size:12.5px}
.pl-hist span{display:block;font-size:12px;color:var(--ink-soft)}
.pl-pa{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:14px 20px 16px;margin-top:14px;background:var(--surface-sunken);border-top:1px solid var(--border)}
.pl-pa .pl-b{padding:8px 4px;overflow:hidden;text-overflow:ellipsis}

/* several at once */
.pl-batch{position:sticky;bottom:16px;z-index:5;display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:16px 0 0;width:max-content;max-width:100%;padding:9px 10px 9px 18px;border-radius:14px;background:var(--ink);color:var(--bg);box-shadow:var(--shadow-pop)}
.pl-batch span{font-size:12px;opacity:.8}
.pl-batch .pl-b:not(.pri){background:transparent;color:inherit;border-color:rgba(128,128,128,.5)}

/* dialogs */
.pl-ov{position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:90}
.pl-dlg{position:fixed;z-index:91;top:50%;left:50%;transform:translate(-50%,-50%);width:min(420px,calc(100vw - 24px));background:var(--surface);border:1px solid var(--border-strong);border-radius:var(--radius);box-shadow:var(--shadow-pop);padding:18px 20px;display:flex;flex-direction:column;gap:10px}
.pl-dlg h3{margin:0;font-family:var(--head)}.pl-dlg p{margin:0;font-size:12.5px;color:var(--ink-soft)}
.pl-dlg label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--ink-soft)}
.pl-dlg input,.pl-dlg select,.pl-dlg textarea{padding:8px 10px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);font:inherit;font-size:13px;color:var(--ink)}
.pl-quick{display:flex;gap:6px;flex-wrap:wrap}.pl-quick button{border:1px solid var(--border);background:var(--surface-sunken);color:var(--ink);border-radius:999px;padding:4px 11px;cursor:pointer;font:inherit;font-size:12px}
.pl-dact{display:flex;justify-content:flex-end;gap:8px}

/* narrower screens: fewer columns first, then everything stacks and the panel goes under the list */
@media (max-width:1320px){
  .pl-rw{grid-template-columns:24px minmax(0,1fr) 112px 130px 118px}
  .pl-c-work{display:none}
}
@media (max-width:1100px){
  .pl-body{flex-direction:column}.pl-main,.pl-queue,.pl-tp,.pl-v-focus .pl-tp{width:100%;position:static;max-height:none}
  .pl-search{flex:1 1 100%}.pl-views{text-align:left}
}
@media (max-width:760px){
  .pl-th{display:none}
  .pl-rw{grid-template-columns:24px minmax(0,1fr) auto;padding:10px 14px}
  .pl-c-due,.pl-c-next{grid-column:2/4}
  .pl-c-act{grid-column:1/4;justify-content:flex-start}
  .pl-lane{min-width:84%}
  .pl-pa{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pl-cap{max-width:none}
}
.pl-phr{display:flex;align-items:flex-start;gap:8px;flex:none}
.pl-close{font-size:20px;line-height:1;padding:2px 10px}
.pl-dlg .pl-dx{position:absolute;top:8px;right:8px;border:0;background:transparent;box-shadow:none}.pl-dlg h3{padding-right:28px}