/* patron-invest.css — p107 (2026-11-14): fundraising cards (patron-invest.js). The investor list (.pi-list), a message the
   founder sends himself (.pi-reach), the questions about the company (.pi-picks), the search at work (.pi-prog). They sit on
   the card base of the domain finder and the email card (.pd, .pp-head, .pg-*); the light theme is in theme-light.css. */

/* ------------------------------------------------------------------ the investor list
   The chat column is 800 px, so a six-column table doesn't fit: each investor is two or three short lines. */
.pc-msg.bot:has(.pi-list){width:100%;max-width:100%}
.pc-bub:has(.pi-list){width:100%}
.pi-head{gap:10px;padding:10px 10px 10px 14px}
.pi-head>svg{flex:none;color:#8e8e8a}
.pi-ttl{flex:1;min-width:0;display:flex;align-items:baseline;flex-wrap:wrap;column-gap:10px;row-gap:2px}
.pi-ttl b{font-size:14.5px;font-weight:650;color:#f4f4f1}
.pi-ttl span{font-size:12.5px;color:#8e8e8a}
.pi-tools{flex:none;display:flex;gap:6px}
.pi-sm{height:28px;padding:0 12px;font-size:12.5px}
.pi-load{display:flex;align-items:center;gap:9px;padding:16px 14px;font-size:13.5px;color:#8e8e8a}
.pi-load .pd-spin,.pi-prog .pd-spin{opacity:1;animation:pd-spin .7s linear infinite}
.pi-table{max-height:480px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#2c2c30 transparent}
.pi-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto auto;grid-template-areas:"ck who how st" ". why why why";align-items:center;column-gap:10px;row-gap:5px;
  padding:10px 12px 11px 8px;border-top:1px solid rgba(255,255,255,.06);font-size:13.5px;line-height:19px}
.pi-row:first-child{border-top:0}
.pi-row:hover{background:rgba(255,255,255,.03)}
.pi-row.on{background:rgba(34,195,111,.07)}
.pi-row.on:hover{background:rgba(34,195,111,.1)}
.pi-row[data-status="passed"] :is(.pi-who,.pi-why){opacity:.5}
.pi-ckc{grid-area:ck;display:grid;place-items:center;align-self:start;padding-top:2px}
.pi-ck{width:17px;height:17px;margin:0;accent-color:#22c36f;cursor:pointer}
.pi-who{grid-area:who;min-width:0;display:flex;flex-direction:column;gap:1px}
.pi-top{min-width:0;display:flex;align-items:center;gap:8px}
.pc-md a.pi-name,.pi-name{min-width:0;font-weight:650;color:#f4f4f1;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pc-md a.pi-name:hover{text-decoration:underline;text-underline-offset:2px}
.pi-sub{min-width:0;font-size:12.5px;line-height:17px;color:#8e8e8a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pi-rec{flex:none;padding:1px 7px;border-radius:999px;background:rgba(34,195,111,.14);color:#5fd39a;font-size:11px;line-height:16px;font-weight:650;white-space:nowrap}
.pi-why{grid-area:why;min-width:0;display:flex;align-items:baseline;gap:9px;color:#bdbdb9;font-size:13px;line-height:18px}
.pi-why>span:last-child{min-width:0}
.pi-fit{flex:none;display:inline-flex;gap:2px;transform:translateY(1px)}
.pi-fit i{width:4px;height:11px;border-radius:2px;background:rgba(255,255,255,.13)}
.pi-fit i.on{background:#5fd39a}
.pi-how{grid-area:how;align-self:start}
.pi-chip{display:inline-block;padding:3px 9px;border-radius:999px;background:#232326;color:#cfcfcc;font-size:12px;line-height:16px;font-weight:600;white-space:nowrap}
.pi-chip.form{background:rgba(108,156,255,.16);color:#a6c2ff}
.pi-chip.email{background:rgba(34,195,111,.14);color:#5fd39a}
.pi-chip.intro{background:rgba(232,196,106,.13);color:#e8c46a}
.pi-stc{grid-area:st;align-self:start}
.pi-st{width:124px;height:28px;padding:0 6px;border:0;border-radius:9px;background:#1a1a1d;box-shadow:inset 0 0 0 1px #2a2a2d;color:#e9e9e6;font:inherit;font-size:12.5px;cursor:pointer}
.pi-st[data-status="drafted"]{color:#e8c46a}
.pi-st[data-status="sent"]{color:#a6c2ff}
.pi-st[data-status="replied"]{color:#5fd39a}
.pi-st[data-status="passed"]{color:#8e8e8a}
.pi-st:disabled{opacity:.6;cursor:default}
.pi-foot{display:flex;align-items:center;gap:12px;padding:10px 14px 12px;border-top:1px solid rgba(255,255,255,.07)}
.pi-count{flex:none;font-size:13px;font-weight:600;color:#cfcfcc}
.pi-note{flex:1;min-width:0;font-size:12.5px;line-height:17px;color:#8e8e8a}
.pi-go{flex:none;margin-left:auto}
:is(.pi-ck,.pi-st,.pi-name,.pi-opt,.pi-open):focus-visible{outline:2px solid #6c9cff;outline-offset:2px}
@media (max-width:640px){
  .pi-row{grid-template-columns:26px auto minmax(0,1fr);grid-template-areas:"ck who who" ". why why" ". how st";column-gap:8px;row-gap:7px;padding:11px 10px 12px 6px}
  .pi-how,.pi-stc{align-self:center}
  .pi-stc{justify-self:start}
  .pi-st{width:auto}
  .pi-head>svg{display:none}
  .pi-table{max-height:560px}
  .pi-foot{flex-wrap:wrap;row-gap:6px}
  .pi-note{order:3;flex-basis:100%}
  .pi-ttl span{flex-basis:100%}
}

/* ------------------------------------------------------------------ a message he sends himself; an investor's email */
.pi-for{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;color:#8e8e8a}
.pi-chan{padding:10px 14px 0;font-size:13px;line-height:19px;color:#bdbdb9}
.pi-chan:empty{display:none}
.pc-md a.pi-open,.pi-open{display:inline-flex;align-items:center;color:#e6e6e3;text-decoration:none;line-height:32px}
.pi-open[hidden]{display:none}
.pi-reach.pi-done .pg-sec:disabled{background:transparent;color:#5fd39a;cursor:default}
.pg-mail .pg-app[hidden],.pg-mail .pd-get[hidden],.pg-mail .pg-sec[hidden]{display:none}

/* ------------------------------------------------------------------ the questions about the company */
.pi-picks .pp-head svg{flex:none;color:#8e8e8a}
.pi-qs{display:flex;flex-direction:column;gap:13px;padding:12px 14px 2px}
.pi-ql{margin:0 0 7px;font-size:12.5px;line-height:16px;font-weight:600;color:#9a9a96}
.pi-opts{display:flex;flex-wrap:wrap;gap:6px}
.pi-opt{height:32px;padding:0 13px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.04);color:#e9e9e6;font:inherit;font-size:13px;cursor:pointer}
.pi-opt:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.2)}
.pi-opt.on{background:#f4f4f1;border-color:#f4f4f1;color:#0b0b0b;font-weight:600}
.pi-opt.pi-other{border-style:dashed;color:#9a9a96}
.pi-opt[hidden],.pi-in[hidden]{display:none}
.pi-in{flex:1 1 170px;min-width:140px;height:32px}
.pi-picks .pg-acts{padding-bottom:12px}
.pi-said{padding:12px 14px;font-size:13.5px;line-height:20px;color:#bdbdb9}

/* ------------------------------------------------------------------ the search at work */
.pi-prog{padding:13px 14px 12px}
.pi-progt{display:flex;align-items:center;gap:9px;font-size:14px;line-height:20px;color:#f4f4f1}
.pi-progt b{font-weight:600}
.pi-bar{height:4px;margin:10px 0 8px;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden}
.pi-bar i{display:block;height:100%;border-radius:4px;background:#22c36f;transition:width .4s ease}
.pi-progs{font-size:12.5px;line-height:17px;color:#8e8e8a}
@media (prefers-reduced-motion:reduce){ .pi-load .pd-spin,.pi-prog .pd-spin{animation:none} .pi-bar i{transition:none} }
