/* components.css — cards, KPI tiles, badges, tables, team rows, and other reusable UI components, extracted verbatim from Aileron_SP_Hub_Interactive.html */
.ns::placeholder{color:var(--stn);}
.kpi{background:var(--cld);border-radius:8px;padding:16px 18px;border:1px solid var(--stn);position:relative;overflow:hidden;cursor:pointer;transition:.15s;}
.kpi:hover{box-shadow:0 2px 12px rgba(0,0,0,.1);}
.kpi::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;}
.k1::before{background:var(--wat);}.k2::before{background:var(--pne);}.k3::before{background:var(--cly);}.k4::before{background:var(--rin);}
.klbl{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--bld);margin-bottom:7px;}
.kval{font-size:26px;font-weight:700;color:var(--soil);line-height:1;}
.ksub{font-size:10px;color:var(--bld);margin-top:5px;}
.kdlt{display:inline-flex;align-items:center;font-size:10px;font-weight:600;padding:2px 6px;border-radius:10px;margin-top:5px;}
.kdlt.up{background:#EAF3DE;color:var(--pne);}.kdlt.neu{background:#E6F1FB;color:var(--wat);}
.cd{background:var(--cld);border-radius:8px;border:1px solid var(--stn);}
.cdh{padding:12px 16px 9px;border-bottom:1px solid var(--pbl);display:flex;align-items:center;justify-content:space-between;}
.cdt{font-size:12px;font-weight:700;}.cdb{padding:12px 16px;}
.qgrd{display:grid;grid-template-columns:1fr 1fr;gap:9px;}
.qb{background:var(--pbl);border:1px solid var(--stn);border-radius:6px;padding:11px 12px;cursor:pointer;transition:.15s;display:flex;align-items:flex-start;gap:9px;}
.qb:hover{background:var(--sky);border-color:var(--rin);transform:translateY(-1px);}
.qb:active{transform:scale(.98);}
.qi{font-size:17px;flex-shrink:0;margin-top:1px;}.ql{font-size:11px;font-weight:600;color:var(--soil);line-height:1.3;}.qd{font-size:10px;color:var(--bld);margin-top:3px;line-height:1.4;}
.alst{display:flex;flex-direction:column;gap:7px;}
.al{display:flex;align-items:flex-start;gap:9px;padding:9px 11px;border-radius:6px;border-left:3px solid;cursor:pointer;transition:.15s;}
.al:hover{opacity:.85;transform:translateX(2px);}
.al.red{background:#FDF0F0;border-color:var(--hi);}.al.amb{background:#FEF7EC;border-color:var(--cly);}.al.blu{background:#EBF4F8;border-color:var(--wat);}
.ali{font-size:13px;flex-shrink:0;margin-top:1px;}.alt{flex:1;}
.altt{font-size:11px;font-weight:600;color:var(--soil);}.als{font-size:10px;color:var(--bld);margin-top:2px;}.alm{font-size:10px;color:var(--stn);margin-top:3px;}
.alact{font-size:10px;color:var(--wat);font-weight:600;cursor:pointer;}
.bdg{display:inline-block;font-size:8px;font-weight:700;padding:1px 5px;border-radius:3px;text-transform:uppercase;letter-spacing:.05em;}
.bhi{background:#FCEBEB;color:var(--hi);}.bmd{background:#FEF0E4;color:var(--cly);}.blo{background:#EAF3DE;color:var(--pne);}
.rhd{display:grid;grid-template-columns:1fr 75px 75px 95px 85px;gap:8px;padding:7px 12px;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--bld);border-bottom:1px solid var(--pbl);}
.rr{display:grid;grid-template-columns:1fr 75px 75px 95px 85px;gap:8px;padding:9px 12px;border-bottom:1px solid var(--pbl);align-items:center;cursor:pointer;transition:.15s;}
.rr:hover{background:var(--pbl);}.rr:last-child{border-bottom:none;}.rr.sel{background:#EBF4F8;}
.pn{font-size:12px;font-weight:600;color:var(--soil);}.pc{font-size:10px;color:var(--bld);margin-top:1px;}
.td{width:7px;height:7px;border-radius:50%;display:inline-block;margin-right:4px;}
.thi .td{background:var(--hi);}.tmd .td{background:var(--cly);}.tlo .td{background:var(--pne);}
.tl{font-size:11px;font-weight:500;}
.sp{display:inline-block;padding:2px 7px;border-radius:10px;font-size:9px;font-weight:600;}
.sa{background:#EAF3DE;color:var(--pne);}.sd{background:#EBF4F8;color:var(--wat);}.se{background:var(--pbl);color:var(--bld);}.spi{background:#FEF0E4;color:var(--cly);}
.lt{font-size:10px;color:var(--bld);}.lov{color:var(--hi);font-weight:600;}
.sl{font-size:10px;color:var(--wat);font-weight:600;cursor:pointer;}
.pbar{display:flex;height:26px;border-radius:4px;overflow:hidden;margin-bottom:8px;}
.pseg{display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:white;cursor:pointer;transition:.15s;}
.pseg:hover{opacity:.8;}
.pleg{display:flex;flex-wrap:wrap;gap:6px 14px;}
.plt{display:flex;align-items:center;gap:4px;font-size:10px;color:var(--bld);}
.pdot{width:7px;height:7px;border-radius:2px;}
.vis{background:var(--soil);color:var(--cld);border-radius:8px;padding:16px 18px;}
.vl{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--sky);margin-bottom:7px;}
.vt{font-size:13px;line-height:1.6;color:var(--stn);}
.pc2{background:var(--cld);border-radius:8px;border:1px solid var(--stn);padding:14px;cursor:pointer;transition:.15s;position:relative;overflow:hidden;}
.pc2:hover{box-shadow:0 2px 12px rgba(0,0,0,.08);border-color:var(--rin);transform:translateY(-1px);}
.pc2.sel{border-color:var(--wat);box-shadow:0 0 0 2px var(--sky);}
.ctb{position:absolute;top:0;left:0;right:0;height:4px;}
.thi .ctb{background:var(--hi);}.tmd .ctb{background:var(--cly);}.tlo .ctb{background:var(--pne);}
.ctop{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:9px;}
.av{width:34px;height:34px;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:white;flex-shrink:0;}
.avh{background:var(--hi);}.avm{background:var(--cly);}.avl{background:var(--pne);}
.pn2{font-size:12px;font-weight:700;color:var(--soil);margin-bottom:2px;line-height:1.3;}
.pc2 .pc{font-size:10px;color:var(--bld);margin-bottom:8px;}
.pst{display:flex;gap:10px;margin-bottom:9px;}.pstv{font-size:13px;font-weight:700;color:var(--soil);}.pstl{font-size:8px;color:var(--stn);text-transform:uppercase;letter-spacing:.06em;margin-top:1px;}
.pft{display:flex;align-items:center;justify-content:space-between;padding-top:8px;border-top:1px solid var(--pbl);}
.pt2{font-size:9px;color:var(--bld);}.pto{color:var(--hi);font-weight:600;}
.dph{background:var(--soil);color:var(--cld);padding:18px;}
.dptier{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--sky);margin-bottom:5px;}
.dpn{font-size:17px;font-weight:700;margin-bottom:3px;}.dpc{font-size:12px;color:var(--stn);}
.dpst{display:inline-block;padding:3px 9px;border-radius:10px;font-size:10px;font-weight:700;background:rgba(255,255,255,.15);color:var(--gld);margin-top:7px;}
.dpb{padding:14px;}.dps{margin-bottom:16px;}
.secl{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--bld);margin-bottom:7px;border-bottom:1px solid var(--pbl);padding-bottom:4px;}
.team-edit-btn{background:none;border:1px dashed var(--stn);border-radius:5px;padding:4px 10px;font-size:10px;color:var(--bld);cursor:pointer;margin-top:8px;width:100%;text-align:center;}
.team-edit-btn:hover{background:var(--pbl);color:var(--soil);}
.tmr{display:flex;align-items:center;gap:10px;padding:7px 0;border-bottom:1px solid var(--pbl);}
.tmr:last-child{border-bottom:none;}
.tmi{width:30px;height:30px;border-radius:6px;background:var(--wat);color:white;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0;}
.tmd{flex:1;}
.tmn{font-size:11px;font-weight:700;color:var(--soil);}
.tmr2{font-size:10px;color:var(--bld);margin-top:1px;}
.tmb{font-size:9px;font-weight:700;background:#EBF4F8;color:var(--wat);padding:2px 7px;border-radius:3px;white-space:nowrap;}
.mr{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px solid var(--pbl);}
.mr:last-child{border-bottom:none;}.mrl{font-size:11px;color:var(--bld);}.mrv{font-size:11px;font-weight:600;color:var(--soil);}
.wr{display:flex;align-items:flex-start;gap:7px;padding:5px 0;border-bottom:1px solid var(--pbl);}
.wr:last-child{border-bottom:none;}.ww{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;width:55px;flex-shrink:0;}
.wwa{color:var(--wat);}.wwp{color:var(--cly);}.wwc{color:var(--pne);}
.wt{font-size:10px;color:var(--bld);line-height:1.4;}
.ai2{display:flex;gap:7px;padding:5px 0;border-bottom:1px solid var(--pbl);}
.ai2:last-child{border-bottom:none;}.adot{width:5px;height:5px;border-radius:50%;background:var(--stn);flex-shrink:0;margin-top:4px;}
.at{font-size:10px;color:var(--soil);line-height:1.4;}.ad{font-size:9px;color:var(--stn);margin-top:2px;}
.dpa{display:flex;flex-direction:column;gap:7px;padding:14px;border-top:1px solid var(--pbl);}
.apri{background:var(--wat);color:white;border:none;border-radius:6px;padding:8px 12px;font-size:11px;font-weight:600;cursor:pointer;text-align:center;transition:.15s;}
.apri:hover{background:#004466;}.apri:active{transform:scale(.97);}
.asec{background:var(--pbl);color:var(--soil);border:1px solid var(--stn);border-radius:6px;padding:6px 12px;font-size:11px;font-weight:600;cursor:pointer;text-align:center;transition:.15s;}
.asec:hover{background:var(--sky);}.asec:active{transform:scale(.97);}
.vb{padding:4px 9px;border:1px solid var(--stn);background:var(--pbl);border-radius:4px;font-size:10px;cursor:pointer;font-weight:600;color:var(--bld);transition:.15s;}
.vb.on{background:var(--soil);color:white;border-color:var(--soil);}
.ab{background:var(--wat);color:white;border:none;border-radius:5px;padding:5px 12px;font-size:11px;font-weight:600;cursor:pointer;transition:.15s;}
.ab:hover{background:#004466;}
.cop .coh{background:#D9EFF5;color:#0a6a85;}.cox .coh{background:#C9E0E4;color:#005068;}.cod .coh{background:#B5D4F0;color:#0a3f6f;}.cot .coh{background:#FDE8D5;color:#7a3510;}.coa .coh{background:#D8EDCA;color:#2e5a0a;}.coi .coh{background:var(--pbl);color:var(--bld);}.con .coh{background:#F5E9E9;color:#8a2020;}
.coc{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;font-size:9px;font-weight:800;background:rgba(0,0,0,.12);color:inherit;}
.cov{font-size:9px;font-weight:600;color:inherit;opacity:.7;}
.dc{background:var(--cld);border-radius:5px;padding:9px 11px;border:1px solid var(--stn);cursor:pointer;transition:.15s;}
.dc:hover{box-shadow:0 2px 8px rgba(0,0,0,.1);border-color:var(--rin);transform:translateY(-1px);}
.dc.open{border-color:var(--wat);box-shadow:0 0 0 1px var(--sky);}
.dn{font-size:11px;font-weight:700;color:var(--soil);margin-bottom:2px;}.dcon{font-size:9px;color:var(--bld);margin-bottom:6px;}
.df{display:flex;align-items:center;justify-content:space-between;}.dv{font-size:10px;font-weight:700;color:var(--wat);}.dd{font-size:9px;color:var(--stn);}
.dtd{width:5px;height:5px;border-radius:50%;display:inline-block;margin-right:3px;}
.dthi{background:var(--hi);}.dtmd{background:var(--cly);}.dtlo{background:var(--pne);}
.dtg{display:inline-block;font-size:8px;font-weight:600;padding:1px 4px;border-radius:3px;margin-bottom:4px;}
.tge{background:#EBF4F8;color:var(--wat);}.tgp{background:#FEF0E4;color:var(--cly);}
.dov{font-size:8px;color:var(--hi);font-weight:600;}
.dc-exp{display:none;margin-top:8px;padding-top:8px;border-top:1px solid var(--pbl);font-size:10px;color:var(--bld);line-height:1.5;}
.dc.open .dc-exp{display:block;}
.acrd{border:1.5px dashed var(--stn);border-radius:5px;padding:7px;cursor:pointer;text-align:center;font-size:10px;color:var(--bld);transition:.15s;}
.acrd:hover{border-color:var(--wat);color:var(--wat);}
.ecol{font-size:10px;color:var(--stn);text-align:center;padding:12px 0;}
.pstps{display:flex;flex-direction:column;gap:0;}
.st{display:flex;gap:14px;position:relative;padding-bottom:20px;}.st:last-child{padding-bottom:0;}
.stl{display:flex;flex-direction:column;align-items:center;}
.stn2{width:30px;height:30px;border-radius:50%;background:var(--wat);color:white;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.stc{width:2px;background:var(--stn);flex:1;margin-top:3px;}.st:last-child .stc{display:none;}
.stb{flex:1;padding-top:3px;cursor:pointer;}
.sts{display:inline-block;font-size:9px;font-weight:700;padding:2px 6px;border-radius:3px;background:#EBF4F8;color:var(--wat);margin-bottom:7px;text-transform:uppercase;letter-spacing:.06em;}
.stt{font-size:13px;font-weight:700;color:var(--soil);margin-bottom:3px;}
.std{font-size:11px;color:var(--bld);line-height:1.6;margin-bottom:7px;}
.stcrit{background:var(--pbl);border-radius:5px;padding:9px 11px;max-height:0;overflow:hidden;transition:.3s;}
.stb.open .stcrit{max-height:300px;}
.crl{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--bld);margin-bottom:5px;}
.crlist{list-style:none;}
.crlist li{font-size:10px;color:var(--soil);padding:2px 0;display:flex;gap:5px;}
.crlist li::before{content:'✓';color:var(--pne);font-weight:700;flex-shrink:0;}
.tgrd{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.tc{border-radius:7px;border:1px solid var(--stn);overflow:hidden;}
.tch{padding:12px 14px;}.tch.hi{background:linear-gradient(135deg,#FCEBEB,#FDF5F5);border-bottom:3px solid var(--hi);}
.tch.md{background:linear-gradient(135deg,#FEF0E4,#FFF8F3);border-bottom:3px solid var(--cly);}
.tch.lo{background:linear-gradient(135deg,#EAF3DE,#F4FAF0);border-bottom:3px solid var(--pne);}
.tct{font-size:13px;font-weight:700;}.tc-hi{color:var(--hi);}.tc-md{color:var(--cly);}.tc-lo{color:var(--pne);}
.tcs{font-size:10px;color:var(--bld);margin-top:2px;}.tcb{background:var(--cld);padding:12px 14px;}
.ti{padding:6px 0;border-bottom:1px solid var(--pbl);}.ti:last-child{border-bottom:none;}
.til{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--stn);margin-bottom:2px;}.tiv{font-size:11px;color:var(--soil);}
.qgd{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.qcd{background:var(--cld);border:1px solid var(--stn);border-radius:7px;padding:12px 14px;}
.qct{font-size:11px;font-weight:700;color:var(--soil);margin-bottom:9px;display:flex;align-items:center;gap:5px;}
.qi2{font-size:10px;color:var(--bld);padding:3px 0;border-bottom:1px solid var(--pbl);display:flex;gap:5px;line-height:1.4;}
.qi2:last-child{border-bottom:none;}.qck{color:var(--pne);font-weight:700;flex-shrink:0;}.qx{color:var(--hi);font-weight:700;flex-shrink:0;}
.wb{display:inline-block;font-size:8px;font-weight:700;padding:2px 5px;border-radius:3px;}
.wba{background:#EBF4F8;color:var(--wat);}.wbp{background:#FEF0E4;color:var(--cly);}.wbc{background:#EAF3DE;color:var(--pne);}
.tlgrd{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.tlc{background:var(--cld);border:1px solid var(--stn);border-radius:7px;padding:14px;}
.tlh{display:flex;align-items:flex-start;gap:9px;margin-bottom:9px;}.tli{font-size:22px;flex-shrink:0;}
.tln{font-size:12px;font-weight:700;color:var(--soil);}.tltrig{font-size:9px;color:var(--bld);margin-top:2px;}
.tls{font-size:10px;color:var(--bld);padding:3px 0;border-bottom:1px solid var(--pbl);display:flex;gap:7px;}
.tls:last-child{border-bottom:none;}.tlsn{font-size:9px;font-weight:700;color:var(--wat);flex-shrink:0;width:13px;}
.tllnch{display:block;margin-top:10px;text-align:center;background:var(--wat);color:white;border:none;border-radius:5px;padding:7px;font-size:10px;font-weight:600;cursor:pointer;width:100%;transition:.15s;}
.tllnch:hover{background:#004466;}
.rsh{border:1px solid var(--stn);background:var(--cld);border-radius:6px;padding:6px 12px;font-size:12px;width:230px;}
.fp{padding:5px 12px;border-radius:18px;border:1px solid var(--stn);background:var(--cld);font-size:10px;font-weight:600;color:var(--bld);cursor:pointer;transition:.15s;}
.fp.on{background:var(--soil);color:white;border-color:var(--soil);}
.rssec{margin-bottom:28px;}
.rssh{display:flex;align-items:center;gap:9px;margin-bottom:12px;padding-bottom:7px;border-bottom:2px solid var(--soil);}
.rssi{font-size:17px;}.rsstt{font-size:14px;font-weight:700;color:var(--soil);}
.rssc{font-size:10px;color:var(--bld);background:var(--pbl);padding:2px 7px;border-radius:9px;}
.dgrd{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:11px;}
.dcd{background:var(--cld);border:1px solid var(--stn);border-radius:7px;padding:12px;cursor:pointer;transition:.15s;display:flex;flex-direction:column;}
.dcd:hover{box-shadow:0 2px 10px rgba(0,0,0,.08);border-color:var(--rin);transform:translateY(-1px);}
.dcd.hl{border-color:var(--wat);background:#F0F7FF;}
.dir{display:flex;align-items:center;gap:9px;margin-bottom:9px;}
.dic{width:34px;height:34px;border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.diw{background:#EBF1FB;}.die{background:#EBF5EE;}.dil{background:var(--pbl);}
.dn2{font-size:11px;font-weight:700;color:var(--soil);line-height:1.3;flex:1;}
.dmt{font-size:9px;color:var(--stn);margin-top:auto;padding-top:9px;border-top:1px solid var(--pbl);display:flex;align-items:center;justify-content:space-between;}
.dv2{font-size:9px;font-weight:600;background:#EBF4F8;color:var(--wat);padding:1px 4px;border-radius:3px;}
.da{font-size:9px;color:var(--wat);font-weight:600;cursor:pointer;}
.dtg2{display:inline-block;font-size:8px;font-weight:600;padding:2px 4px;border-radius:3px;margin-bottom:5px;}
.tca{background:#EAF3DE;color:var(--pne);}.tlv{background:#EBF4F8;color:var(--wat);}
.llst{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:9px;}
.li{background:var(--cld);border:1px solid var(--stn);border-radius:7px;padding:11px 12px;cursor:pointer;display:flex;align-items:center;gap:11px;transition:.15s;}
.li:hover{border-color:var(--rin);background:var(--pbl);transform:translateY(-1px);}
.lic{font-size:19px;flex-shrink:0;}.lin{flex:1;}.linm{font-size:11px;font-weight:700;color:var(--soil);}.lind{font-size:9px;color:var(--bld);margin-top:2px;}.lar{font-size:11px;color:var(--stn);}
.upz{border:2px dashed var(--stn);border-radius:7px;padding:18px;text-align:center;color:var(--bld);font-size:11px;cursor:pointer;transition:.15s;}
.upz:hover{border-color:var(--wat);color:var(--wat);}
.toast{position:fixed;bottom:20px;right:20px;background:var(--soil);color:white;padding:10px 16px;border-radius:7px;font-size:12px;font-weight:600;z-index:999;transform:translateY(80px);opacity:0;transition:.3s;pointer-events:none;}
.toast.show{transform:translateY(0);opacity:1;}

/* Added per extraction task: 'Untiered' tier variant using var(--stn) — 0 of 11 partners are tiered in HubSpot. */
.tier-untiered{background:var(--stn);color:var(--soil);}
.tier-untiered .td{background:var(--stn);}
.tier-untiered .ctb{background:var(--stn);}
